Jak zrobić spis wpisów/listę wpisów

11.03.2015


Środa, a to oznacza kolejny tutorial. Dzisiejszy wpis będzie poświęcony spisie wpisów lub inaczej lista wpisów, spis treści. Można to uznać za archiwum, jednak nie pojawia nam się data i miesiąc, a tytuły wpisów. Po kliknięciu w ten wpis przenosi nas od razu do niego. Taka opcja bardzo dobrze się sprawdza na blogach poświęconym gotowaniu, recenzjom oraz na blogach rękodzielniczych i urodowych. Mimo wszystko ten post jest kierowany do wszystkich i jeśli ktoś uważa, że u niego się taki spis treści sprawdzi to zapraszam do korzystania z tutorialu.
1. Pierwsze co musimy zrobić to przejść do układ - dodaj gadżet. Szukamy gadżetu HTML/JavaScript. Mój spis wpisów będzie w stopce bloga.



2. Wklejamy kod do naszego gadżetu.


<form><select style="width: 990px" onchange="window.open(this.options[this.selectedIndex].value,'_self')"
size=1 name=menu>

<option />nazwa spisu
<!-- change the links with your own -->
<option value="http://#" />Tytuł wpisu
<option value="http://#" />Tytuł wpisu
<option value="http://#" />Tytuł wpisu
</select></form>

Analiza kodu:

<form><select style="width: 990px" onchange="window.open(this.options[this.selectedIndex].value,'_self')"
size=1 name=menu>

<option />nazwa spisu
<!-- change the links with your own -->
<option value="http://#" />Tytuł wpisu
<option value="http://#" />Tytuł wpisu
<option value="http://#" />Tytuł wpisu
</select></form>

Szerokość spisu - wartość zmienna. Ja zastosowałam 990px ponieważ chciałam aby spis dopasował się do stopki bloga. Tą wartość możecie zmieniać według własnego uznania. Wiadomo, że jeśli wsadzicie spis treści w kolumnę boczną to nie będzie szerokość 990px ale np. 240px. Musicie sprawdzić jaka wielkość wam odpowiada.
Nazwa spisu - tutaj dodajecie swoją własną nazwę np. spis treści, lista przepisów, cokolwiek.
# - zamiast niego wklejamy link do naszego wpisu
Tytuł wpisu - tutaj wpisujemy tytuł naszego wpisu, który ma się wyświetlać w naszym spisie.

UWAGA! Kolejną sekcje dla wpisu musisz dodać ręcznie, po dodanym ostatnim wpisie, dopisz pod spodem <option value="http://#" />Tytuł wpisu, kiedy skończysz kliknij zapisz.

U mnie to wygląda tak:



16 komentarzy:

  1. Jak zwykle przydatne, powinnaś jakąś prywatną szkółkę informatyczną założyć:P

    OdpowiedzUsuń
    Odpowiedzi
    1. Jeszcze tyle nie umiem, aby taką szkołę zakładać :p

      Usuń
  2. Przydatny post! :)
    http://agataweranika.blogspot.com/

    OdpowiedzUsuń
  3. no i takie posty są nie raz bardzo przydatne, dobry pomysł! :)

    OdpowiedzUsuń
  4. Przydatny poradnik :)
    liveteen17.blogspot.com

    OdpowiedzUsuń
  5. oo też mam ta obudowę stitcha, tylko ze całą różową! <3
    zaobserwowałam, miło by mi było gdybyś się odwdzięczyła :*
    donutworrybehappy.blogspot.com - zapraszam do mnie, nowy post z OOTD z czerwoną sukienką w kratę i czerwonymi ustami <3

    OdpowiedzUsuń
    Odpowiedzi
    1. Jak zaobserwowałaś tylko po to bo liczysz na rewanż, to od razu możesz przestać obserwować. Wyraźnie pisze, że nie toleruje obserwacji za obserwacje.

      Usuń
  6. Bardzo przydatny post, fajnie że dzielisz się z nami swoją wiedzą ;)
    http://xblueberrysfashionx.blogspot.com

    OdpowiedzUsuń
    Odpowiedzi
    1. Głupio tak trzymać dla siebie :p

      Usuń
  7. Fajnie że napisałaś jak zrobić taki spis !
    Może kiedyś sama sobie taki zrobię ?
    Tylko czy będzie mi się chciało ☺
    Jestem ogromnym leniem !
    Powodzenia w dalszym blogowaniu !
    http://ada-adulka.blogspot.com/2015/03/school-2.html

    OdpowiedzUsuń
    Odpowiedzi
    1. Może zmotywuje Cię to, że wiele czasu na to nie potrzeba :)

      Usuń
  8. ciekawy post!
    Jeśli możesz to poklikaj w nazwy poszczególnych kategorii np. "płaszcze" na moim blogu!
    www.panmalofel.com/2015/03/must-have-spring-summer-2015.html

    OdpowiedzUsuń
    Odpowiedzi
    1. Proszę o czytanie tego co jest nad komentarzami... mój blog to nie tablica ogłoszeń.

      Usuń
  9. Bardzo fajny post. Ten sposób z pewnością mi się przyda. Też mam Sticha!
    Pozdrawiam i zapraszam do mnie na nowy post.
    Tym razem mini kolekcja inspirowana YouTube'rkami.
    Jeśli post Ci się spodoba, to prosiłbym o +1 w Google.
    www.gabriel-data.blogspot.com - MY BLOG
    Fashion Projects

    OdpowiedzUsuń
  10. Świetna rada. :)
    Mam prośbe.. mogłabyś poklikac u mnie w linki? Byłabym bardzo wdzięczna i postaram się odwdzięczyć.
    http://kingaphotoography.blogspot.com/2015/03/choies.html

    OdpowiedzUsuń

- Komentarze takie jak: spam, obserwacja za obserwacje, prośby o klikanie w banery etc. zostają usuwane - ZAPAMIĘTAJ! MÓJ BLOG TO NIE TABLICA OGŁOSZEŃ
- Uznaje tylko konstruktywną krytykę
- Każdy komentarz to motywacja dla mnie.
- Weryfikacja obrazkowa wyłączona

Copyright © Szablon wykonany przez Blonparia