22 Temmuz 2017 Cumartesi

Blogger Devamını Oku Eklentisi Nasıl Eklenir ? Nasıl Özelleştirilir ?



                  Blogger devamını oku eklentisi nasıl eklenir ? Ve ya asıl anlatmak istediğim blogger devamını oku eklentisi nasıl özelleştirilir  konulu yazıma hoş geldiniz. Hep birlikte devamını oku eklentisini eklemeyi ve asıl anlatmak istediğim bu eklentiyi özelleştirmeyi anlatmaya başlayalım.





                Bir çok blog arkadaşımın bu eklentiyi varsayılan şekliyle kullandığını gördüm. Ve benim blogumda gördüğünüz üzere, ben bu eklentiyi bir çerçeve içine aldım ve yazı içinde ortaladım. Ayrıca mouse ile üzerine gelindiğinde yazı rengini değiştirerek görsel açıdan beni tatmin eden bir görüntü elde ettim. Nasıl göründüğünü merak edenler ana sayfamdan bakabilirler. Eminim sizlerinde hoşunuza gidecek bu özelliği anlatmak istedim.

#Blogger Devamını Oku Yazısı Nasıl Değiştirilir ?

                Öncelikle blogger sayfamıza devamını oku eklentisi nasıl eklenir onu resimlerle anlatacağım. Blog panelimizde yerleşim kısmına tıklıyoruz. Sonra blog kayıtları gadget ine tıklıyoruz. Açılan kısımdan Kayıt sayfası bağlantı metni yazan boşluğa ana sayfamızda görünmesini istediğimiz yazıyı yazıyoruz. Örneğin " Devamını Oku" ve ya " Devamını Oku --->>>" vs şeklinde istediğimiz yazıyı yazıyoruz. Sonra kaydedip çıkıyoruz.

#Blogger Devamını Oku Eklentisi Blog Yazılarımıza Nasıl Eklenir ?

                Devamını oku eklentisi eklememiz gereken yayınımıza giriyoruz. Ve aşağıda resimde görülen Atlama Aralığı Ekle kısmına tıklıyoruz. Burada tavsiyem ana sayfada görünmesini istediğimiz yazımızdan sonra bu eklentiye tıklamak. Ben genellikle giriş paragraf cümlemden sonra yapıyorum. Ve bir tavsiyem ise bu eklentiyi eklemeden önce bir kaç aşağı satıra geçmeniz daha iyi bir görüntü oluşturacak.




                 Asıl anlatmak istediğim yere gelmeden önce devamını oku eklentisini düzenleyebilmek için bir kaç satır css eklememiz gerekir. Bunu nereye eklememiz gerektiğini kısaca anlatayım.


#Blogger Css Dosyaları Nereye Eklenir ?

                Blog sayfamıza Css Eklemek için öncelikle blog panelimizde ki Tema sekmesine tıklıyoruz. Sonrasında Özelleştir kısmına tıklıyoruz. Sonrasında açılan sekmeden önce Gelişmiş kısmına daha sonra ise Css Ekle kısmına tıklıyoruz. Ve ekleyeceğimiz Css kodlarını aşağıda ki  resimde görülen bu boşluğa yazıp kaydediyoruz.




#Blogger Devamını Oku Eklentisi Nasıl Özelleştirilir-Modifiye Edilir ?

             Blogger devamını oku eklentisini özelleştirmek için aşağıda paylaşmış olduğu css kodunu, yukarıda anlatmış olduğum css ekleme kısmına ekleyip kaydediyoruz. Hepsi bu kadar.

.jump-link {
text-align:center;
font-size:20pt;
border:3px solid red;
width:200px;
height:40px;
margin-left:255px;
font-family:Florence,cursive;
}

.jump-link a:hover {
text-decoration:none;
}




                Eğer bu kodu kendi temamıza göre düzenlemek istersek yukarıda ki kodu nasıl değiştireceğinizi adım adım açıklayacağım.Bu kodu aynı şekilde eklediğinizde aşağıda ki gibi bir görüntü elde ediyoruz.



#Blogger Devamını Oku Eklentisini Konumlandırma

         Devamını oku yazısını sayfamızda konumlandırabilmek çok basit. Bunu yapabilmek için yukarıda paylaşmış olduğum kodda bulunan margin-left:255px; kısmı düzenlememiz yeterli olacaktır. Bu kod devamını oku yazımızın soldan 255px uzaklıkta olduğu anlamına gelir. Bu değeri artırırsak yazımız daha fazla sağa kayacak, azaltırsak daha fazla sola yaklaşacak. Bu değeri artırıp azaltarak sayfamızda görünmesini istediğimiz yere taşıyabiliriz.


