Hinzufügen von einem Tropfen hinunter Linkbar in Blogger

Fügen Sie ein Drop-Down die Hyperlinkleiste in Blogger, die Navigation von Ihrem Blogger-Blog für Ihre Leser zu vereinfachen. Hinzufügen von Dropdown-Menüs zu Ihrem Blog-Navigation bietet einem Besucher mehrere Optionen zu Verfahren, wenn er den Cursor über das Menü bewegt. Die Installation erfordert das Einfügen von Code in Ihren Blog.

Anweisungen

1 Melden Sie sich mit Ihren Anmeldeinformationen Google Blogger. Wählen Sie "Design" von unten den Namen des Blogs, denen Sie die Dropdown-Menüs hinzufügen möchten.

2 Wählen Sie "HTML bearbeiten", dann durch das Dokument blättern, bis man die < / Head > Tag. Klicken Sie in der Zeile über dem Tag dann mit der rechten Maustaste und fügen Sie den folgenden Code:

< Stil >

sddm {Margin: 0;Padding: 0;Z-Index: 30}

Sddm li {Margin: 0;Padding: 0;List-Style: none;Float: left;/Font Menü Top/Schriftart: arial Fett 11px}

Sddm-li ein {display: block;Marge: 0 1px 0 0;Padding: 4px 10px;/Breite jedes Menü Top/Breite: 60px;/Hintergrundfarbe des Hauptmenü/Hintergrund: #5970B2;

/Textfarbe des Hauptmenü/Farbe: #FFFFFF;Text-align: center;Text-Decoration: none}

Sddm li a: Hover {

/Hintergrundfarbe des Hauptmenüs auf Hover/Hintergrund: #49A3FF}

Sddm div {Position: absolute;Sichtbarkeit: versteckt;Margin: 0;Padding: 0;

/Hintergrundfarbe des Drop-down Menü /Hintergrund: #FFFFFF;/Grenze des Dropdown-Menü/Border: 1px solid #5970B2}

Sddm Div ein {Position: relative;Display: block;Margin: 0;Padding: 5px 10px;Breite: auto;Leerzeichen: Nowrap;Text-align: left;Text-Decoration: none;/Hintergrundfarbe der einzelnen Menü-Elemente/Hintergrund: #FFFFFF;/Textfarbe für jedes Element im Menü/Farbe: #2875DE;/Schriften der einzelnen Menü-Elemente/Schriftart: 11px arial}

Sddm Div a: Hover {/Hintergrund jedes Elements Daraufzeigen/Hintergrund: #49A3FF;/Schriftfarbe des jedes Menüelement Daraufzeigen/Farbe: #FFFFFF}< / style >< Skript-Typ = "Text/Javascript" >

Var-Timeout = 500;Var Closetimer = 500;Var Ddmenuitem = 0;

verborgenen Ebene öffnenFunktion mopen(id){brechen schließen Zeitgeber abmcancelclosetime();

Schließen Sie alte Schichtif(ddmenuitem) ddmenuitem.style.visibility = 'hidden';

neue Ebene zu bekommen und es zeigenDdmenuitem = document.getElementById(id);ddmenuitem.Style.Visibility = 'visible';

}Schließen Sie zeigte SchichtFunktion mclose(){if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';}

gehen enge ZeitgeberFunktion mclosetime(){Closetimer = window.setTimeout (Mclose, Timeout);}

brechen schließen Zeitgeber abFunktion mcancelclosetime(){if(closetimer){window.clearTimeout(closetimer);Closetimer = Null;}}

Schließen Sie Schicht beim Klick-outDocument.OnClick = Mclose;< / script >

Ersetzen Sie jede Farbe Code-Elemente mit Farbcodes, die Ihr Blog Thema entsprechen, dann klicken Sie "Save Template." Wählen Sie den Link "Seitenelemente" am oberen Rand der Seite.

3 Wählen Sie "Ein Gadget hinzufügen" und dann auf "HTML/JavaScript." Mit der rechten Maustaste in das Feld "Body", dann fügen Sie den folgenden Code:

< Ul Id = "Sddm" >< li >< a Href = "#"onmouseover="mopen('m1')"onmouseout="mclosetime()" > </a > Startseite< Div Id = "m1"onmouseover="mcancelclosetime()"onmouseout="mclosetime()" >< a Href = "#" > erste #1 Menüoption </a >< a Href = "#" > zweite #2 Menüoption </a >< a Href = "#" > Dritte #2 Menüoption </a >< / Div ></li >< li >< a Href = "#"onmouseover="mopen('m2')"onmouseout="mclosetime()" > </a > Download< Div Id = "m2"onmouseover="mcancelclosetime()"onmouseout="mclosetime()" >< a Href = "#" > Menü #2 Ersteres </a >< a Href = "#" > zweite #2 Menüoption </a >< a Href = "#" > Dritte #2 Menüoption </a >< / Div ></li >< Div Style = "klar: beide" >< / Div >

Ersetzen Sie die "#" hinter jedem "< a Href = >" Element mit der URL der Seite, der Sie verknüpfen, dann ersetzen den Beispiel-Titel hinter jedem mit dem Titel der Seite möchten. Klicken Sie auf "Widget speichern."

4 Zeigen Sie Ihr Blog in einem neuen Tab oder Fenster. Die Drop-Down-Menüs sind jetzt in der Hyperlinkleiste tätig.