Verwenden Sie im Builder des Karriereportals den Layout-Teil, um das Aussehen des Layouts zu definieren. Dies ist fortgeschrittener als die Verwendung der normalen integrierten Funktionen des Builders.
Allgemeines
-
Ein Layout ist das „Design“ einer Karriereseite. Eine Website kann mehrere Layouts haben, es kann jedoch nur ein Standardlayout ausgewählt werden.
-
Layouts werden verwendet, um die nichtdynamischen Elemente der Website zu definieren, z. B. die Kopfzeile, die Fußzeile, die Funktionsseiten sowie das HTML, CSS und JavaScript für die Website, die das Layout verwendet.
Styling-Elemente
Der Styling-Tab wird verwendet, um Parameter hinzuzufügen, die einfach im Code aufgerufen werden können. Der Tab Styling besteht aus Farben, Schriftarten, Bildern und Dateien.
Anmerkung
Dies wird nur verwendet, um die Parameter zu erstellen, und Änderungen hier sind möglicherweise nicht wirksam, es sei denn, der Parameter wird im Code verwendet.
-
Farben: Mit den Farbparametern können Sie die gewünschte Farbe auswählen, indem Sie auf das HEX-Code-Feld (#xxx) klicken, um einen Farbverlauf auszuwählen. Dazu gehören auch RGBA-Farben
-
Schriften: Schriftparameter werden verwendet, um bestimmte Schriftarten zu definieren, die im Code aufgerufen werden können. Die Optionen sind Arial, Proxima Nova und Verdana. Es ist möglich, eine eigene Schrift zu erstellen und auf die Karriereseite hochzuladen.
-
Bilder und Dateien: Diese Abschnitte funktionieren auf die gleiche Weise und ermöglichen es Ihnen, eine Datei oder ein Bild hochzuladen.
-
Sektionen: Sektionen ermöglichen es Ihnen, seitenweite Abschnitte hinzuzufügen, die auf jeder Seite erscheinen, die dieses Layout verwendet. Neue Abschnitte bestehen aus dem Typ „Standardabschnitte".
-
Inhalt: Der Inhalt kann nicht entfernt oder bearbeitet werden und wird verwendet, um die Abschnitte anzuzeigen, die auf den Seiten des Editors eingerichtet sind.
Seiten
Der Seiten-Abschnitt ermöglicht es Ihnen die Einrichtung aller Funktionsseiten zu definieren. Dazu gehören Stellenausschreibungen, Bewerbungsseiten, Seiten mit Bewerbungsfehlern/ Beworben-Seiten, Veranstaltungsseiten, Formularseiten, Kandidatenprofile und Feedbackseiten
-
Unter und können Sie die Einrichtung der Seite wählen.
-
Dadurch wird eine Abschnitts-Setup-Box angezeigt. Fügen Sie hier neue Abschnitte hinzu, erstellen Sie fest codierte Abschnitte und viele andere Arten von Funktionen.
Anmerkung
Auf jeder Unterseite stehen verschiedene Optionen zur Verfügung für die Inhalt, um das dynamische Setup zu ändern.
Anmerkung
Job Agent beinhaltet die Faktenbox mit Daten, Karten und Aktivatoren für das Teilen in sozialen Netzwerken.
Andere Funktionen
-
Styling: Ermöglicht es Ihnen, die Höhe des Abschnitts, Hintergrund Bild/Video, und Farbüberlagerung der Seite zu definieren und Benutzerdefiniertes Styling zu erstellen, wenn es aktiviert ist.
-
Layout: Das Layout hat zwei Optionen: Standard- und benutzerdefinierter Code. Die Standardeinstellung behält die allgemeine Layoutstruktur bei und benutzerdefinierte Codes ermöglichen eine benutzerdefinierte Stellenanzeige. Benutzerdefinierter Code besteht aus HTML, JavaScript und CSS.
-
HTML: Diese Abschnitte werden verwendet, um hart kodiertes HTLM auf der Seite zu bearbeiten. Nicht alles kann bearbeitet werden, da einiges an verstecktem Code im HTLM <head> intakt bleiben muss, um die Funktionalität zu bewahren.
-
Der <HTML> head Abschnitt: ermöglicht es Ihnen HTML Code zu den Layouts <head> hinzuzufügen. Sie können auch einen <script> tag verwenden, wenn ein Script das vom <head> tag läuft benötigt wird.
-
Der <HTML> body Abschnitt: Dieser Abschnitt lässt Sie den Code des seitenweiten HTLM <body> ändern, wenn benutzerdefiniertes HTML über alle Seiten hinweg benötigt wird. Denken Sie daran, dass class names in manchen Fällen Funktionalität haben und somit beibehalten werden müssen.
Warnung
Dieser Code verwendet JavaScript-Handlebars, um dynamische Daten zu drucken ({{xxx}}). Entfernen Sie diese nicht, es sei denn, Sie kennen sich mit der Funktionalität von Handlebars aus.
-
HTML </body>: Lässt Sie den letzten HTML tag definieren bevor Sie den <body> abschließen.
-
-
CSS: Wo Farbparameter verwendet werden können und das CSS des Layouts definiert werden kann. Denken Sie daran, dass benutzerdefinierte Codeabschnitte zu den spezifischen Seiten hinzugefügt werden können und das CSS in den Layouts für das gesamte CSS der Website verwendet werden soll.
-
JavaScript: Wird verwendet, um JavaScript-Code zu schreiben. Der geschriebene Code wird am Ende des HTML-<head>-Bereichs ausgeführt.
Anmerkung
JavaScript-Handlebars und Parameter können in diesem Code verwendet werden.
-
E-Mail: Der E-Mail-Bereich wird verwendet, um das HTML-Setup des E-Mail-Designs zu ändern, das an das Layout angehängt ist. Der Name des Layouts entspricht einem Designnamen, wenn eine E-Mail über Emply gesendet wird.
Warnung
Parameter können nicht für E-Mails verwendet werden, da Parameter beim Laden der Karriereseite gelesen werden und eine E-Mail außerhalb der Karriereseite gelesen wird.
Warnung
Stellen Sie sicher, dass der
<insertMacro item='ContentPlaceHolder' />Code zu jeder Zeit präsent ist, da dieser den Inhalt der Mail schreibt.
Parameters
Parameter werden beim Laden der Karriereseite gelesen und können es sehr einfach machen, Farben und Aussehen einer Seite zu ändern.
Parameter funktionieren nur, wenn sie in das HTML oder CSS der Seite geschrieben werden, zum Beispiel eine Überschrift mit einem Farbparameter:
.css_headline {
color: @color_2;
}
Überschriften verwenden standardmäßig das deklarierte @color_2 -Styling-Element.
Titel von Styling-Parametern haben keine Auswirkung, daher ändert ein Parameter mit dem Namen „button“ möglicherweise nicht die Farbe einer Schaltfläche, wenn das CSS nicht so eingerichtet ist, dass es diesen Parameter liest.
Es gibt 4 Arten von Parametern:
-
Farbe: Wird verwendet, um eine Hex/RGBA-Farbe zu definieren, die mit einer @color_x -Deklaration aufgerufen werden soll.
-
Schrift: Wird verwendet, um eine eingebaute Schrift zu definieren, die mit einer @font_x -Deklaration aufgerufen werden soll.
-
Bilder: Wird verwendet, um ein hochgeladenes Bild zu definieren, das mit einer @image_x -Deklaration aufgerufen werden soll.
-
Dateien: Wird verwendet, um eine hochgeladene Datei zu definieren, die mit einer @image_x -Deklaration aufgerufen werden soll.
Der @type_x -Code ist einzigartig und kann nicht wiederverwendet werden. Wenn @image_1 gelöscht wird, lautet der nächste erstellte Parameter @image_2.
Es kann vorkommen, dass bestimmte Schriften auf den Karriereseiten verwendet werden müssen. Im Folgenden finden Sie eine Anleitung, wie Sie dies tun können, wenn Sie eine Schriftdatei haben, die zur Website hinzugefügt werden muss.
-
Beginne auf der Hauptmenüseite von Emply und klicken Sie dann auf .
-
Klicken Sie auf Zahnrad-Symbol für Einstellungen oben im Bearbeitungsfenster.
-
Klicken Sie auf Layout und dann das Bleistift-Symbol, um das gewünschte Layout zu bearbeiten.
Anmerkung
Wenn die Seite mehrere Layouts hat, müssen alle folgenden Schritte für jedes Layout ausgeführt werden, in dem die Schriftart verwendet wird.
-
Falten Sie auf der Layout-Seite auf und finden Sie den Abschnitt Dateien. Klicken Sie auf , und laden Sie die gewünschte Schriftdatei hoch.
-
Nachdem die gewünschte Datei im Tab hinzugefügt wurde, muss der folgende Codeausschnitt im <head>-Bereich des HTML-Dokuments eingefügt werden.
Wichtig
Es ist entscheidend, dies im <head>-Bereich des HTML-Dokuments zu tun, damit die Schriftart beim Aufrufen der Seite zuerst geladen wird.
<style>
@font-face {
font-family:xx;
src: url(xx);
}
</style>
-
Schriftfamilie (font family): Hier müssen Sie „xx“ durch den gewünschten Namen, der für den Aufruf der Schrift im CSS-Code verwendet wird, ersetzen. Was Sie hier schreiben, ist völlig optional, aber es ist wichtig, dass Sie sich daran erinnern, was hier geschrieben steht.
-
src: url(xx): Hier fügen Sie die "@file_x" ID ein, die in den Dateien-Abschnitt kopiert werden kann. Jede hier hochgeladene Datei erhält eine eindeutige "@file_x"-Kennung. Wenn Sie also mehrere Schriftarten auf der Seite haben, müssen Sie beachten, dass Sie für jede Schriftart das richtige @ verwenden.
-
-
Nachdem das Obige erledigt ist, können wir die Schriftart im CSS-Code aufrufen.
Anmerkung
Der im Font-Family-Code aufgerufene Name muss derselbe sein, der im vorherigen Schritt geschrieben wurde.
Achtung
Achten Sie auf Groß- und Kleinbuchstaben.
Anmerkung
Schriften werden oft im Cache Ihres Browsers gespeichert. Sie können dies vorzugsweise in einem Inkognito-Tab tun. Wenn Sie jedoch nach den obigen Schritten keine Änderung der Schriftart feststellen, müssen Sie möglicherweise den Cache Ihres Browsers leeren