Blogger Sabit Slider Widget

1. Blogger Kontrol Panelinizdeyken sırasıyla " Tema » HTML'yi düzenle " tıklayın.
2. CTRL+F tuş kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun bir kaç satır üstüne aşağıda verilen kodu ekleyin.;

.meta {

  margin: 0 auto;

  background-color: gray;

  display: flex;

  width: 900px;

  gap: 10px;

  padding: 10px;

}

.slider {

  width: 300px;

  background-color: white;

  border: 1px solid #000;

  box-sizing: border-box;

  padding: 10px;

}

.slider img {

  width: 100%;

}

h4 {

  color: lightgray;

}

.slider  button {

  background-color: grey;

  color: white;

  width: 100%;

  border: none;

  padding:5px;

}

3. Temanızın uygun bölümüne aşağıda ki kodu ekleyin. (Örneğin ben main-wrapper'ın üstüne ekledim. Sizde temanız da uygun gördüğünüz bir yere ekleyin. Ayrıca aşağıda ki kodlar da bulunan BURAYA RESMİN LİNKİ, BAŞLIK, ALT BAŞLIK, ÖNİZLEME Kısımlarını kendinize göre düzenlemeyi unutmayın.

<div class="meta">

  <div class="slider ">

    <img src="BURAYA RESMİN LİNKİ"/>

    <h3>Başlık</h3>

    <h4>Alt Başlık</h4>

    <button class="buy"><a link="">Önizleme</></button>    

  </div>

  <div class="slider >

    <img src="BURAYA RESMİN LİNKİ"/>

    <h3>Başlık</h3>

    <h4>Alt Başlık</h4>

    <button class="buy"><a link="">Önizleme</></button>    

  </div>

  <div class="slider ">

    <img src="BURAYA RESMİN LİNKİ"/>

    <h3>Başlık</h3>

    <h4>Alt Başlık</h4>

    <button class="buy"><a link="">Önizleme</></button>    

  </div>

  <div class="slider ">

    <img src="BURAYA RESMİN LİNKİ"/>

    <h3>Başlık</h3>

    <h4>Alt Başlık</h4>

    <button class="buy"><a link="">Önizleme</></button>    

  </div>

  

    

</div>

sabit,slider, widget