Modifikasi Tampilan Widget Feed

infoalya

Assalamu'alaikum sahabat infoalya.com, pada kesempatan ini admin ingin share langkah-langkah memodifikasi tmpilan widget feed yang admin kutip dari  _kompiajaib.com. Baiklah sahabat kita langsung saja ya pasti sudah pada penasaran ya :)

Saya beranggapan sahabat sudah berada di dashboard blogger lanjutkan deengan klik tata letak kemudian add gadget dan tambahkan FEED kemudian masukkan URL FEED kawan, biasanya seperti dibawah ini :

http://blogsobat.blogspot.com/feeds/posts/default  atau    http://namadomain.com/feeds/posts/default

Jika selesai klik lanjutkan dan tentukan jumlah feed yang akan ditampilkan lalu klik save
Untuk memodifikasinya silahkan gunakan CSS dibawah ini dan letakkan dibawah tag  </head>

<style type='text/css'>
#Feed1 .widget-content{
padding:0
}
#Feed1_feedItemListDisplay li,#Feed1_feedItemListDisplay ul{
list-style:none;
margin:0;
padding:0
}
#Feed1_feedItemListDisplay a{
color:#444;
text-decoration:none;
font-size:16px!important
}
#Feed1_feedItemListDisplay a:hover{
color:#e8554e
}
#Feed1_feedItemListDisplay li{
display:block;
clear:both;
overflow:hidden;
list-style:none;
border-bottom:solid 1px #dedede;
padding:4px 0;
margin:0;
font-weight:normal
}
#Feed1_feedItemListDisplay li:first-child{
border-top:solid 1px #dedede
}
</style>


Dan apabila sahabat ingin memasang dua atau tiga feed gunakan kode dibawah ini

<style type='text/css'>
#Feed1 .widget-content,
#Feed2 .widget-content,
#Feed3 .widget-content{
padding:0
}
#Feed1_feedItemListDisplay li,#Feed1_feedItemListDisplay ul,
#Feed2_feedItemListDisplay li,#Feed2_feedItemListDisplay ul,
#Feed3_feedItemListDisplay li,#Feed3_feedItemListDisplay ul{
list-style:none;
margin:0;
padding:0
}
#Feed1_feedItemListDisplay a,
#Feed2_feedItemListDisplay a,
#Feed3_feedItemListDisplay a{
color:#444;
text-decoration:none;
font-size:16px!important
}
#Feed1_feedItemListDisplay a:hover,
#Feed2_feedItemListDisplay a:hover,
#Feed3_feedItemListDisplay a:hover{
color:#e8554e
}
#Feed1_feedItemListDisplay li,
#Feed2_feedItemListDisplay li,
#Feed3_feedItemListDisplay li{
display:block;
clear:both;
overflow:hidden;
list-style:none;
border-bottom:solid 1px #dedede;
padding:4px 0;
margin:0;
font-weight:normal
}
#Feed1_feedItemListDisplay li:first-child,
#Feed2_feedItemListDisplay li:first-child,
#Feed3_feedItemListDisplay li:first-child{
border-top:solid 1px #dedede
}
</style>


Mungkin itu yang dapat admin share untuk kali ini, semoga bermanfaat.
Sumber Kode dari :  kompiajaib.com/2015/11/menampilkan-dan-memodifikasi-widget.html

[+] Silahkan tinggalkan komentar
[+] Berkomertarlah dengan santun
[+] Mohon tidak meninggalkan live link
[+] Terima kasih untuk komentar anda

https://infoalya.com

Post a Comment (0)
Previous Post Next Post