#Blogger Devamını Oku Eklentisiyle İlgili Diğer Bazı Ayarlar


Kod içerisinde bulunan font-size kısmı yazı boyutunun olduğu kısımdır. Bu kısımda ki değeri artırıp azaltarak istediğin şekilde ayarlayabilirsiniz.

Border kısmı ise çerçeve ile ilgili kısımdır. Burada yazan Red çerçeve renginin kırmızı olduğu anlamına gelir. Siz bu red yerine istediğiniz rengin ingilizcesini yazarak istediğiniz renkte çerçeve elde edebilirsiniz. Ya da border kısmını tamamen silerseniz çerçeve ortadan kalkar.

Width ve Height yazımızın genişlik ve uzunluk olarak kapladığı yeri belirtir. Devamını Oku yazısından daha uzun bir şey yazarsanız width kısmını biraz daha artırabilirsiniz.

Font-family ise yazımızın fontuyla ilgili olan kısımdır. Buraya görüntülemek istediğiniz fontu yazarak değiştirip kendi göre ayarlayabilirsiniz.

Devamını oku yazı rengini değiştirmek için ise tasarım kısmından, Gelişmiş sonra Bağlantılar sonra bağlantı rengine tıklayarak istediğiniz rengi seçebilirsiniz.

Son olarak yazının üzerine geldiğinizde değişecek rengi ( Hover Efekti ) ise yine tasarım kısmından Gelişmiş sonra Bağlantılar Sonra ise Bağlantı vurgulama rengi kısmına tıklayarak değiştirebilirsiniz.

 Sonuç: 

     Diyeceksiniz ki meczup yazar neden böyle bir paylaşımda bulundu. Şöyle anlatayım. 2 sene önce pek sevdiğim çok yakın arkadaşımdan blogumla ilgili yardım istemiştim. Kendisi bana yardım etmedi, ne kadar yakın olduğumuzu umursamadan. Bende biraz sinir biraz hırsla kendimi Html ve Css ile ilgili kitapları okumaya yoğunlaştırdım. Hem yeni bir hobim oldu, hemde bir şeyler öğrenmiş oldum. Bu kitaplardan öğrendiklerimi (ki daha fazla öğrenebilirmiyim bilinmez ) zaman zaman sizlerle paylaşacağım. Çünkü bilgi paylaştıkça güzel, paylaştıkça değerli. Yukarıda anlattığım kısımla ilgili anlamadığınız, yapamadığınız her şeyi sormaktan çekinmeyin lütfen. Saygı ve sevgilerimle. Vesselam...

