Blogger Kurdele �eklinde Yay�n ��i Ba�l�k Ekleme

Ba�l�klar�n�z� Kurdele �erit ��erisinde G�sterebilirsiniz

�imdi blogger i�in payla�aca��m eklentide yaz� ba�l�klar�n�z� veya widget ba�l�klar�n�z� ��k bir kurdele �erit �eklinde g�sterebilirsiniz.

• �lk olarak blogger panelimizden �ablon-HTML'yi D�zenle yolunu takip ederek ]]></b:skin> kodunu buluyoruz. Bu kodun tam �zerine gelecek �ekilde a�a��daki css kodlar�n� yap��t�r�yoruz ve kaydet deyip ��k�yoruz.

.non-semantic-protector {
    position: relative;
    z-index: 1;
}

.ribbon {
    font-size: 16px !important;
    width: 50%;
    position: relative;
    background: #ba89b6;
    color: #fff;
    text-align: center;
    padding: 1em 2em;
    margin: 2em auto 3em;
}

.ribbon:before, .ribbon:after {
    content: "";
    position: absolute;
    display: block;
    bottom: -1em;
    border: 1.5em solid #986794;
    z-index: -1;
}

.ribbon:before {
    left: -2em;
    border-right-width: 1.5em;
    border-left-color: transparent;
}

.ribbon:after {
    right: -2em;
    border-left-width: 1.5em;
    border-right-color: transparent;
}

.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
    content: "";
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #804f7c transparent transparent transparent;
    bottom: -1em;
}

.ribbon .ribbon-content:before {
    left: 0;
    border-width: 1em 0 0 1em;
}

.ribbon .ribbon-content:after {
    right: 0;
    border-width: 1em 1em 0 0;
}

�imdi �erit kurdeleyi nerede kullanmak istiyorsak a�a��daki HTML kodlar�n� oraya yap��t�r�yoruz. A�a��daki kodlar�n i�ind Ba�l�k Buraya Gelecek b�l�m�n� kendi ba�l���n�zla de�i�tirin.

<div class="non-semantic-protector"> 
  <h1 class="ribbon">
    <strong class="ribbon-content">Ba�l��� Buruya Yaz�n�z</strong>
  </h1>
</div>

Kodlar�n Demosunu G�rmek ��in t�klay�n

Mesela yaz� i�erisinde ba�l�k olarak kulanmak istiyorsak yaz� alan�m�zda HTML butonuna basarak bu kodlar� oraya yap��t�r�yoruz.

Di�er yerlerde kullan�m� vs. sorular�n�z i�in a�a��daki yorum formunu kullanabilirsiniz.