Jak dodać rozwijalne menu (spis postów, rozdziałów ...) ?

5 komentarzy
Jeśli chcecie zaoszczędzić nieco miejsca na blogu, a jednocześnie dać czytelnikowi dostęp do spisu postów możecie wykonać menu rozwijalne. Możecie w ten sposób zrobić np. spis rozdziałów dla bloga z opowiadaniami. Przykład:
Kody CSS:

Oczywiście takie menu najlepiej umieścić nie w poście (jak powyżej) a w gadżecie, na przykład w pasku bocznym.

Jak dodać do bloga menu ze spisem postów, stron?

Do stworzenia menu rozwijalnego wykorzystamy element <select> ... </select>. Po wybraniu konkretnej pozycji następuje wczytanie wybranej strony.
<select onchange="self.location.href = this.value">
<option VALUE="adres1.html">Opis1</option>
<option VALUE="adres2.html">Opis2</option>
<option VALUE="adres3.html">Opis3</option>
...
 </select>

W miejsce adres1.htmladres2.html wklejamy adresy postów (czy też stron), które mają być wczytane po wyborze określonej pozycji z listy.
W miejsce Opis1, Opis2 wpisujemy tekst, który będzie pojawiał się na liście.
Ilość pozycji <option> ... </option> jest dowolna.

Lista z przykładu powyżej powstała z kodu:
<select onchange="self.location.href = this.value">
 <option value="http://szablonka.blogspot.com/2014/03/jak-wysrodkowac-naglowek-bloga-blogspot.html">1. Jak wyśrodkować obrazek w nagłówku?</option>
 <option value="http://szablonka.blogspot.com/2014/04/jak-zaokraglic-obrazki-kody-css.html">2. Jak zaokrąglić zdjęcie (avatar) w "O mnie"</option>
</select>


KROK 1: Dodajemy do bloga gadżet HTML/JAVASCRIPT

KROK 2: Uzupełniamy tytuł (np. Archiwum, Spis rozdziałów) oraz wklejamy kod

KROK 3. Zapisujemy.

5 komentarzy:

  1. Ok, udało się. Dzięki wielkie.

    OdpowiedzUsuń
  2. Od dawna tego szukałam.
    Dziękuję.

    OdpowiedzUsuń
  3. Jak zmienić szerokość przycisku??

    OdpowiedzUsuń
  4. No nie wiem jak zrobić to menu górne :( Czyli strona główna, kim jesteśmy itp... na telefonie to działa a na komputerze nie. Czemu?

    OdpowiedzUsuń