51

Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

  • Upload
    others

  • View
    2

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes
Page 2: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Alexander Kerscher

PREVIEW Das JIMDO-Codebuch Clevere Design-Anpassungen von Amsterdam bis Zurich - für JIMDO CREATOR.

7. überarbeitete Ausgabe 2020

Page 3: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Mehr Infos unter: www.Jimdo-Handbuch.de

PREVIEW Dieses Buch/E-Book und seine Inhalte sind keine Produkte der Jimdo GmbH sondern made by Fruits & Harvest in Köln. Alle Inhalte sind urheberrechtlich geschützt, jede Verwertung bedarf der Erlaubnis des Autors. Verwendung des JIMDO-Logos mit freundlicher Genehmigung der JIMDO GmbH. Fruits & Harvest Inh. Alexander Kerscher Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln www.fruits-harvest.de www.jimdo-handbuch.de

Page 4: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Gewidmet dem, der immer einen Weg fand

Dr. Rudolf Kerscher 1928 - 2018

Page 5: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

PREVIEW

Willkommen beim JIMDO Creator ....................................... 7

Hinweise zur Verwendung ..................................................... 9

Einbauanleitung ...................................................................... 10 Hinweis .................................................................................. 13 Bevor Sie loslegen... ........................................................... 13

Codes für die JIMDO Designs ............................................... 14 Amsterdam ........................................................................... 14 Barcelona .............................................................................. 18 Berlin ...................................................................................... 22 Bordeaux ............................................................................... 26 Cairo ........................................................................................ 30 Cape Town............................................................................. 34 Chicago .......................... Fehler! Textmarke nicht definiert. Copenhagen ................. Fehler! Textmarke nicht definiert. Dubai .............................. Fehler! Textmarke nicht definiert. Dublin ............................ Fehler! Textmarke nicht definiert. Florence ........................ Fehler! Textmarke nicht definiert. Hamburg ....................... Fehler! Textmarke nicht definiert. Havana ........................... Fehler! Textmarke nicht definiert. Helsinki ......................... Fehler! Textmarke nicht definiert. Hong Kong .................... Fehler! Textmarke nicht definiert. Lille ................................. Fehler! Textmarke nicht definiert. Lima ................................ Fehler! Textmarke nicht definiert. Madrid ........................... Fehler! Textmarke nicht definiert. Malaga ........................... Fehler! Textmarke nicht definiert. Melbourne .................... Fehler! Textmarke nicht definiert. Miami ............................. Fehler! Textmarke nicht definiert. Milano ............................ Fehler! Textmarke nicht definiert.

Page 6: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

New York ...................... Fehler! Textmarke nicht definiert. Osaka ............................. Fehler! Textmarke nicht definiert. Paris ............................... Fehler! Textmarke nicht definiert. Prague ........................... Fehler! Textmarke nicht definiert. Reykjavik ...................... Fehler! Textmarke nicht definiert. Riga ................................. Fehler! Textmarke nicht definiert. Rio de Janeiro ............. Fehler! Textmarke nicht definiert. Rome .............................. Fehler! Textmarke nicht definiert. San Francisco .............. Fehler! Textmarke nicht definiert. Shanghai ....................... Fehler! Textmarke nicht definiert. Singapore ..................... Fehler! Textmarke nicht definiert. St. Petersburg ............. Fehler! Textmarke nicht definiert. Stockholm .................... Fehler! Textmarke nicht definiert. Sydney ........................... Fehler! Textmarke nicht definiert. Tokyo ............................. Fehler! Textmarke nicht definiert. Verona ........................... Fehler! Textmarke nicht definiert. Vienna ............................ Fehler! Textmarke nicht definiert. Zurich ............................. Fehler! Textmarke nicht definiert.

Funktionen für die JIMDO-Page ......................................... 39 Abstände im Bearbeiten-Modus markieren ............. 40 Codes im Bearbeiten-Modus markieren .................... 41 Kingsize Navigations-Bearbeitung ............................... 42 Jimdo-Lightbox in Weiss .................................................. 43 Pflegbarer Text im Bild .................................................... 44 Große Selectbox für Shopvarianten ............................ 45 Feldhinweise ausblenden ................................................ 46 Mouseover Bildervergrößerung ................................... 47 Bildslider ohne Steuerelemente ................................... 49 Der letzte Punkt ist ….rot! ............................................... 50 Einbauvideo ……………………………………………………..186

