WordPress Gönderilerine Okuma İlerleme Çubuğu Nasıl Eklenir (3 Kolay Yol)

Çevrimiçi uzun bir makale okurken ne kadarının kaldığını bilmediğiniz o hissi bilirsiniz? Okuma ilerleme çubuklarının WordPress ziyaretçileriniz için çözdüğü sorun budur.

Bu basit görsel göstergeler, okuyuculara bir makalenin ne kadarını tamamladıklarını tam olarak gösterir, bu da onları okumaya devam etmeye ve sayfanızda kalmaya teşvik edebilir. Belirgin bir bitiş noktası olan herhangi bir şeyi tamamlama tatminini aynı şekilde kullanır.

Şimdi, biz WPBeginner'da ilerleme çubukları kullanmıyoruz çünkü öğreticilerimiz taranabilir şekilde tasarlanmıştır. Çoğu insan baştan sona okumak yerine ihtiyaç duydukları bölüme doğrudan atlar.

Ancak daha uzun blog gönderileri, ayrıntılı kılavuzlar veya detaylı makaleler yayınlıyorsanız, okuma ilerleme çubuğu insanları meşgul tutmaya gerçekten yardımcı olabilir.

Bu kılavuzda, WordPress sitenize bir tane eklemenin üç farklı yolunu göstereceğiz, ister basit bir eklenti çözümü ister daha özelleştirilmiş bir şey isteyin.

WordPress Blog Gönderilerinize Okuma İlerleme Çubuğu Ne Zaman Eklenir

Daha uzun blog gönderileri için okuma ilerleme çubuğu eklemek, ziyaretçileri WordPress web sitenizde kalmaya teşvik etmek için değerli bir araç olabilir.

Ancak her site için gerekli değillerdir. Deneyimlerimize göre, okuma ilerleme çubuklarının bu özel durumlarda en iyi şekilde çalıştığını bulduk:

• Uzun Makaleler: Detaylı kılavuzlar veya hikayeler yayınlıyorsanız, bir ilerleme çubuğu kullanıcıları sona kadar kaydırmaya teşvik eder.
• Doğrusal İçerik: Taranmak yerine baştan sona okunması gereken içerikler için mükemmeldirler.
• Etkileşimli Tasarım: Bir okuma ölçer, etkileşim katıyor. Kullanıcı deneyimini net bir varış noktası olan bir yolculuk gibi hissettiriyor.

Bunu akılda tutarak, WordPress yazılarınıza kolayca bir okuma ilerleme çubuğu eklemenin yollarını görelim. Tercih ettiğiniz yönteme atlamak için aşağıdaki hızlı bağlantıları kullanabilirsiniz:

Yöntem 1: Okuma İlerleme Göstergeleriyle Özel Bir Tema Tasarlayın

WordPress gönderilerine bir okuma ilerleme çubuğu eklemenin bir yolu, ilerleme çubuğu özelliğine sahip bir tema oluşturucu kullanmaktır. Bu şekilde, ilerleme çubuğu tasarımı temanızın geri kalanıyla sorunsuz bir şekilde bütünleşecek ve göze daha hoş görünecektir.

Bu yöntemin temanızı değiştirmeyi içereceğini unutmayın, bu nedenle temanızdan memnunsanız ve yakında değiştirmek istemiyorsanız bunu önermiyoruz. Bu durumda, bunun yerine 2. yöntemi (eklenti) veya 3. yöntemi (kod) kullanmalısınız.

Bu yöntem için Thrive Theme Builder kullanacağız. Thrive Theme Builder, okuma ilerleme çubuğuna sahip olmasının yanı sıra, bloglardan kurumsal web sitelerine kadar çeşitli amaçlar için düzinelerce tema şablonuna sahiptir.

En iyisi de, sürükle ve bırak oluşturucunun kullanımı kolaydır, bu da onu tamamen yeni başlayanlar için harika kılar.

Platform hakkında daha fazla bilgiyi Thrive Themes incelememizde öğrenebilirsiniz.

Thrive Themes'in bir dezavantajı, ücretsiz sürümünün olmamasıdır. Bununla birlikte, ilk satın alımınızda %50'ye varan indirimden yararlanmak için Thrive Themes kupon kodumuzu kullanabilirsiniz.

