Paylaşan  |
| Resim yazısı ekle |
✅Blogger Populer Yayınlar Gadgeti Nasıl Eklenir?
1- Blogger Kontrol Paneli'ne giriyoruz ve hangi alanda görüntülenmesini istiyorsak "Yerleşim>Yeni Gadget Oluştur" diyoruz.2- Açılan pencereden "Populer Yayınlar"ı seçtikten sonra kaydet diyip kapatıyoruz.
3- CSS Kütüphanesi, JavaScript kodları ve Tasarım kodlarının eklenmesi işlemlerini aşağıdan adım adım takip ederek yapınız ve kaydedip blogunuzda görüntüleyiniz.Olası bir hata veya yanlışta iletişimden veya konuya yorum yaparak yardım isteyebilirsiniz.
✅CSS Kütüphanesi Nasıl Eklenir?
1- Blogger Kontrol Paneli'ne giriyoruz ve "Tema>HTML'yi düzenle" diyoruz.2- CTRL+F ile "<head>" kodunu aratıyoruz ve hemen altına aşağıdaki satırı kopyalayıp yapıştırıyoruz.
<link href='https://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'/>
✅JavaScript Kodları Nasıl Eklenir?
1- Blogger Kontrol Paneli'ne giriyoruz ve "Tema>HTML'yi düzenle" diyoruz.2- CTRL+F ile "</body>" kodunu aratıyoruz ve aşağıdaki Javascript kodunu bir üst satıra ekliyoruz.
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'/>
<script type='text/javascript'>
//<![CDATA[
$(".popular-posts
img").attr("src",function(t,s){return
s.replace("/w72-h72-p-k-no-nu/","/s350-c/")}),$(".popular-posts ul li
.item-snippet").each(function(){var
t=$(this).text().substr(0,60),s=t.lastIndexOf("
");s>10&&$(this).text(t.substr(0,s).replace(/[?,!\.-:;]*$/,"..."))}),$(".popular-posts
ul li .item-content a").each(function(){var
t=$(this).text().substr(0,60),s=t.lastIndexOf("
");s>=6&&$(this).text(t.substr(0,s).replace(/[?,!\.-:;]*$/,"..."))});
//]]>
</script>
✅Populer Yayınlar Tasarım Kodları Nasıl Eklenir?
1- Blogger Kontrol Paneli'ne giriyoruz ve "Tema>HTML'yi düzenle" diyoruz.2- CTRL+F ile "</head>" kodunu aratıyoruz ve bir üst satıra aşağıdaki beğendiğiniz 5 farklı tasarımdan birisinin kodlarını kopyalayıp yapıştırıyoruz ve kaydediyoruz.
<style type='text/css'>
.sidebar .PopularPosts ul{margin:0;padding:0;}.sidebar .PopularPosts ul
li{list-style:none !important;padding:0
!important;margin-bottom:10px;}.sidebar .PopularPosts
.item-thumbnail{height:190px;margin:0;overflow:hidden;width:100%;}.sidebar
.PopularPosts .item-title{position: relative;}.sidebar .PopularPosts
img{height:auto;width:100%;padding:0;}.sidebar .PopularPosts .item-title
a{color: #FFFFFF;font:20px
Oswald;text-transform:uppercase;padding:10px;position:absolute;right:0;left:0px;margin:0px
auto;text-align:center;text-decoration:none;top:40px;width:60%;height:26px;overflow:hidden;z-index:2;}
.sidebar .PopularPosts .item-snippet{background:rgba(0, 0, 0,
0.35);border-top:6px solid rgba(0, 0, 0, 0.1);border-bottom:6px solid
rgba(0, 0, 0, 0.1);color:#FFFFFF;left:0px;right:0px;margin:0px
auto;padding:65px 10px 10px;position:absolute;font:13px 'Times New
Roman',Times,FreeSerif,serif;text-align:center;top:35px;width:60%;z-index:1;}.sidebar
.PopularPosts .item-content{position:relative;}
</style>
<style type='text/css'>
.sidebar .PopularPosts
ul{counter-reset:popularcount;margin:0;padding:0;}.sidebar .PopularPosts
ul li{width:100%;list-style:none !important;padding:0
!important;margin-bottom:20px;position:relative;border:0;text-align:center;}.sidebar
.PopularPosts .item-thumbnail a{clip:
auto;display:block;height:auto;height:120px;}.sidebar .PopularPosts
.item-thumbnail{width:100%;height:120px;overflow:hidden;position:relative;margin-bottom:15px;}.sidebar
.PopularPosts .item-thumbnail::before{background:rgba(0, 0, 0,
0);border-bottom:29px solid #fff;border-left:29px solid
transparent;border-right:29px solid
transparent;bottom:0px;content:"";height:0;width:0px;left:0px;right:0px;margin-left:auto;margin-right:auto;position:absolute;z-index:3;}.sidebar
.PopularPosts
.item-thumbnail:after{color:#000;content:counter(popularcount,
decimal);counter-increment:popularcount;font:13px "Times New
Roman",Times,FreeSerif,serif;list-style-type:none;position:absolute;bottom:0;margin:0px
auto;left:0px;right:0px;z-index:4;}.sidebar .PopularPosts
.item-thumbnail
img{position:relative;width:100%;height:auto;padding:0;}.sidebar
.PopularPosts .item-title{font:15px 'Oswald',
sans-serif;text-transform:uppercase;margin:0px
auto;padding-bottom:10px;border-bottom:1px solid #000;}.sidebar
.PopularPosts .item-title a{color:#000;text-decoration:none;}.sidebar
.PopularPosts .item-snippet{padding:10px 15px;font:13px "Times
New Roman",Times,FreeSerif,serif;}
</style>
<style type='text/css'>
.sidebar .PopularPosts ul{padding:0;margin:0;}.sidebar .PopularPosts
.item-thumbnail
a{clip:auto;display:block;height:auto;overflow:hidden;}.sidebar
.PopularPosts .item-thumbnail{width:130px;height:130px;border-right:5px
solid #fff;margin:0px 10px 0px 0px
!important;position:relative;}.sidebar .PopularPosts .item-thumbnail
img{position:relative;height:auto;width:100%;padding:0;}.sidebar
.PopularPosts ul
li{float:left;margin-bottom:5px;max-height:130px;min-width:250px;overflow:hidden;}.sidebar
.PopularPosts ul li:first-child{background:#D9EDF7;}.sidebar
.PopularPosts ul li:first-child + li{background:#F2DEDE;}.sidebar
.PopularPosts ul li:first-child + li + li{background:#DFF0D8;}.sidebar
.PopularPosts ul li:first-child + li + li +
li{background:#FFEEBC;}.sidebar .PopularPosts ul li:first-child + li +
li + li + li{background:#E0E0E0;}.sidebar .PopularPosts
.item-title{font:13px 'Oswald',
sans-serif;text-transform:uppercase;padding:10px 5px 10px;}.sidebar
.PopularPosts .item-title a{color:#000;text-decoration:none;}.sidebar
.PopularPosts .item-snippet{font:13px "Times New
Roman",Times,FreeSerif,serif;padding-right:5px;}.sidebar
.PopularPosts .widget-content ul li{padding:0px 5px 0px 0px!important;}
</style>
<style type='text/css'>
.sidebar .PopularPosts ul{padding:0;}.sidebar .PopularPosts ul
li:first-child{width:100%;max-height:100%;opacity:0.9;}.sidebar
.PopularPosts ul li:nth-child(even){margin-right:2%;}.sidebar
.PopularPosts ul
li{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;padding:0px
!important;width:49%;max-height:120px;opacity:0.4;overflow:hidden;float:left;margin-bottom:2%;-webkit-transition:
all 0.5s ease 0s;-moz-transition:all 0.5s ease 0s;-ms-transition:all
0.5s ease 0s;-o-transition:all 0.5s ease 0s;transition:all 0.5s ease
0s;}.sidebar .PopularPosts ul li:hover{opacity:1;}.sidebar .PopularPosts
.item-thumbnail{margin:0;width:100%;line-height:0;}.sidebar
.PopularPosts ul li img
{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:
border-box;width:100%;height:auto;padding:0;}.sidebar .PopularPosts
.item-content:hover .item-title a,.sidebar .PopularPosts
.item-thumbnail-only:hover .item-title
a{visibility:visible;opacity:1;}.sidebar .PopularPosts .item-title
a{color:#fff;background:rgba(0, 0, 0, 0) linear-gradient(to bottom,
rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.93) 100%, rgba(0, 0, 0, 0.85)
100%);text-decoration:none;position:absolute;text-align:center;font:13px
'Oswald',
sans-serif;left:0;right:0;bottom:0%;padding:100px 10px
10px;opacity:0;visibility:hidden;}.sidebar .PopularPosts
.item-snippet{display:none;}
</style>
<style type='text/css'>
.sidebar .PopularPosts
ul{counter-reset:popularcount;margin:0;padding:0;}.sidebar .PopularPosts
ul
li{float:left;max-height:130px;min-width:250px;position:relative;}.sidebar
.PopularPosts .item-thumbnail::after{color:rgba(255,255,255,
0.63);content:counter(popularcount, decimal);counter-increment:
popularcount;font:70px 'Oswald',
sans-serif;list-style-type:none;position:absolute;left:5px;top:-5px;z-index:4;}.sidebar
.PopularPosts .item-thumbnail::before{background:rgba(0, 0, 0,
0.3);bottom:0px;content:"";height:100px;width:100px;left:0px;right:0px;margin:0px
auto;position:absolute;z-index:3;}.sidebar .PopularPosts
.item-thumbnail
a{clip:auto;display:block;height:auto;overflow:hidden;}.sidebar
.PopularPosts .item-thumbnail{width:100px;height:100px;margin:0px 10px
0px 0px !important;position:relative;}.sidebar .PopularPosts
.item-thumbnail:hover:before{display:none;}.sidebar .PopularPosts
.item-thumbnail img{position:relative;padding-right:0px
!important;height:auto;width:100%;}.sidebar .PopularPosts
.item-title{font:13px 'Oswald',
sans-serif;text-transform:uppercase;padding:0px 5px 10px;}.sidebar
.PopularPosts .item-title a{color:#000;text-decoration:none;}.sidebar
.PopularPosts .item-snippet{font:13px "Times New
Roman",Times,FreeSerif,serif;}.sidebar .PopularPosts
.widget-content ul li{padding:0px 5px 0px 0px !important;}.sidebar
.PopularPosts .item-content{padding:5px 0px;border-bottom:1px dotted
#dedede;overflow:hidden;height:100px;position:relative;}
</style>
✅İşlem bu kadar arkadaşlar.Tekrar belirtiyorum.Herhangi yapamadığınız,hata aldığınız bir adım olursa yorum olarak veya iletişimden bildiriniz.Yardımcı olmaya hazırım.
Bunu Paylaş :
comment 0 Yorum
more_vert*Lütfen yanlızca yazı ile ilgili yorumlar yazınız.
*Yazının konusu dışında iletmek veya sormak istediğiniz bir şey varsa iletişim formunu kullanın.
*Bir Google Hesabınız yoksa Yorumlama Biçimi seçeneklerinden "Anonim" tıklayıp yorum yapabilirsiniz.