Page 7: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Willkommen beim JIMDO Creator Vielen Dank für Ihren Kauf des JIMDO Codebuches! Gab es bei JIMDO in den frühen Jahren zu viele – teilweise auch etwas schräg anmutende – Designs, die sich auch nur minimal anpassen ließen, so sind es beim JIMDO Creator aktuell 40 - mit den Namen wunderbarer Städte versehene - responsive Layouts, die in Verbindung mit dem smarten Style-Tool den Usern für ihre individuellen Designwünsche bereitstehen. Funktioniert super! Mit zusätzlichen CSS-Codes lassen sich noch viele weitere tolle Ideen umsetzen. Dieses Buch ist voll davon! Als JIMDO Expert bin ich – neben Arbeiten mit Systemen wie WordPress oder Typo3 – täglich mit der Umsetzung individueller Designwünsche und kompletten Projekten von JIMDO Nutzern beschäftigt. Hier entstand die Idee für das mittlerweile sehr beliebte JIMDO Codebuch. Es liefert für jedes dieser 40 Designs kurze Codes, die sich in wenigen Sekunden kinderleicht in die Seite einbauen lassen und damit schlaue Gestaltungsvarianten liefern, die mit den Style-Funktionen nicht eingestellt werden können. So ergeben sich andere Größen oder bessere Mobilansichten der Layouts und zusätzliche Designideen für Ihr Projekt – und das ist mit Sicherheit ein großer Gewinn an neuen Möglichkeiten. Auch wird das JIMDO Codebuch gerne als Einstieg in das Thema „CSS mit JIMDO“ verwendet – darauf bin ich besonders stolz. Die Entscheidung für CREATOR oder DOLPHIN wird dem Benutzer auf der JIMDO.de-Seite an einer Stelle unerwartet abverlangt und wird dort leider bewusst missverständlich gehalten:

Page 8: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Klicken Sie an diesem Punkt der Erstellung Ihrer JIMDO-Page links bei „Modernes Webdesign ohne Programmierer“ bestellen Sie JIMDO Dolphin und wenn Sie rechts klicken bei „Das System für Profis mit Coding-Funktion“ den JIMDO Creator. Aufgepasst! Wenn Sie sich einmal für Dolphin (links) entschieden haben, gibt es auch leider keine Möglichkeit zu Creator zu wechseln. Dass man für den (von uns empfohlenen) JIMDO Creator (rechts) ebenfalls keinen Programmierer benötigt aber einen großen Sack voller gestalterischer Möglichkeiten erhält wird leider nicht klar kommuniziert. Sollte man aber wissen! In dieser Version des JIMDO Codebuchs wurden alle Codes für JIMDO Creator überarbeitet und viel Augenmerk auf die mobilen Anpassungen gelegt. Auch haben wir wieder weitere erfolgreiche Funktionen aus unserer Plattform JimJim.de hinzugefügt. Auf geht’s und viel Spaß mit Ihrer JIMDO Creator Seite! Alexander Kerscher

Page 9: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Hinweise zur Verwendung Auf den nachfolgenden Seiten finden Sie von A bis Z alle derzeitigen JIMDO Creator-Designs, sowie ausgewählte Inhaltselemente - darunter die für dieses jeweilige Design oder Funktion geltenden Codes. Mit diesen Codes (die Sie aus diesem lizenzierten PDF herauskopieren und in Ihre JIMDO-Page einfügen können) bewirken Sie die beschriebenen Veränderungen. Für die Verwendung unserer Codes des JIMDO-Codebuches sollten Sie folgende Informationen zur Kenntnis nehmen.

Die Codes für die Designs funktionieren nur in Verbindung mit dem genannten Design. Wenn Sie das Design gegen ein anderes tauschen, sollten Sie die Codes des alten Designs entfernen und gegen die des neuen austauschen.