28 yorum:

  1. Bu faydalı paylaşım için teşekkürler benim kodlarla alakalı hiç bir fikrim yok ilgiyle takip ediyorum.

    YanıtlaSil
    Yanıtlar
    1. Ben teşekkür ederim. Olabildiğince en basit haliyle anlattım. Bence denemelisiniz. Yapamadığınız her hangi bir şey olursa mesaj atmaktan çekinmeyin. Bu değerli yorumunuz için çok teşekkür ederim...

      Sil
  2. Ay yinemi kodlar :) bir insan teknolojiden nasil bu kadar uzak olabilir anlayamiyorum :) cok güzel anlatmissiniz. Bir cogunun isine yarayacak. Ben simdilik sadece yazı esnasinda atlama araligini yapabiliyorum :)

    YanıtlaSil
    Yanıtlar
    1. Yazının devamını okur iseniz çok basit anlattım gerçekten :) Siz bir bakın, yapamaz iseniz ben yardımcı olacağım mesaj atmanız yeterli :)

      Sil
    2. Okudum ki buna rağmen anlamadim 😀 ya benim bu konulardan acayip basim agrio bide suan kafam böyle maden suyu gibi dolu ama fos :) sakin bir zamanda denemeye caliscam insallah.tesekkr ederim. ( Bide arkadasiniz ayip etmis. Kusura bakmayında bunun adi cekememezliktir. Ki hicde sevmem böyle syleri. Ama sebep olmus ögrenmissiniz :) iyiki yapmamis )

      Sil
    3. Tamam hiç önemli değil siz müsait olduğunuzda bana mesaj atın ben yardımcı olacağım :) Haklısınız epey bir ayıp oldu. Evet çok iyi bir şeye sebep oldu istemeden de olsa :) Tekrar yorum için teşekkürler :)

      Sil
  3. bir zamanlar bu türden bir eklenti arıyordum neyse ki sonradan halloldu..Meraklısı için güzel bir yazı olmuş :)

    YanıtlaSil
  4. çok faydalı ve açıklayıcı olmuş meczup ama yapabileceğimi sanmıyorum ben :D :D

    YanıtlaSil
    Yanıtlar
    1. Elbette yapabilirsin :) Çok basit birazcık uğraş yapmazsan bana mesaj at :)

      Sil
  5. Çok açıklayıcı olmuş, teşekkürler. Takipteyim, ben de bloguma beklerim

    YanıtlaSil
    Yanıtlar
    1. Rica ederim. Elbette uğrayacağım...

      Sil
  6. heey saaol hiç yapmadım ama belki lazım olur ama bi de ihtiyacı olanlara sölerim yazınııı :)

    YanıtlaSil
  7. İhtiyacı olanlara yardımcı olacak bir yazı ellerinize sağlık :) bizimki de çok önceden halloldu yoksa mutlaka denerdim :)

    YanıtlaSil
    Yanıtlar
    1. Çok teşekkür ederim :) Hallolmuş olmasına sevindim :)

      Sil
  8. Merhaba ..Tam aradığım uygulama. Klavyenize sağlık :)Yazılarım oldukça uzun olduğu için,sayfayı bölmem kullanışlı olacak.Talimatlarınızı uyguladım ,lakin Blog'a uygulama butonu devreye girmiyor.Sebebi hakkında bir bilginiz olabilir mi?

    YanıtlaSil
    Yanıtlar
    1. Teşekkür ederim :) Öncelikle blogunuz da ki herhangi bir gönderiye "Blogger Devamını Oku Eklentisi Blog Yazılarımıza Nasıl Eklenir ? " kısmını okuyarak Atlama Aralığı Ekleyin. Şuan baktığımda ana sayfanızda devamını oku yazısı gözükmüyor muhtemelen blog yayınına girip Atlama Aralığı ekleme kısmına basmadınız. Tekrar kontrol edin.

      Sil
    2. Atlama aralığını sonra ekleyeceğimi zannetmiştim.Söylediğiniz gibi css kodunu ekledim ama sonrasında Blog'a uygula butonu çalışmıyor

      Sil
    3. O zaman adım adım şunu yapın.

      1. Adım :Temaya tıklayın.
      2. Adım :Html düzenleye tıklayın.
      3. Adım :Açılan kod ekranında herhangi bir yere tıklayın ve sonrasında ctrl ve F tuşuna aynı anda basın.
      4. Adım :Açılan küçük arama kısmına ]]> kodunu yazıp entere basın.
      5. Adım:Daha sonra ]]> kodunun üzerine yukarıda vermiş olduğum kodu kopyalayıp yapıştırın ve kaydedin.

      Deneyip yorum yazın lütfen.

      Sil
    4. Maalesef yine olmadı.Bir yerlerde yanlış yapıyorum her halde.Neyse bırakayım "dağınık kalsın".İlginiz için teşekkür ederim

      Sil
    5. Yukarıda ki cevapta anlattığım blogger a css eklemenin diğer bir yoluydu.
      Siz müsait olduğunuzda blogunuzun temasını bana mail olarak atın birde ben bakayım o zaman belki yardımcı olabilirim. Ben teşekkür ederim.

      Sil
    6. Düzeltme:

      Yukarıda ki kısımda kod yazıldığı halde görüntülenemiyor bende aşağıya boşluklu şekilde yazdım boşluğu silip aratarak kodu bulun.

      ]]> < /b : s k i n>

      ifadesi yazılıp aratılacaktır ve bu ifadenin üst kısmına css kodları eklenecektir...

      Sil
  9. Zamanında aynı eklentiyi html kodları ile yapmaya çalışmıştım,tabiki de yapamadım:)) Ama bunu en yakın zamanda deneyeceğim kesinlikle,çok teşekkür ettim:))

    YanıtlaSil
    Yanıtlar
    1. Bunu yapabileceğinden eminim dene yeter ki :)
      Rica ederim. Yapamadığın her hangi bir şey olursa yazmaktan çekinme :)
      Ben teşekkür ederim :))

      Sil
  10. Özel temalarda bu eklentiyi kullanmaya gerek yok çünkü zaten devamını oku otomatik oluyor fakat blogger'ın kendi temalarını kullanan arkadaşlar için detaylı güzel bir anlatım olmuş, elinize sağlık.

    YanıtlaSil
    Yanıtlar
    1. Haklısınız özel temalar bir çok kolaylık sağlıyor. Benim gibi hala blogger ın kendi temasını kullanmakta olanların işlerine yarayacak bir eklenti. Vakit ayırıp bu değerli yorumu paylaştığınız için çok teşekkür ederim.

      Sil

Related Posts Plugin for WordPress, Blogger...