Tutorial Blogskin : Blog Archive #2

by - 4:23 PTG




Assalamualaikum :)


Haha orang nie sangat jujur, dye tidak bukak page source arrien ^_^ gumawo.. anyway kepada awak yang menanya itu, saye bukan guna blogskin,saye guna blog template ye,..harap jangan ada yang salah faham lagi yea,coz memang ramai yang ingat arrien guna blogskin :) Then merujuk kepada soalan yang dia tanya,dia kata tolong tunjukkan cara nak buat blog archive macam arrien,bwt sorry dear..blog archive tu tanya untuk blog template not blogskin. But its oke if u use blogskin,saye boleh tunjukkan cara untuk buat blog archive untuk blogskin oke :) Ini ada blog archive #1 yang arrien pernah buat tuto,so now blog archive #2.


1. Dashboard > Template.
2. Use Ctrl+F and find code </style>
3. Copy this code:
div.thingi{
-webkit-transition:All 0.4s ease ;
-moz-transition:All 0.4s ease ;
-o-transition:All 0.4s ease ;
background:url(URL ICON) ;
color:#555;
background-repeat:no-repeat;
background-size:15px;
padding-left:25px;
line-height:18px;
}
div.thingi:hover{
background:url(URL ICON);
background-repeat:no-repeat;
padding-left:25px;
background-size:15px;
line-height:18px;
color:#666;
}

4. Paste atas code tadi.
5. Now copy this code:
<div style="border:1px solid #efefef;background:#fff; width:188px; overflow-x:hidden; overflow-y:scroll;padding:5px; height:100px;text-align:left; ">
<bloggerpreviousitems>
<a  href="<$BlogItemPermalinkURL$>">
<div class="thingi"><$BlogPreviousItemTitle$></div>
</a>
</BloggerPreviousItems>
</div></div>
6. Paste kan di bahagian sidebar korang.
7. Preview and save.Done!

Note:
MERAH: Tukar dengan url icon.
BIRU : Color border.
OREN : Ubah ikut kesesuaian.



You May Also Like

9 Comments

  1. sye apply tuto awak. thanks (^_^)V

    BalasPadam
  2. adik kakak nak tanya url background tu nk letak yg mana satu

    BalasPadam
  3. @Yana Nana url background?? owh yg tu sbenarnye letak url icon,kena letak dekat dua2 tempt yg sye tunjuk..bwt kna lain2 icon coz sye yg asal,satu lagi untuk hover ^^

    BalasPadam
  4. Nak tanya , macam mana eh nak copy kod tu ? Saya guna ctrl + c tak boleh

    BalasPadam
  5. @Farah Arina awak highlight code yg dlm blockquote tu and just right click and copy..

    BalasPadam
  6. hi, boleh tak ajar nak buat archive macam u punya?

    BalasPadam
  7. @nabila kamalia hai, blog archive yg mcm dye tngh pakai nie ke?? owh nie bkn blogskin, so dye mmg auto mcm tu.. btw actually sye xbrpe phm soalan awak.. but blh tngk tuto nie ..kowt2 ad kaitan ngn soalan awk :) http://arrienlove.blogspot.com/2013/06/tutorial-scroll-box-at-blog-archive.html or http://arrienlove.blogspot.com/2013/06/tutorial-scroll-box-at-blog-archive.html

    BalasPadam
  8. @nabila kamalia eh silap...i means ..'saya' hehe 'dye' plk.. XD

    BalasPadam

Thankz sudi baca entry arrien..
Jom ringan2 kan tangan anda untuk comment ^_^
Terima Kasih :D

No hard word..
Plezz..berbudi bahasa budaya kita kan ?? ^_-