Sofern Sie noch andere CSS-Codes in Ihre JIMDO-Page „eingeschleust“ haben, kann es (bei gleichlautenden Codeklassen) theoretisch zu Konflikten kommen.

Durch (unangekündigte) Veränderungen der Designs vonseiten des Systemanbieters JIMDO können die Codes theoretisch ihre Wirkung verlieren. Es wird demnach keine uneingeschränkte Funktionalität zugesichert.

Die Codes finden nur eine Anwendung beim Produkt JIMDO Creator. Beim sogenannten JIMDO Dolphin können kaum Veränderungen (schon gar nicht über CSS-Codes) integriert werden.

Page 10: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Einbauanleitung Idee und Vorgehensweise sind spielend einfach:

1. Codes zum gewählten Design aus diesem PDF in Ihre JIMDO-Page (Bereich ‚Head bearbeiten‘) hineinkopieren

2. Speichern 3. Fertig!

So wird z.B. aus dem Design „Dubai“ mit diesem Aufbau

folgendes Full-Screen Web

Page 11: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Der Einsatzort für die Codes des JIMDO-Codebuches ist der Bereich „Head bearbeiten“: Diesen finden Sie auf Ihrer Jimdo-Page eingeloggt unter den „Einstellungen“ > im Bereich „Head bearbeiten“

Beim Klick auf „Head bearbeiten“ öffnet sich ein Texteingabe-Bereich, den Sie (unterhalb des Kartenreiters „Gesamte Webseite“) für die Code-Eingabe und das Abspeichern nutzen können. Eventuell befinden sich bereit in diesem Bereich Codes die wir Ihnen empfehlen zu sichern. Siehe dazu den Absatz „Bevor Sie loslegen…“ auf Seite 13 dieses Codebuchs.

Page 12: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Sobald Sie unter DESIGNS das entsprechende Layout (auf das sich der Code bezieht) eingestellt haben, können Sie hier

unsere Codes zu diesem Design einkopieren,

abspeichern und unten

rechts auf Ihrer JIMDO-Page die Besucher-Ansicht aktivieren oder sich abmelden.

Beim neuen Laden Ihrer JIMDO-Page werden die hinterlegten Codes aktiviert und das Design wird in Sekunden „umgebaut“. Fertig! Ein zusätzliches detailliertes Einbauvideo finden Sie unter

https://www.jimdo-handbuch.de/codebuch/

Page 13: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Hinweis Das JIMDO-Codebuch enthält unsere Codes in zwei Versionen zwischen denen Sie entscheiden können:

einmal als reinen Code zum Hineinkopieren mit allen sichtbaren Werten, die Sie ggf. mit eigenen Werten ersetzen können und

als CSS-Aufruf mit dem Sie unsere Codes von unserem externen Server in Ihre Seite hineinladen.

Sie brauchen nur eine dieser Codevarianten. Beide Aufrufarten werden im Head Ihrer JIMDO-Page platziert und abgespeichert. Die erste Variante (Code in die Seite kopieren) wird von Google im Sinne der Ladezeit und externer Aufrufe leicht favorisiert.

Bevor Sie loslegen... Vielleicht befinden sich in Ihrer JIMDO-Page im Bereich „Head bearbeiten“ bereits andere Codes. Zum Beispiel Google-Codes oder JavaScript-Aufrufe.

1. Machen Sie von diesen vorhandenen Codes eine Sicherheitskopie, indem Sie alle Inhalte kopieren und diese in einer – schlau benannten - Text-Datei abspeichern.

2. Löschen Sie nichts, was sie nicht löschen wollen. Alle Codes die Sie einfügen, sollten Sie zu den vorhandenen Codes hinzufügen. Also unsere Codes bitte davor oder dahinter einfügen. Am besten dahinter.

Page 14: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Codes für die JIMDO Designs

Amsterdam Ansicht Standard

Ansicht neu