Adım 1: Thrive Theme Builder'ı Yükleyin

İlk adım Thrive Theme Builder'ı kurmaktır. Bu eklentiye Thrive Themes web sitesindeki hesabınıza giriş yaparak erişebilirsiniz.

Ardından, Thrive Product Manager eklentisini indirin ve yükleyin. Daha fazla bilgi için, bir WordPress eklentisi yükleme konusundaki başlangıç kılavuzumuza göz atın.

Eklenti etkinleştirildikten sonra, WordPress yönetici alanınızda Ürün Yöneticisi 'ne tıklayın.

Ardından, WordPress web sitenizi Thrive Themes hesabınıza bağlamak için ‘Hesabıma giriş yap’ düğmesine tıklayın.

Bundan sonra, hesabınızdaki tüm mevcut Thrive Themes ürünlerinin bir listesini görmelisiniz.

Burada, 'Thrive Architect' seçin ve 'Ürün Yükle' kutusunu işaretleyin.

Bu sayfa oluşturucu eklentisi, tema oluşturucu ile birlikte çalışır, bu yüzden onu etkinleştirmemiz gerekiyor.

Ardından, aşağı kaydırarak ‘Thrive Theme Builder’ bölümüne gidin ve ‘Tema Yükle’ kutucuğunu işaretleyin.

Şimdi, 'Seçili ürünleri yükle'ye tıklayın.

Bir sonraki sayfada, Thrive Ürün Yöneticisi'nin Thrive Tema Oluşturucu'yu kurup etkinleştirdiğini göreceksiniz.

İşlem bittiğinde, 'Tema Oluşturucu Kontrol Paneline Git' seçeneğine tıklayın.

Şimdi, bir WordPress teması seçin.

Hangisini seçeceğinizden emin değilseniz, temanın ilk önce nasıl göründüğünü görmek için 'Önizleme' düğmesine tıklayın. Ardından, kararınızı verdikten sonra 'Seç'e tıklayın.

Şimdi Tema Oluşturucu Sihirbazına ulaşmalısınız.

Bu kurulum sihirbazı, kendi logonuzu yükleme, temanıza eklemek için marka renkleri seçme ve temanızın farklı yapılarını ve şablonlarını ayarlama konusunda size yol gösterecektir.

Bir sonraki adıma geçmeden önce kurulum sihirbazını tamamlayın.

Adım 2: Tek Gönderi Şablonunuza Okuma İlerleme Çubuğu Ekleme

Temanız kurulduktan sonra, temanızın şablonuna bir okuma ilerleme çubuğu ekleyelim. Yalnızca okuma ölçer çubuğunu WordPress gönderilerinde görüntülemek istediğimiz için, yalnızca tek gönderi şablonunu düzenlememiz gerekecek.

Bunu yapmak için Thrive Theme Builder'daki ‘Şablonlar’ sekmesine geçin. Ardından ‘Varsayılan Gönderi’ şablonunu bulun ve ‘Düzenle’ye tıklayın.

Şu anda tema oluşturucunun içinde olmalısınız. Şablonu düzenlemek için sol bir kenar çubuğu, şablonun kendisinin bir önizlemesi ve daha fazla blok eklemek veya şablonun stilini değiştirmek için sağ tarafta küçük bir araç çubuğu bulunmalıdır.

Okuma çubuğunu eklemek için sol kenar çubuğunu aşağı kaydırın ve ‘Okuma ilerleme göstergesi’ ayarını bulun. Etkinleştirmek için geçiş düğmesine tıklamanız yeterlidir.

İlerleme çubuğunu ekledikten sonra, onu düzenlemeniz için bazı ek ayarlar olmalıdır.

İlk olarak, ilerleme çubuğunu başlığın altına veya görünüm alanının üstüne (başlığın hemen üstüne) eklemeyi seçebilirsiniz. İlk seçeneği tercih ederseniz, başlığın yapışkan olarak ayarlandığından emin olmanız gerekir, bunu daha sonra nasıl yapacağınızı göstereceğiz.

