Mit Klick auf das Haus-Icon „Webseite“ (im Hauptmenü ganz oben) gelangen Sie in die Editor-Ansicht zum Bearbeiten Ihrer Startseite.
IHRE STARTSEITE
Das Hauptmenü entspricht (bis auf die Publizierung) der späteren Menüleiste (Hauptnavigation) Ihrer Website.
Um Ihnen die Arbeit zu erleichtern, hat Ihnen Märklin bereits einige fixe Inhalte vorbereitet und zur Verfügung gestellt. Diese werden Sie später auf Ihrer fertigen Seite sehen. Wir wollen uns nun aber ansehen, wie Sie darüber hinaus eigene Inhalte einfügen können.
SLIDER
An oberster Stelle Ihrer Homepage befindet sich ein sogenannter „Slider“. Sie kennen Slider von anderen Webseiten – Bilder und Texte werden hier mit einigen Sekunden Verzögerung von links nach rechts durchgeschoben (engl. to slide).
Die mhi hat diesen Slider bereits mit Inhalten (Text und Bild) für Sie vorbefüllt. Sie haben die Möglichkeit, speziell für Ihr Unternehmen weitere Inhalte zu ergänzen. Das wollen wir nun gemeinsam tun.
Klicken Sie hierzu auf den Button „Slider Bearbeiten“ – Sie gelangen in folgende Ansicht.
Der Slider enthält noch keine individuellen Inhalte von Ihnen und erscheint deshalb leer. Mit Klick auf das rote Plus Symbol können Sie das ändern und gelangen in den Bearbeitungs-Modus (Bild-Editor). Der Slider benötigt zunächst ein Bild, dass Sie von Ihrem PC hochladen. Es sollte, wenn möglich, ein großes Bild sein, mit einer Auflösung von 1.800 x 685 Pixeln oder größer.
Nachdem Sie das Bild aus dem Datei-Verzeichnis Ihres PCs ausgewählt haben, werden Sie aufgefordert dieses auf die Seitenproportionen des Sliders zuzuschneiden.
Mit dem Beschneidungswerkzeug können Sie den Auswahlrahmen auf die gewünschte Stelle Ihres Bildes ziehen. Den Rahmen können Sie durch Fassen der Eckpunkte mit der Maus vergrößern oder verkleinern – immer proportional zum definierten Seitenverhältnis des Sliders. Sind Sie mit Ihrer Auswahl zufrieden, wird diese mit Klick auf den Button „Speichern“ entsprechend übernommen und daraus in der Editor-Ansicht ein Slider-Element erzeugt.
An sich ist das Slider-Element (Slide) mit dem Bild nun schon fertig. Sie können aber optional auch noch Text ergänzen. Durch Klick auf das Vorschaubild gelangen Sie in den Bearbeitungsmodus für die Textelemente und können je Slider eine Bildunterschrift, Überschrift, Unterüberschrift und/oder Fließtext definieren.
Dazu überschreiben Sie einfach die Platzhaltertexte mit Ihrem eigenen Text. Sollte es sich um eine zeitlich begrenzte Aktion – zum Beispiel Ihren Tag der offenen Tür – handeln, können Sie unten auf der Seite ein Veröffentlichungs- und ein Ablaufdatum angeben, von wann bis wann der Text erscheinen soll.
Übrigens: Alle Texte erscheinen automatisch in der Schriftart, die Sie in Ihren Einstellungen bei „Schrift“ definiert haben.
Wie Sie den Button bearbeiten und darüber auf andere Seiten verweisen können, zeigen wir Ihnen weiter unten im Detail. Aktuell wird dieser in der Live-Darstellung ausgeblendet – da nicht befüllt.
Gratuliere! Sie haben mit Klick auf „Speichern“ Ihr erstes Slider-Element erzeugt. Weitere ergänzen Sie mit Klick auf das rote Plus Symbol rechts neben dem ersten Element.
TIPP:
Achten Sie bitte unbedingt auf die Bildrechte, bevor Sie Fotos auf Ihrer Website publizieren, ansonsten drohen Ihnen Abmahnungen bis hin zu Geldstrafen.
PUBLIZIERUNG
Nun sind Sie sicher schon gespannt und möchten sehen, wie Ihre Webseite denn tatsächlich aussehen wird. Sie ist noch nicht ganz fertig, aber Sie können einen ersten Blick riskieren. Klicken Sie dazu auf den Hauptmenü-Punkt „Publizierung“ und danach auf den Button „Jetzt publizieren“. In wenigen Sekunden ist Ihre Website erzeugt – der Link zur Liveseite wird rechts vom Button angezeigt. Klicken Sie darauf und Sie bekommen einen ersten Eindruck Ihrer tatsächlichen Webseite – eine schöne Kombination der Inhalte, die von der mhi bereitgestellt wurden, und Ihrer selbst erzeugten Elemente.
Scrollen Sie auf dieser Seite nach unten: Alle eingegebenen Artikel, inklusive der Öffnungszeiten und Ihres Impressums, werden hier schon angezeigt.
In den folgenden Absätzen wollen wir uns damit beschäftigen, wie Sie weitere eigene Inhalte und Seiten erzeugen können.
eigene inhalte ergänzen
Gehen Sie dazu wieder zurück in das Backoffice Ihrer Anwendung – der Browser hat für Ihre Liveseite einen zweiten Tab geöffnet.
Lassen Sie uns zunächst einmal exemplarisch die Seite „Über uns“ betrachten. Dazu klicken Sie im Hauptmenü auf „Über uns“.
In der Editor-Ansicht der ausgewählten Seite bekommen Sie einen Überblick, welche inhaltliche Struktur mhi für die jeweilige Seite vorgesehen hat – sie setzt sich zum Beispiel zusammen aus Texten, Bildern, einer Bildgalerie, automatisierten Inhalten, usw.
Die vorgesehenen Platzhalter können Sie mit eigenen Inhalten befüllen – die automatisierten Bereiche spielen vorbereitete Texte und Bilder von mhi aus und können nicht verändert werden.
Templates
Über die vorbereiteten mhi Inhalte hinaus können Sie die Seite um eigene Layoutelemente erweitern. Sie haben die Möglichkeit aus einer Reihe von standardisierten Layout-Vorlagen auszuwählen. Diese Vorlagen nennt man Templates. Die einzelnen Templates der Website werden durch die Buttons mit dem roten Plus Symbol voneinander abgetrennt. Durch Klick auf ein rotes Plus fügen Sie an dieser Stelle ein neues Element ein.
Über die Auswahl „Template“ können Sie aus einer Reihe der vorgefertigten Templates auswählen.
TIPP:
Mit Klick auf „Marktplatz Templates“ gelangen Sie in eine Übersicht bereits inhaltlich für Sie vorbereiteter Templates zu unterschiedlichen Themen. Sie können aus fertigen Artikeln auswählen, die mhi regelmäßig für Sie bereitstellt.
Lassen Sie uns zunächst einmal aus dem Pull-Down-Menü den Eintrag „Template“ auswählen. Hier sehen Sie eine Übersicht aller bereitgestellten Vorlagen. Keine Angst – Sie müssen diese nicht alle verwenden. Eine beliebte Standardvorlage ist z.B. die Vorlage Text/Bild, anhand der wir Ihnen exemplarisch zeigen, wie Sie eigene Inhalte auf Ihrer Website aufbauen können.
Das text-bild-template
Wir werden diese Vorlage nun der Reihe nach mit Inhalten befüllen. Zunächst laden wir ein Bild hoch.
Mit Klick auf den Button „Bild hochladen“ gelangen Sie in das Datei-Verzeichnis Ihres PCs und können dort ein passendes Bild auswählen. Wie Sie das Bild im Editor zuschneiden, haben wir Ihnen bereits im vorherigen Kapitel gezeigt. Treffen Sie den gewünschten Zuschnitt. Mit Klick auf „Speichern" wird ihr Bild entsprechend abgespeichert und in die Vorschau des Text-Bild-Templates integriert.
Texte geben Sie einfach durch Überschreiben der Platzhaltertexte im Template ein. Dies gilt sowohl für die Bildunterschrift als auch für die Textplatzhalter in der Farbfläche rechts für eine optionale Überschrift und/oder einen beschreibenden Text.
TIPP
Falls Sie einmal keinen Text eingeben - also der Platzhaltertext stehen bleibt - wird dieser später auf Ihrer Webseite nicht ausgegeben, sondern ausgeblendet. So sind Sie in der Lage, die Template-Elemente flexibel zu nutzen und z.B. auf den beschreibenden Text zu verzichten, wenn Sie diesen nicht benötigen.
Buttons
Nun wollen wir uns den Button einmal näher ansehen. Durch Klick auf „Button bearbeiten“ gelangen Sie in ein Eingabefenster, in dem Sie definieren, wie der Button beschriftet werden soll und welche Aktionen ein Klick darauf auslöst.
Die Einstellmöglichkeiten sollten relativ selbsterklärend sein. Zunächst geben Sie in das Eingabefeld "Titel" ein, welcher Text als Beschriftung auf dem Button erscheinen soll. Mit den Radiobuttons danach definieren Sie, was nach Klick auf den Button auf Ihrer Webseite passieren soll.
Falls Sie dem Anwender zum Beispiel ein Datenblatt zur Verfügung stellen möchten, können Sie dieses über die Aktion „Datei-Download“ verknüpfen. Über den Button „Datei hochladen“ laden Sie eine PDF-Datei von Ihrem Rechner auf Ihre Website hoch. Diese Datei ist dann automatisch mit dem Button verknüpft. Der Text auf dem Button sollte entsprechend lauten, z.B. „Datei herunterladen“.
interner link
Wählen Sie "Interner Link", so zeigt Ihnen das System alle Seiten innerhalb Ihrer bestehenden Seitenstruktur an, auf die Sie innerhalb Ihrer Webseite direkt verlinken können.
Externer link
Ein "Externer Link" verweist auf eine andere Seite im Internet (URL), wie hier im Beispiel auf die Seite des Herstellers MÄRKLIN. Vergessen Sie nicht, den Link komplett einzugeben.
TIPP:
Gehen Sie dazu am besten auf die Ziel-Website, auf die Sie verlinken möchten, und kopieren Sie den kompletten Pfad aus der Kopfzeile Ihres Browsers in das Eingabefeld bei „Externer Link“.
NEUE SEITe
Durch Auswahl der Checkbox "Seite" können Sie eine komplett neue Seite innerhalb Ihrer Website-Struktur erstellen und darauf verknüpfen. So sind Sie in der Lage komplexe Websites – tief verschachtelt – zu realisieren.
Im Editor erscheint eine leere Seite ohne Templates. Sie können diese individuell durch Klick auf das rote Plus Symbol und Auswahl der gewünschten Templates aus der Template-Übersicht befüllen.
BUTton-design
Im Bereich "Design" haben Sie zwei Auswahlmöglichkeiten für die optische Darstellung des Buttons. Der Primärbutton ist – wie der Name schon sagt – etwas aufmerksamkeitsstarker gestaltet. Der Sekundärbutton ein bisschen weniger auffällig. So können Sie Buttons innerhalb Ihrer Website priorisieren. Probieren Sie es einfach aus!
Damit sind wir mit der Einführung schon fertig. Vergessen Sie nicht sich auszuloggen – den Button dazu finden Sie rechts oben.
Wir glauben, dass Sie mit den hier gegebenen Möglichkeiten und ein wenig Übung umfangreiche und sehr ansprechende Websites erzeugen können. Viel Spaß dabei!
Ihr Team der Märklin Händler Initiative und ATRIVIO
Weitere Themen