Page 15: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Änderungen durch unser Script: Der Inhaltsbereich ist auf volle Breite (1255px) gezogen – hier hat Jimdo das Basis-Design bereits selbst vergrößert. Die Sidebar – die in den größeren Bildschirmansichten rechts neben dem Content platziert ist - wird nun unter den Inhaltsbereich verlagert und kann als pflegbarer Footer verwendet werden. Dadurch ergibt sich insbesondere in Tablets (hochkant) eine harmonischere Ansicht. In der Tablet- und Mobilversion wird ein verwendetes Logo mit einem minimalen Seitenabstand links etwas gefälliger platziert. Um diese Design-Änderungen vorzunehmen, bitte einen der nachfolgenden Codes im Bereich ‚Head bearbeiten‘ (Anleitung Seite 11) platzieren.

Page 16: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

REINER CSS-CODE

<style type="text/css">

/*<![CDATA[*/

/* copyright by jimjim.de / jimdo-handbuch.de */

/* AMSTERDAM 5 */

/* all size rules */

CODES IM DOWNLOAD-PDF VERFÜGBAR

/* big screen + ipad pro landscape */

@media only screen and (min-width: 1281px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* laptops + small screens */

@media only screen and (max-width: 1280px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* small tablets */

@media only screen and (max-width: 1024px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* mobiles */

@media only screen and (max-width: 767px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/*]]>*/

</style>

Page 17: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

ODER EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="https://www.jimhb.de/download/im-pdf-verfuegbar" />

Page 18: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Barcelona Ansicht Standard

Ansicht neu

Page 19: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Änderungen Unser Code macht aus Barcelona eine Webseite mit 100%iger Breite, der Inhaltsbereich ist bei 1600 Pixeln gedeckelt. Insgesamt steht so deutlich mehr Raum in den Desktop und Notebook-Varianten zur Verfügung. Mobil trennen wir uns vom nicht gestaltbaren oberen Balken und lösen in Richtung einer eleganten Burger-Navigation für Smartphones und Tablets auf. Dabei wird der übermäßige Raum oben und unten für das Logo reduziert – mobil entdeckt man so den Content (etwa eine Überschrift) früher. Die gutgemeinten aber unnötigen Transparenzen in der Mobil-Navigation werden aufgehoben. Um diese Design-Änderungen vorzunehmen, bitte einen der nachfolgenden Codes im Bereich ‚Head bearbeiten‘ (Anleitung Seite 11) platzieren.

Page 20: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

REINER CSS-CODE

/* all size rules */

CODES IM DOWNLOAD-PDF VERFÜGBAR

/* big screen + ipad pro landscape */

@media only screen and (min-width: 1281px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* laptops + small screens */

@media only screen and (max-width: 1280px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* small tablets */

@media only screen and (max-width: 1024px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* mobiles */

@media only screen and (max-width: 767px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/*]]>*/

</style>

Page 21: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

ODER EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="https://www.jimhb.de/download/im-pdf-verfuegbar" />

Page 22: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Berlin

Ansicht Standard

Ansicht neu

Page 23: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Änderungen Der Inhaltsbereich wird auf 1280 Pixel Breite deutlich erhöht, wodurch sich viele neue Möglichkeiten für die Inhaltsgestaltung ergeben. Zwischen Logo und Titelzeile wurden die Abstände optimiert und mobil mehr Raum für das Hintergrundbild eingeräumt. Dadurch ergibt sich mobil ein deutlich harmonischeres Bild. Um diese Design-Änderungen vorzunehmen bitte einen der nachfolgenden Codes im Bereich ‚Head bearbeiten‘ (Anleitung Seite 11) platzieren.

Page 24: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

REINER CSS-CODE

<style type="text/css">

/*<![CDATA[*/

/* copyright by jimjim.de / jimdo-handbuch.de */

/* BERLIN 4 */

/* all size rules */

CODES IM DOWNLOAD-PDF VERFÜGBAR

/* big screen + ipad pro landscape */

@media only screen and (min-width: 1281px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* laptops + small screens */

@media only screen and (max-width: 1280px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* small tablets */

@media only screen and (max-width: 1024px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* mobiles */

@media only screen and (max-width: 767px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/*]]>*/

</style>

Page 25: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

ODER EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="https://www.jimhb.de/download/im-pdf-verfuegbar" />

Page 26: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Bordeaux Ansicht Standard

Ansicht neu

Page 27: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Änderungen Der Inhaltsbereich wird auf eine Breite von mindestens 75% des Contents gesetzt und für größere Bildschirme auf 1280px deutlich vergrößert. Im Gegenzug zu älteren Versionen wird dem Headerbild wieder etwas mehr Raum gewährt. Kleinere Tablets verschieben die sogenannte Sidebar unter den Content. Gleichzeitig werden überdimensionierte Abstände zwischen Kopfbereich und Start des Contents reduziert. Um diese Design-Änderungen vorzunehmen, bitte einen der nachfolgenden Codes im Bereich ‚Head bearbeiten‘ (Anleitung Seite 11) platzieren.

Page 28: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

REINER CSS-CODE

/* all size rules */

CODES IM DOWNLOAD-PDF VERFÜGBAR

/* big screen + ipad pro landscape */

@media only screen and (min-width: 1281px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* laptops + small screens */

@media only screen and (max-width: 1280px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* small tablets */

@media only screen and (max-width: 1024px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* mobiles */

@media only screen and (max-width: 767px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/*]]>*/

</style>

Page 29: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

ODER EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css" href=" /download/im-pdf-verfuegbar " />

Page 30: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Cairo Ansicht Standard

Ansicht neu

Page 31: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Änderungen Cairo wird hier deutlich verbreitert. Mehr Contentfläche und bessere Verwendbarkeit durch Abstufungen für Notebooks und Tablets. Auch wurde die Mindesthöhe des Logos ausgehebelt, so dass Sie hier nun getrost kleinere oder flache Grafikelemente im Logobereich integrieren können. Der Inhaltsbereich wird anstelle der ursprünglichen 960 Pixel auf die eine Bildschirmbreite von 1280px gesetzt. Um diese Design-Änderungen vorzunehmen, bitte einen der nachfolgenden Codes im Bereich ‚Head bearbeiten‘ (Anleitung Seite 11) platzieren.

Page 32: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

REINER CSS-CODE

/* all size rules */

CODES IM DOWNLOAD-PDF VERFÜGBAR

/* big screen + ipad pro landscape */

@media only screen and (min-width: 1281px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* laptops + small screens */

@media only screen and (max-width: 1280px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* small tablets */

@media only screen and (max-width: 1024px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* mobiles */

@media only screen and (max-width: 767px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/*]]>*/

</style> </style>

Page 33: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

ODER EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="https://www.jimhb.de/download/im-pdf-verfuegbar" />

Page 34: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Cape Town Ansicht Standard

Ansicht neu

Page 35: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Änderungen Cape Town ist als ‚fluid‘ und auf viel Fläche ausgelegt. Mit dem nachfolgenden Code wird die Breite der Seite deutlich auf bis zu 1360 Pixel vergrößert. Im Mobilbereich gibt es einige Fixes für bessere Abstände zwischen Logo, Titel und dem Schliessen-X für geöffnetes Menü. Um diese Design-Änderungen vorzunehmen, bitte einen der nachfolgenden Codes im Bereich ‚Head bearbeiten‘ (Anleitung Seite 11) platzieren.

Page 36: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

REINER CSS-CODE

/* all size rules */

CODES IM DOWNLOAD-PDF VERFÜGBAR

/* big screen + ipad pro landscape */

@media only screen and (min-width: 1281px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* laptops + small screens */

@media only screen and (max-width: 1280px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* small tablets */

@media only screen and (max-width: 1024px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/* mobiles */

@media only screen and (max-width: 767px)

{

CODES IM DOWNLOAD-PDF VERFÜGBAR

}

/*]]>*/

</style>

Page 37: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

ODER EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="https://www.jimhb.de/download/im-pdf-verfuegbar" />

Page 38: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

NUN EIN SPRUNG ÜBER MEHR ALS 100 WEITERE SEITEN CODES

PREVIEW ZU DEN FUNKTIONS-CODES

Page 39: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Funktionen für die JIMDO-Page

Kleine CSS-Codes, die das Arbeiten mit der JIMDO-Page leichter und den Besuch attraktiver machen. Folgende Codes haben wir für Sie erarbeitet und stellen sie Ihnen in dieser aktualisierten Version des JIMDO Codebooks zur Verfügung:

Abstände im Bearbeiten-Modus markieren

Code-Areale im Bearbeiten-Modus markieren

KingSize Navigationsbearbeitung

Jimdo Lightbox in Weiß

Pflegbarer Text im Bild

Große Selectbox für Shop-Varianten

Feldhinweise ausblenden

Mouseover Bildervergrößerung

Bildslider ohne Steuerelemente

Der letzte Punkt ist …ROT! Die Integration erfolgt – ganz einfach – genau wie bei den Designanpassungen.

1. Externen CSS-Aufruf oder CODE-Schnippsel kopieren 2. Unter Einstellungen > Head bearbeiten einkopieren 3. Speichern

Page 40: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Abstände im Bearbeiten-Modus markieren Machen Sie die großen und kleinen Abstände im Bearbeiten-Modus sichtbar und behalten Sie den Überblick

Effekt Kleines Problem im Jimdo-Backend. Die gesetzten Abstände (egal ob groß oder klein) sind unsichtbar. So werden alle verwendeten Abstände (ausschließlich im Bearbeiten-Modus) mit einer schicken grauen Schraffur markiert. Sehr hilfreich!

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="CODE-IM-HANDBUCH-VERFUEGBAR" />

Page 41: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Codes im Bearbeiten-Modus markieren Machen Sie Widgets, integrierte HTML- und Script-Codes im Bearbeiten-Modus sichtbar

Effekt Wissen Sie immer genau wo Sie Codes, HTML und Widgets in Ihrer Seite platziert haben? Leider sieht man die Codes im Backend erst beim Draufklicken - man löscht oder verschiebt sie versehentlich. Mit diesem Script werden alle platzierten Codes (ausschließlich im Bearbeiten-Modus) mit einer blauen Schraffur markiert.

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="CODE-IM-HANDBUCH-VERFUEGBAR" />

Page 42: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Kingsize Navigations-Bearbeitung Sind wir hier beim Sehtest? Mit diesem Code wird die Navigationsbearbeitung deutlich vergrößert!

Effekt Bei umfangreichen Webseiten und Shops kann das „Grau in Grau“ der Navigationsbearbeitung recht anstrengend werden. Mit diesem Code wird die Navigation auf 800 Pixel Breite aufgeblasen, alle Einträge vergrößert und einfach mehr Komfort in die Ansicht gezaubert.

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="CODE-IM-HANDBUCH-VERFUEGBAR" />

Page 43: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Jimdo-Lightbox in Weiss Es muss ja nicht immer Schwarz sein – erleben Sie die Vergrößerungen von Bildern in einer edlen weißen Lightbox

Effekt Sie möchten vergößerbare Bilder nicht auf einem brutal schwarzen Hintergrund, sondern lieber auf edlem Weiss in der sogenannten "Lightbox" sehen? Dieses kleine Skript funktioniert mit allen Jimdo-Designs und ist in wenigen Sekunden eingebaut.

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href="CODE-IM-HANDBUCH-VERFUEGBAR" />

Page 44: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Pflegbarer Text im Bild Wer sagt denn, dass ein Bildtitel immer brav und langweilig unter dem Bild stehen muss?

Effekt Für Bilder, die etwas zu sagen haben. Bei Bild, Text mit Bild, Blogeinträgen etc. werden die (optional) pflegbaren Untertitel auf stylbaren Hintergründen abgebildet – aber nur in der Desktop-Version, und ausschließlich bei linksbündigen Bildern.

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css" href=" CODE-

IM-HANDBUCH-VERFUEGBAR " />

Page 45: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Große Selectbox für Shopvarianten Im Shop werden Varianten oft nicht erkannt - hier ist die Lösung!

Effekt Leider fällt die Selectbox für Variantenartikel im Jimdo-Shop recht klein aus. Unsere 'Große' schafft hier Abhilfe und macht klar: bei diesem Artikel kann man unterschiedliche Größen oder Varianten des Artikels auswählen. Reduziert somit auch Retouren.

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css" href=" CODE-

IM-HANDBUCH-VERFUEGBAR " />

Page 46: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Feldhinweise ausblenden Kleines Problem mit nerviger Präsenz – der Hinweis für benötigte Formular-Felder (Pflichtfelder)

Effekt Der kleine Hinweis unter Formularen nervt leider sehr. Daher hier ein kurzes Skript, mit dem dieser Hinweis einfach ausgeblendet wird . Da man unverändert Pflichtfelder* im Formular mit „Sternchen“ hinterlegen kann (und da eine Fehlermeldung bei fehlenden Eingaben erfolgt) merken Besucher auch ganz sicher, welche Felder man ausfüllen muss.

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css"

href=" CODE-IM-HANDBUCH-VERFUEGBAR " />

Page 47: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Mouseover Bildervergrößerung Bilder (verlinkt) mit Mouseover-Vergrößerung

Effekt Es ist okay, wenn der Mauszeiger zur Hand wird. Viel schöner ist eine Mouseover-Vergrößerung bei allen Bildern des Inhaltsbereiches die verlinkt sind oder mit einer Bildvergrößerung versehen sind. Ein (optionaler) leichter Schattenwurf sorgt für zusätzliche Aufmerksamkeit. Ein Effekt der die gesamte Jimdo-Page ein wenig animiert und niemals langweilig wird. Den Code gibt es hier natürlich auch ohne den Schattenwurf.

Page 48: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

EXTERNER CSS-AUFRUF MIT SCHATTENWURF

<link rel="stylesheet" type="text/css" href=" CODE-

IM-HANDBUCH-VERFUEGBAR "/>

sowie

EXTERNER CSS-AUFRUF OHNE SCHATTENWURF

<link rel="stylesheet" type="text/css" href=" CODE-

IM-HANDBUCH-VERFUEGBAR "/>

Page 49: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Bildslider ohne Steuerelemente Ausgeblendete Slider-Navigation bei Bildergalerie-Slider

Effekt Die Bedienelemente Vor / Zurück / Grossansicht sind zwar ein Standard bei Bildslidern (Bildergalerie-Element), aber sie stören gelegentlich gewaltig. Zum Beispiel wenn man hübsch ein paar Logos von Referenzen oder kleinere Slider anlegen und durchlaufen lassen möchte. Dieses Script entfernt die vor- und zurück-Pfeile und aktiviert das Vollansichts-Symbol auf die Mouseover-Situation.

EXTERNER CSS-AUFRUF

<link rel="stylesheet" type="text/css" href=" CODE-IM-HANDBUCH-VERFUEGBAR "/>

Page 50: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Der letzte Punkt ist ….rot! Featuren Sie besondere Menüpunkte - zum Beispiel Ihren Newsletter!

Effekt Mit diesem kleinen Script wird der letzte sichtbare Menüpunkt Ihrer Hauptnavigation in einer Farbe Ihrer Wahl angezeigt. Sie stellen einfach nur die Farbe ein (Standard ist rot = #FF0000) und bestimmen ob der Newsletter, der Sale-Bereich oder Ihr Kontaktformular hervorgehoben werden.

CSS ZUM EINFÜGEN

<style type="text/css">

/*<![CDATA[*/

CODE-IM-HANDBUCH-VERFUEGBAR

/*]]>*/

</style>

Page 51: Alexander Kerscher€¦ · Agentur · Projektmanagement · E-Business Hohenstaufenring 62 50674 Köln ... Namen wunderbarer Städte versehene - responsive Layouts, die in ... folgendes

DIES IST EINE PREVIEW FÜR DIE AUSGABE 2020 DES JIMDO-CODEBUCHS VON ALEXANDER KERSCHER

Die JIMDO-Handbücher von Alexander Kerscher sind KEIN Produkt der JIMDO GmbH ALLE RECHTE © ALEXANDER KERSCHER

Einbauvideo

Unter der URL

https://www.jimdo-handbuch.de/codebuch/

finden Sie ein kurzes Video, welches Ihnen Funktion und Einbau der Codes aus diesem Handbuch erläutert. Sie haben noch weitere Fragen zu JIMDO und möchten gerne mehr wissen und lernen? Bitte besuchen Sie auch...

fruits-harvest.de (Agentur) jimjim.de (JIMDO Codes)