Ardından, ilerleme çubuğunun rengini değiştirebilirsiniz. Bunu yapmak için renk seçiciye tıklamanız yeterlidir.

Şimdi, tema renklerinden birini seçebilir veya temanızın önceden tanımlanmış renk şemasını kullanabilirsiniz. Veya, temanızın bir parçası olmayan tamamen farklı bir renk seçmek için 'Tema renginden ayır'ı tıklayabilirsiniz.

'Tema renginden bağlantıyı kaldır' seçeneğini seçerseniz, rengin opaklığını da ayarlayabilirsiniz.

Bu şekilde, ilerleme çubuğunun arka planına karşı ne kadar opak göründüğünü ayarlayabilirsiniz. Bununla birlikte, ilerleme çubuğunun rengini kullanıcıların okumasını engellemeyecek kadar canlı yapmamak en iyisidir.

Renkten memnun kaldığınızda, 'Uygula'ya tıklamanız yeterlidir.

Son olarak, ilerleme çubuğunun yüksekliğini ayarlayabilirsiniz.

Bu tema oluşturucu, çubuğu 10 piksele kadar yeniden boyutlandırmanıza olanak tanır. Bu, ilerleme çubuğunun çok büyük görünmemesini sağlar. Bunu akılda tutarak, ilerleme çubuğunun net bir şekilde görünmesi için 5 ile 10 arasında bir boyut seçmenizi öneririz.

Çubuğun görünümünden memnun kaldığınızda, değişikliklerinizi kaydetmek için ‘Çalışmayı Kaydet’e tıklayın.

Adım 3: Üst Bilginizi Sabitleyin (İsteğe Bağlı)

Okuma ilerleme çubuğunuzu başlığın altında göstermeyi seçerseniz, bu adımı izlemeniz gerekecektir. Aksi takdirde, bu adımı atlayabilirsiniz.

Öncelikle sol kenar çubuğunu yukarı kaydırın ve 'Üstbilgi'ye tıklayın.

Başlığı özelleştirmek için farklı bir ayar kümesi şimdi kenar çubuğunda görünmelidir.

İleri gidin ve Başlık Bölümü'ne doğru aşağı kaydırın ve ‘Düzenle’ye tıklayın.

Şimdi Kaydırma Davranışı sekmesini açın.

Ardından, ‘Yapışkan’ seçeneğini seçmeniz gerekir. Temanıza bağlı olarak, ilerleme çubuğunun görünmesi için ekranın üstünden uzaklığı 1 piksele değiştirmeniz de gerekebilir.

Diğer ayarları olduğu gibi bırakabilir ve alttaki 'Bitti' düğmesine tıklayabilirsiniz.

Adım 4: Okuma Süresi Göstergesi Ekleme (İsteğe Bağlı)

Thrive Theme Builder ile yapabileceğiniz bir diğer şey, bir gönderiyi baştan sona okumak için tahmini okuma süresini göstermektir. Bu, kullanıcıların bir makaleyi okumanın ne kadar süreceğini görmelerine yardımcı olur ve zamanlarına uygun içerik seçmelerini sağlar.

Öncelikle, gönderi meta verilerinizi göstermekten sorumlu bloğa tıklayın.

Bu, tekil gönderi şablonunuzun blog gönderisinin yazarını, kategorilerini, etiketlerini vb. bilgileri görüntüleyen kısmıdır.

Ardından, araç çubuğundaki 'Dinamik metin' simgesine tıklayın.

Burada, ilk açılır menüde 'İçerik' ve ikincisinde 'Kalan okuma süresi (dakika olarak)' seçmelisiniz.

Bundan sonra, 'Ekle'ye tıklayın.

Artık gönderi meta bölümünde '0 dakika kaldı' yazan yeni bir metin görmelisiniz. Bu metni istediğiniz gibi ayarlayabilirsiniz.

Bizim durumumuzda, ‘kalan’ kelimesini kaldırmaya karar verdik.

İşiniz bittiğinde, ‘Çalışmayı Kaydet’e tıklamayı unutmayın.

Adım 5: Okuma İlerleme Göstergelerinizi Önizleyin

