Hej, przedstawiÄ™ dzisiaj drugÄ…, trudniejszÄ… wersjÄ™ naszego nietuzinkowego archiwum. Konkretnie o takie:
Pytaliście jak dodać obrazki pomiędzy miesiącami, dlatego też dodaję sposób na archiwum 2.
Układ jest ten sam:
- dajemy dodaj gadżet
- wybieramy "html/java script"
- wklejamy i dostosowujemy kod przedstawiony poniżej.
KOD: ( usuwamy rzeczy pisane kursywÄ… !! )
<style type="text/css">
div.rok {
text-align:center;
font-size:15px; - wielkość czcionki, którą będą napisane lata
color:black; - kolor czcionki, którą będą napisane lata
}
a.arch {
color:grey; - kolor czcionki poszczególnych miesięcy
}
a.arch:hover {
color:pink; - kolor czcionki poszczególnych miesięcy po najechaniu myszką
}
</style>
<div class="rok"> <img src="OBRAZEK LINK" /> 2014 <img src="OBRAZEK LINK" /> </div>
<a class="arch" href="http://ADRES BLOGA/2014_01_01_archive.html">Styczeń</a> ,
<a class="arch" href="http://ADRES BLOGA/2014_02_01_archive.html">Luty</a>
i tak dalej.... KONIEC KODU!
czerwone pole - wpisujemy odpowiedni rok
niebieskie pole - wpisujemy odpowiedni miesiÄ…c
W efekcie uzyskamy obrazki obok roku. ( jak na zdjęciu u góry!:) )
Jeśli chcemy oddzielić obrazkiem każdy miesiąc to kod wygląda mniej więcej tak:
KOD:
<style type="text/css">
div.rok {
text-align:center;
font-size:15px;
color:black;
}
a.arch {
color:grey;
}
a.arch:hover {
color:pink;
}
</style>
<div class="rok"> 2014 </div>
<a class="arch" href="http://ADRES BLOGA/2014_01_01_archive.html">Styczeń</a> <img src="OBRAZEK LINK" />
<a class="arch" href="http://ADRES BLOGA/2014_02_01_archive.html">Luty</a> <img src="OBRAZEK LINK" />
<a class="arch" href="http://ADRES BLOGA/2014_03_01_archive.html">Marzec</a><img src="OBRAZEK LINK" />
KONIEC KODU.
kolor zielony - to kod na obrazek - możemy go wkleić przed / za każdym miesiącem. :)
Jeśli chcemy aby obrazek miał konkretny wymiar to kod na obrazek wygląda tak:
<img src="OBRAZEK LINK" width="10" height="10" />
height = wysokość
width = szerokość
10 = ustawiamy odpowiednią wielkość w pikselach.
W razie problemów proszę pisać w komentarzach :)