YUKARI ÇIK

Kaç Kişi Online

1 Ağustos 2017 Salı

Bloga Resimli Devamını Oku Butonu Nasıl Eklenir?


Evvet, bugün blog tasarımınız için oldukça faydalı bir içerik paylaşacağım. Herkese hitap etmesi açısından da elimden geldiğince sadeleştirerek yapacağım bunu. Daha önce de blog ipuçları etiketiyle paylaştığım sade anlatımlı bir gönderim vardı ve oldukça ilgi görmüştü. O yüzden ara sıra da olsa çeşitli ipuçlarıyla sizlere yardımcı olmayı düşünüyorum artık. 

Bugünkü konumuz şablonumuza resimli devamını oku butonu eklemek. Bu, görsel açıdan blogumuzu iyileştirebilecek basit bir ipucu sadece. Şöyle ki; klasik devamını oku yazısı yerine birkaç küçük değişiklikle resim ekleyeceğiz. Bunu blogumuza uyguladıktan sonra da atlama aralığını kullandığımız her gönderimizde bu devamını oku butonu çıkacak. 

İlk Adım: Devamını Oku Butonu Oluşturma/Seçme

Öncelikle kendinize bir devamını oku resmi oluşturun ya da aşağıda paylaşacaklarımdan birini seçip sağ tıklayarak resmin adresini kopyalayın. Yok ben bunları beğenmedim kendim bir resim oluşturabilirim diyorsanız da photoscapede hazırladığınız resmi hizliresim gibi bir siteye yükleyerek urlsini alıp kullanın. Bizi alakadar eden kısmı photoscape kullanımı olmadığı için onun ayrıntısına girmeyeceğim çünkü bilmeyen arkadaşların kafasını karıştırmak istemiyorum.

Sizin için çeşitli yerlerden derlediğim devamını oku butonları:


(İlk 3 buton alıntıdır. Diğer butonları kendim oluşturdum.)


İkinci Adım: Devamını Oku Butonunu Bloga Ekleme

Blogger sayfamızı açtık. 
Sol taraftaki kontrol panelinden Tema'ya tıkladık.
Htlm'yi düzenle dedik.


Şimdi önümüze gelen kodların içinden değiştirmemiz gereken kodu aratacağız.
Öncelikle kod ekranının ortasına doğru fare imlecimizle dokunuyoruz.
Ctrl + g veya ctrl + f  ye basıyoruz. 
Böylece kod ekranımızın sağ üst kenarında search kutusu beliriyor.
 Bu kutunun içine şu kodu yapıştırıp aratıyoruz:

<data:post.jumpText/>


Sarı renkle gayet belirgin bir şekilde kodumuz karşımıza çıkıyor. 


Şimdi bu kodu silip onun yerine seçtiğiniz butonun kodunu ekleyeceğiz:

<img src='BUTONUNUZUNURLSİ'/>

Kırmızı renkli yere seçtiğiniz ya da oluşturduğunuz buton resminizin linki yapıştırılacak. 
(Butona sağ tıkla resim adresi al)


Tamam o kodun yerine resmimizin urlsini içeren kodu ekledik. Şimdi dikkat!

DİKKAT! Bu değişiklikleri yaptıktan sonra hemen temanızı kaydedip sayfadan çıkmayın lütfen. Hata yapmış olabilirsiniz. Öncelikle temayı önizleyip uyguladığınız değişikliğin blogda görünüp görünmediğine bakın. Eklediğiniz devamını oku butonu önceden paylaştığınız yazılar için görünür olmalıdır. Eğer herhangi bir değişiklik olmadıysa yaptığınız işlemleri ve eklediğiniz kodu gözden geçirin. Her şey kitabına uygun gözüktüğü halde hala olmuyorsa değişiklikleri geri alıp sayfadan öyle çıkın ki mevcut şablonunuzda herhangi bir hata oluşmasın.


 *Eğer daha önce herhangi bir devamını oku resminin urlsiyle bu kodu değiştirdiyseniz boşuna arama yapmayın kod çıkmayacaktır. Şu an halihazırda kullandığınız bir devamını oku butonunuz var ve onu değiştirmek istiyorsanız blog sayfanızda devamını oku resminize sağ tıklayıp resmin adresini kopyalayın ve biraz önce arattığımız kod yerine bu resmin adresini yazıp aratın. Yine sarı renklerle çıkan bu resim urlsi yerine kullanmak istediğiniz diğer devamını oku resminin urlsini yapıştırın. Temanızı önizleyip her şey tamamsa temanızı kaydedip çıkın.