Artık ilerleme çubuğu ayarlarınızı yapılandırdığınıza göre, çubuğun çalışırken görünmesi için blog yazınızı ziyaret edebilirsiniz.

Sitenizde çubuğu canlı olarak görmekten ziyade önizleme yapmak istiyorsanız, alttaki 'Önizleme' düğmesine tıklayabilirsiniz. Thrive Theme Builder, web sitenizi masaüstü, tablet ve mobil cihazlarda önizlemenizi sağlar.

Gerekli olduğu kadar çok değişiklik yapmaktan çekinmeyin.

Okuma ilerleme çubuğumuz şöyle görünüyor:

Yöntem 2: Ücretsiz Bir Eklenti ile Okuma İlerleme Çubuğu Ekleme

WordPress gönderilerinize ücretsiz olarak basit bir okuma ilerleme çubuğu eklemek istiyorsanız, Catch Scroll Progress Bar eklentisini kullanabilirsiniz.

Bu okuma ilerleme çubuğu eklentisi, sayfalarınızda ve gönderilerinizde otomatik olarak bir okuma ölçer gösterecektir ve bunu tercihlerinize göre kolayca özelleştirebilirsiniz.

Öncelikle eklentiyi WordPress yönetici alanınıza kurun. Daha fazla bilgi için, WordPress eklentisinin nasıl kurulacağına dair başlangıç kılavuzumuzu okuyun.

İşlem tamamlandıktan sonra, WordPress kontrol panelinizde Catch Scroll Progress Bar'a gidin. Şimdi kurulumu yapılacak bazı ilerleme çubuğu ayarları göreceksiniz.

Bu eklenti ile ilerleme çubuğunun konumunu üstten alta değiştirebilirsiniz. Bununla birlikte, normal üst konumu tercih ediyorsanız olduğu gibi bırakabilirsiniz.

Özelleştirebileceğiniz bir diğer şey arka plan rengi ve ön plan rengidir.

Arka plan rengi, kaydırmadan önceki boş çubuğun rengidir. Bu arada, ön plan rengi, okuyucu sayfayı aşağı kaydırdıkça ilerlemeyi göstermek için çubuğu doldurur.

Sonra, arka plan ve ön plan renklerinin şeffaflığını kontrol eden opaklıktır. Aralık 0 ile 1 arasındadır, 1 opak ve 0 şeffaf veya görünmezdir.

Beğendiğiniz opaklık seviyesini bulana kadar sayılarla oynamaktan çekinmeyin.

Ardından, ilerleme çubuğunun yüksekliğini ve kenar yarıçapını ayarlayabilirsiniz.

Yükseklik için, en iyi sayının 1 ile 8 arasında olduğunu, ancak bundan fazla olmadığını bulduk. Aksi takdirde, ilerleme çubuğu çok büyük görünebilir.

Kenarlık yarıçapı, ilerleme çubuğunuzun köşelerinin ne kadar yuvarlak görüneceğini kontrol eder. Eğer bu görünümden hoşlanmazsanız, ‘0’ girebilirsiniz.

Şimdi, bu eklenti aynı zamanda ilerleme çubuğunun hangi şablonlarda görüntüleneceğine karar vermenize olanak tanır: ana sayfanızda, blog sayfanızda, arşivlerde ve kategorilerde ve/veya tek gönderilerde veya sayfalarda.

Genellikle, yalnızca WordPress blog gönderilerinize bir okuma ilerleme çubuğu eklemeniz gerekir. Bu durumda, şablon koşul ayarlarında yalnızca 'Tek sayfa/gönderi'yi seçtik.

İlerleme çubuğunun yalnızca blog gönderilerinde görünmesini istediğimiz için, 'İlerleme çubuğunun uygulanacağı Gönderi türünü seçin' seçeneğindeki 'Gönderiler' seçeneğini de kontrol ettik.

Bununla birlikte, web sitenize en uygun koşulları kontrol etmekten çekinmeyin.

İlerleme çubuğu ayarlarınızdan memnun kaldığınızda, ‘Değişiklikleri Kaydet’ düğmesine tıklayın.

