Merhaba arkadaşlar sizlere bugün ki yazımızda Blogger Renkli Duyuru Eklentisi nasıl eklenir siteye bu işin işlem adımlarını sizlere anlatacağım.Bu eklenti sayesinde sitenizde öne çıkmasını istediğiniz yazınızı duyuru paylaşabilirsiniz.
İşlem Adımları:
1-Öncelikle şablon ayarları bölümüne giriniz.Ve ordan ]]></b:skin> bu kodu aratarak aşağıdaki kodu arattınız kodunun üstüne yapıştırınız arkadaşlar.Arama işlemini Ctrl+f tuşlarına basarak arama bölümünü  kod yerinden açabilirsiniz.

/* SK-Notification */
.syv-bildirim {
 color: #ffffff;
 display: block;
 font-size: 12px;
 margin: 1em 0;
 padding: 20px 20px 20px 90px;
 position: relative;
}

.syv-bildirim span.icon {
 height: 32px;
 left: 20px;
 position: absolute;
 top: 15px;
 width: 32px;
}
 

.bildirim-hata { background: #c02424 url("http://3.bp.blogspot.com/-5MfmUpwKAOU/UOm88G02_gI/AAAAAAAAFjI/DIBj-w-E61Y/s1600/error.gif") repeat-x top left; border: 1px solid #a01515; color:#660404; }
.bildirim-hata span.icon { background: url("http://2.bp.blogspot.com/-k24W-2lIH6o/UOm87N9B5FI/AAAAAAAAFi8/8-i_2hbmAVk/s1600/error-icon.png") no-repeat top left; }
 
.bildirim-onay { background: #6ba623 url("http://2.bp.blogspot.com/-HneDs2JAmRU/UOm8-zbkeFI/AAAAAAAAFjw/dJ-lMEfF8_4/s1600/success.gif") repeat-x top left; border: 1px solid #6e8a19; color: #405100; }
.bildirim-onay span.icon { background: url("http://2.bp.blogspot.com/-628iEEBLhjg/UOm8-CWA1bI/AAAAAAAAFjk/h2OXT7mR3A0/s1600/success-icon.png") no-repeat top left; }
 
.bildirim-info { background: #1d86af url("http://4.bp.blogspot.com/-xUNWklRsk9M/UOm88geoACI/AAAAAAAAFjM/e9K1txJW7so/s1600/info.gif") repeat-x top left; border: 1px solid #317d9b; color:#084752; }
.bildirim-info span.icon { background: url("http://3.bp.blogspot.com/-Zy9arKGoEvw/UOm88i5gCnI/AAAAAAAAFjQ/vGVlf8RGqQ4/s1600/info-icon.png") no-repeat top left; }
 
.bildirim-uyari { background: #e77414 url("http://2.bp.blogspot.com/-r19wM7mm_oo/UOm87JXE-UI/AAAAAAAAFjE/ZKOzPmtjljQ/s1600/alert.gif") repeat-x top left; border: 1px solid #be7125; color:#7e5700;}
.bildirim-uyari span.icon { background: url("http://4.bp.blogspot.com/-nDo3zzQ9HkE/UOm87BPNHmI/AAAAAAAAFjA/w2F5CZ86kwU/s1600/alert-icon.png") no-repeat top left; }
 
.bildirim-standard { background: #d7d7d7 url("http://4.bp.blogspot.com/-g0GfgZVROKM/UOm89qPKKoI/AAAAAAAAFjc/sSSX981p8FQ/s1600/standard.gif") repeat-x top left; border: 1px solid #bababa; color: #464646 !important; }
.bildirim-standard span.icon { background: url("http://4.bp.blogspot.com/-Rl8mHzeWsrI/UOm89YnKXmI/AAAAAAAAFjs/k9lUM-_HPws/s1600/standard-icon.png") no-repeat top left; }


/* TABBED CONTENT */

.syvtabmenu {
 background: #f1f1f1;
 border: 1px solid #e1e1e1;
 margin: 35px 0 2em 0;
 padding: 10px 10px 0 10px;
 position: relative;
}

.syvtabmenu .tabmenu {
 list-style: none;
 margin: 0 0 0 0 !important;
 padding: 0 !important;
}
 
.syvtabmenu .tabmenu li {
 background: #ffffff;
 padding: 20px 20px 20px 20px;
 margin: 0 0 10px 0;
 display: none;
}
  
.syvtabmenu .tabmenu li p { 
 margin: 0 0 1em 0; 
}
  
.syvtabmenu .tabmenu li.current {
 display: block;
}
  
.syvtabmenu .tablar {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
position: absolute;
top: -33px;
left: 13px;
}
 
.syvtabmenu .tablar li {
 list-style: none !important;
 background: #e5e5e5 !important;
 border: 1px solid #e1e1e1;
 border-bottom: none;
 text-shadow: 0 1px 0 #ffffff;
 cursor: pointer;
 float: left;
 font: bold 12px/32px Arial, Helvetica, sans-serif;
 color: #999999 !important;
 padding: 0 20px!important;
 margin: 0 3px 0 0!important;
 -moz-border-radius-topright: 5px;
 -moz-border-radius-topleft: 5px;
 -webkit-border-top-left-radius: 5px;
 -webkit-border-top-right-radius: 5px;
}
  
.syvtabmenu .tablar li.current {
 background: #f1f1f1 !important;
 color: #666666 !important;
}



Kodu ekledikten sonra sitenin istediğiniz bir yerine veya konu içinde göstermek istediğiniz duyuru modülünü aşağıdan seçin ve istediğiniz yere ekleyin.

<div class="syv-bildirim bildirim-standard"><span class="icon"></span><span class="kapali"></span> Bu standart bildirim kutusudur </div> <div class="syv-bildirim bildirim-onay"><span class="icon"></span><span class="kapali"></span> Bu bildirim onaylama kutusudur </div> <div class="syv-bildirim bildirim-hata"><span class="icon"></span><span class="kapali"></span> Bu hata bildirim kutusudur </div> <div class="syv-bildirim bildirim-info"><span class="icon"></span><span class="kapali"></span> Bu info bildirim kutusudur </div> <div class="syv-bildirim bildirim-uyari"><span class="icon"></span><span class="kapali"></span> Bu uyarı bildirim kutusudur </div>

Hiç yorum yok:

Blogger tarafından desteklenmektedir.