31 yorum:

  1. Ben de bunu arıyordum geçen günlerde ya çok iyi oldu bu yazıyı paylaşman. En kısa zamanda deneyeceğim. Teşekkürler. :)

    YanıtlaSil
  2. Kedili olanına bayıldım. Çok teşekkürler Naz'cığım, eline sağlık. :)

    YanıtlaSil
  3. Ben mobilden yapamiorum bunu :) ctrl f yok malum 😀 kedili olan harika ama ya 💕😘

    YanıtlaSil
    Yanıtlar
    1. Mobilden olacak iş değil hiç :) Kedili güzel olur sizin bloga :)

      Sil
  4. 3. cü butonu beğendim ve deneme de yaptım, bloguma uygulayacağım, çok teşekkürler paylaşımın için :)

    YanıtlaSil
    Yanıtlar
    1. Beğeni için ben de teşekkür ederim güle güle kullanın :)

      Sil
  5. Biraz uğraştırıcı olsa da görüntü olarak şık bir şey çıkmış ortaya.

    YanıtlaSil
    Yanıtlar
    1. Uğraşmadım değil ama değdi :)

      Sil
  6. Çok faydalı bir post olmuş. Teşekkürler deneyeceğim.

    YanıtlaSil
  7. teşekkür ederim faydalı bilgiler için :)

    YanıtlaSil
  8. Resimli devamını oku butonunu diğer bloguma eklemek isterim. Çok faydalı bir paylaşım olmuş. Ama vakit bulup ne zaman yaparım bu kısmı muamma. En sondaki tüy kalemli olan yazı hoşuma gitti. :)
    Emeğine sağlık:)

    YanıtlaSil
    Yanıtlar
    1. Aslında pek vakit aldığı söylenemez taş çatlasın 15 dakikada yaparsınız :)

      Sil
  9. Teşekkürler Naz, tasarımların ve anlatımın harika :D Belki ben de deneyebilirim :))

    YanıtlaSil
    Yanıtlar
    1. Ben de teşekkür ederim denemelisin kesinlikle :)

      Sil
    2. Header'ına ve blog simgene bayıldığımı söylemezsem asla olmaz :D Çok güzel olmuşlaar :D

      Sil
    3. Değişiklik olsun diye yapmıştım geçen gün teşekkür ederim :)

      Sil
  10. Blogu yeni keşfettim kafama sıkarım birazdan :)

    YanıtlaSil
  11. En sonuncu şablonu beğendim.Bilgilendirici bir yazı :)

    YanıtlaSil
    Yanıtlar
    1. Buyrun sizin blogunuzda yer bulsun :)

      Sil
  12. denemek lazım becerebilir miyim bilemedim
    sağolasın

    YanıtlaSil
    Yanıtlar
    1. Gayet basit aslında bi deneyin siz :)

      Sil
  13. çok güzel açıklamışssın.. bu tür yazıların devamı gelmeli :)

    YanıtlaSil
    Yanıtlar
    1. Teşekkürler gelecek inşallah :)

      Sil
  14. Senin gibi bir insandan yararlı biley gelmesine şaşmamalı :) başarılı bir blog yazarı.. Devamını diliyorum.

    YanıtlaSil