Şimdi, blog gönderinizi mobil veya masaüstünde önizlerseniz, bir ilerleme çubuğu görmelisiniz.

Yöntem 3: Kod ile Okuma İlerleme Çubuğu Ekleme

WordPress sitenize bir okuma ilerleme çubuğu eklemek için özel kod da kullanabilirsiniz.

Genellikle, öğreticiler sizden kodu doğrudan temanızın functions.php dosyasına eklemenizi isteyecektir. Ancak, bunu yapmanızı önermiyoruz çünkü en küçük bir hata bile sitenizi bozabilir.

Bunun yerine, WPCode eklentisini kullanmanızı öneririz. Herhangi bir çekirdek WordPress dosyasını düzenlemeden WordPress'e özel kod eklemenin en kolay ve en güvenli yoludur.

WPCode'u kapsamlı bir şekilde test ettik ve güvenilir ve yeni başlayanlar için uygun bir çözüm olduğunu bulduk.

Sitenize yalnızca birkaç tıklamayla ekleyebileceğiniz, hazır kod parçacıklarından oluşan yerleşik bir kitaplıkla birlikte gelir; bunlar arasında okuma ilerleme çubuğu için bir tane de bulunur. Özellikleri ve neden önerdiğimiz hakkında daha fazla bilgi edinmek için tam WPCode incelememize göz atabilirsiniz.

Başlamak için ücretsiz WPCode eklentisini yükleyip etkinleştirmeniz gerekir. Yardıma ihtiyacınız olursa, WordPress eklentisinin nasıl kurulacağına dair eğitimimize bakın.

Eklenti etkinleştirildikten sonra, WordPress kontrol panelinden Kod Parçacıkları » Kitaplık'a gidin.

Oradan, kitaplıkta 'Scroll Progress Bar'ı arayın, üzerine gelin ve 'Snippet kullan' düğmesine tıklayın.

WPCode daha sonra kodu sizin için otomatik olarak ekleyecektir.

Eklenti ayrıca arka planda sizin için doğru 'Otomatik Ekle' yöntemini otomatik olarak seçecektir.

Bundan sonra yapmanız gereken tek şey anahtarı Pasif'ten Aktif'e getirmektir.

Ardından, 'Güncelle' düğmesine tıklayın.

Şimdi web sitenizde bir blog yazısı görüntüleyebilirsiniz.

Basit bir ilerleme çubuğu şimdi şöyle görünmelidir:

WordPress Blog Okuyucularınızı Etkileşimde Tutmak İçin Bonus İpuçları

Gelişigüzel ziyaretçileri sadık okuyuculara dönüştürmek ister misiniz? Sizi ele aldık!

Okuyucularınızı büyüleyecek ipuçlarıyla dolu bu uzman WordPress eğitimlerine göz atın:

• İçeriğinizi görsel olarak ilgi çekici hale getirmek için her WordPress gönderisini farklı şekilde biçimlendirin.
• Metninizi bölmek ve okuyucuları içeriğinizde yönlendirmek için özel şekil ayırıcıları oluşturun.
• Kişiliğinizi ve blogunuza bir eğlence dokunuşu katmak için emojiler ekleyin.
• Geri dönen ziyaretçiler için yeni gönderileri vurgulayın ve daha fazlası için geri gelmelerini sağlayın.
• Okuyucularınız için önemli noktaları vurgulamak üzere WordPress gönderilerinizdeki metni vurgulayın.
• Araştırmanızı sergilemek için blog yazılarınıza basit ve zarif dipnotlar ekleyin.
• WordPress sitenizde dönen referansları göstererek ziyaretçilerinizi etkileyin.
• İçeriğinizin herkes tarafından erişilebilir olmasını sağlamak için WordPress sitenize bir yazı tipi yeniden boyutlandırıcı ekleyin.

Umarız bu makale, WordPress'te okuma ilerleme çubukları eklemenize yardımcı olmuştur. Ayrıca bir WordPress web sitesinin nasıl düzenleneceğine dair eksiksiz kılavuzumuza ve web sitesi tasarımı grafikleri için en iyi Canva alternatifleri hakkındaki uzman seçimlerimize de bakmak isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.