WordPress'te Önceki ve Sonraki Yazı Bağlantılarına Küçük Resim Ekleme

Bir WordPress blog gönderisi üzerinde tüm bu çalışmalardan sonra, okuyucuların tek bir sayfadan sonra ayrıldığını görmek sinir bozucudur.

Bunun büyük bir nedeni mi? Yazılarınızın altındaki düz metin gezinme bağlantıları zar zor fark ediliyor.

Bu gezinme bağlantılarına küçük resimler eklemek dikkat çekmenize yardımcı olabilir. Okuyucular bir sonraki neyin geleceğini anında görebilir, bu da içeriklerinizi keşfetme olasılıklarını artırır.

Birçok yöntemi test ettik ve iş için en iyi aracın WPCode olduğunu bulduk. Tema dosyalarınıza dokunmadan özel kod parçacıklarını güvenli bir şekilde eklemenizi sağlar.

Bu kılavuzda, WordPress'teki önceki ve sonraki gönderi bağlantılarınıza küçük resim eklemeyi tam olarak göstereceğiz. Düşündüğünüzden daha kolay! 💡

Önceki ve Sonraki Yazı Bağlantılarıyla Küçük Resimler Neden Gösterilmeli?

Küçük resimler, gezinme bağlantılarınızı anında daha göz alıcı ve tıklanabilir hale getirir. Okuyucuları sitenizi keşfetmeye devam etmeye teşvik edebilir, bu da sayfa görüntülemelerini ve sitede kalma süresini artırabilir.

WordPress blogunuz, ziyaretçilerin yeni içerik bulmalarına ve sitenizde gezinmelerine yardımcı olacak bazı kullanışlı özellikler sunar.

Bu özellikler şunları içerir:

• Gezinme menüleri
• Bir arama çubuğu ve
• Bir yazı arşivleri widget'ı.

Yardımcı bir diğer gezinme özelliği ise her blog yazısının altında bulunur. Orada, sitenizin önceki ve sonraki yazılarına bağlantılar bulacaksınız.

Bu bağlantılar kullanıcı etkileşimini artırır çünkü ziyaretçiler bir blog yazısını okumayı bitirdiklerinde başka bir şey okumak isteyebilirler. Ancak, küçük resimler eklerseniz, bağlantılar daha etkileşimli görünecektir.

En iyi performans gösteren veya popüler blog yazılarınıza dikkat çekmenin harika bir yoludur.

Örneğin, zaten çok trafik çeken ve bu okuyucuları e-posta abonelerine dönüştüren temel içerikleriniz olabilir. Yazı bağlantılarıyla küçük resim eklemek, yalnızca e-posta listenizi oluşturmanıza ve küçük işletmenizi büyütmenize yardımcı olacaktır.

Bunu akılda tutarak, WordPress'te önceki ve sonraki gönderi bağlantılarına küçük resim eklemeyi göstereceğiz. Bu makalede ele alacağımız tüm konular şunlardır:

Başlayalım!

WordPress'te Önceki ve Sonraki Yazı Bağlantılarıyla Küçük Resimleri Kullanma

Önceki ve sonraki yazı bağlantılarınıza küçük resim eklemek için WordPress temanızın dosyalarına kod eklemeniz gerekecektir.

WordPress için en iyi kod parçacığı eklentisi olan WPCode kullanmanızı öneririz. Sitenizi bozmadan kod eklemenize olanak tanır ve hazır şablonlarla birlikte gelir, böylece kodu sıfırdan yazmak zorunda kalmazsınız.

Web sitelerimizde, özel kod parçacıklarını oluşturmak ve yönetmek için WPCode kullanıyoruz. Bizim için inanılmaz derecede iyi çalıştı ve özelliklerini incelemek için tam WPCode incelememize göz atabilirsiniz.

Bunu daha önce yapmadıysanız, WordPress'te kodu nasıl kopyalayıp yapıştıracağınız hakkındaki kılavuzumuza bakın.

Başlamak için WPCode eklentisini yüklemeniz ve etkinleştirmeniz gerekecek. WordPress yönetici alanınızdan Eklentiler » Eklenti Ekle'ye gidin.

Bir sonraki ekranda, WPCode eklentisini hızlıca bulmak için arama kutusunu kullanın.

Arama sonucunda ‘Şimdi Yükle’ye, ardından ‘Etkinleştir’e tıklayın.

Yardıma ihtiyacınız olursa, bir WordPress eklentisinin nasıl kurulacağına dair makalemize göz atabilirsiniz.

Etkinleştirdikten sonra, WordPress kontrol panelinizden Kod Parçacıkları » + Parçacık Ekle'ye gidin.

Önceden hazırlanmış şablonlardan oluşan geniş bir yelpazeden seçim yapabileceğiniz bir kod parçacığı kitaplığına yönlendirileceksiniz.

Önceki ve sonraki yazı bağlantılarına küçük resim eklemek için özel bir kod dizesi yükleyeceğiz.

Bu nedenle, ‘Özel Kodunuzu Ekleyin (Yeni Parçacık)’ altındaki ‘+ Özel Parçacık Ekle’ye tıklayalım.

Açılan açılır pencerede kod türünü seçeceksiniz.

Burada, WordPress işlevselliğini genişletmek için kullanılan küçük bir kod parçası olan 'PHP Parçacığı'nı seçmek isteyeceksiniz.

Sonraki adım, kod parçacığına daha sonra başvurabilmeniz için bir ad vermektir.

Ardından, aşağıdaki kodu WPCode metin düzenleyiciye yapıştırmanız yeterlidir:

function wpb_posts_nav(){
    $next_post = get_next_post();
    $prev_post = get_previous_post();
     
    if ( $next_post || $prev_post ) : ?>
     
        <div class="wpb-posts-nav">
            <div>
                <?php if ( ! empty( $prev_post ) ) : ?>
                    <a href="<?php echo get_permalink( $prev_post ); ?>">
                        <div>
                            <div class="wpb-posts-nav__thumbnail wpb-posts-nav__prev">
                                <?php echo get_the_post_thumbnail( $prev_post, [ 100, 100 ] ); ?>
                            </div>
                        </div>
                        <div>
                            <strong>
                                <svg viewBox="0 0 24 24" width="24" height="24"><path d="M13.775,18.707,8.482,13.414a2,2,0,0,1,0-2.828l5.293-5.293,1.414,1.414L9.9,12l5.293,5.293Z"/></svg>
                                <?php _e( 'Previous article', 'textdomain' ) ?>
                            </strong>
                            <h4><?php echo get_the_title( $prev_post ); ?></h4>
                        </div>
                    </a>
                <?php endif; ?>
            </div>
            <div>
                <?php if ( ! empty( $next_post ) ) : ?>
                    <a href="<?php echo get_permalink( $next_post ); ?>">
                        <div>
                            <strong>
                                <?php _e( 'Next article', 'textdomain' ) ?>
                                <svg viewBox="0 0 24 24" width="24" height="24"><path d="M10.811,18.707,9.4,17.293,14.689,12,9.4,6.707l1.415-1.414L16.1,10.586a2,2,0,0,1,0,2.828Z"/></svg>
                            </strong>
                            <h4><?php echo get_the_title( $next_post ); ?></h4>
                        </div>
                        <div>
                            <div class="wpb-posts-nav__thumbnail wpb-posts-nav__next">
                                <?php echo get_the_post_thumbnail( $next_post, [ 100, 100 ] ); ?>
                            </div>
                        </div>
                    </a>
                <?php endif; ?>
            </div>
        </div> <!-- .wpb-posts-nav -->
     
    <?php endif;
}

Ekranınızda nasıl görünebileceği aşağıdadır:

Etkinleştirmeden önce, ayarları kontrol etmek için aşağı kaydırarak ‘Ekleme’ bölümüne gidin.

Burada, ‘Ekleme Yöntemi’nin ‘Otomatik Ekle’ olarak ve ‘Konum’un ‘Her Yerde Çalıştır’ olarak ayarlandığından emin olun.

Ardından, tekrar yukarı kaydırabilir ve düğmeyi ‘Devre Dışı’ konumundan ‘Etkin’ konumuna getirebilirsiniz.

Yeni işlevinizi etkinleştirmek için ‘Kod Parçasını Kaydet’ veya ‘Güncelle’ düğmesine tıklamayı unutmayın.

İşlev oluşturulduğuna göre, WordPress'e tam olarak sayfada nereye yerleştireceğini söylemek için ikinci bir kod parçacığı oluşturmamız gerekiyor. Bunu iki kod parçacığına bölerek, önce özelliği güvenli bir şekilde oluştururuz ve ardından sitenizi aşırı yüklemeden veya düzeninizi bozmadan kolayca yerleştiririz.

Kod Parçacıkları » + Kod Parçacığı Ekle sayfasına geri dönelim.

Yine, ‘Özel Kodunuzu Ekleyin (Yeni Kod Parçacığı)’ seçeneği altında, ‘+ Özel Kod Parçacığı Ekle’ye tıklayın.

Görünen açılır pencerede WPCode sizden kod türünüzü isteyecektir.

‘PHP Kod Parçacığı’nı seçebilirsiniz.

Bu, daha öncekiyle aynı metin düzenleyiciyi açacaktır.

Yeni özel kod parçacığınız için daha sonra kolayca başvurabileceğiniz açıklayıcı bir ad verin.

Şimdi, aşağıdaki kodu WPCode metin düzenleyicisine kopyalayıp yapıştırabilirsiniz. Bu kod, öne çıkan görsele sahip navigasyonun nereye gösterileceğini WordPress'e söyler.

wpb_posts_nav();

Ekranınızda nasıl görünebileceği aşağıdadır:

Bu bittikten sonra, aşağı kaydırıp ‘Ekleme’ bölümüne gelmek ve ‘Konum’ yanındaki açılır menüye tıklamak isteyeceksiniz.

Buradan, 'Sayfa Bazlı' seçeneğine gidin ve 'Gönderi Sonrasına Ekle'yi seçin. Bu şekilde, küçük resimler bağlantıların yanında düzgün bir şekilde görünecektir.

Son olarak, 'Aktif' seçeneğini açabilir ve 'Kod Parçacığını Kaydet' (veya 'Güncelle') düğmesine tıklayabilirsiniz.

Değişikliklerinizi kaydettikten sonra, küçük resimlerle önceki ve sonraki gönderi bağlantılarını göstermek istediğiniz şablonda bu işlevi kullanabilirsiniz.

Konumu 'Yazıdan Sonra Ekle' olarak ayarladığınız için, WPCode yerleşimi sizin için otomatik olarak halledecektir. Tema dosyalarınızı düzenlemenize gerek yoktur.

Ve hepsi bu kadar - önceki ve sonraki gönderi küçük resimlerinizi eklediniz ve yapılandırdınız!

Artık web sitenizdeki bir gönderiyi görüntülediğinizde, gönderinin altındaki önceki ve sonraki bağlantılarda artık küçük resimler olduğunu göreceksiniz.

Alternatif: Küçük Resimlerle Popüler Gönderileri Görüntüleme

Bir gönderiyi okuduktan sonra okuyucularınızı etkilemenin bir başka yolu da her makaleden sonra popüler gönderilerin bir listesini görüntülemektir. Bu, okuyucularınızın yalnızca önceki ve sonraki yayınlanan makaleleri değil, en iyi içeriğinizi görmelerini sağlayacaktır.

Popüler yazılarınız en başarılı içeriğinizi içerir. Bunları ziyaretçilerinize göstermek, sayfa görüntülemelerinizi artırmanıza ve kullanıcı etkileşimini artırmanıza yardımcı olacaktır.

Önceki ve sonraki bağlantılar kronolojik okuma için harika olsa da, MonsterInsights gibi bir araç, okuyucuları etkileşimde tutmak için en iyi, en çok dönüşüm sağlayan içeriğinizi otomatik olarak öne çıkarmanıza olanak tanır.

WPBeginner olarak, MonsterInsights'ı web sitemizin performansını yakından takip etmek için kullanıyoruz. Tam MonsterInsights incelememizi görebilir ve neden veri odaklı kararlar almak için başvurduğumuz araç olduğunu anlayabilirsiniz.

MonsterInsights' Popüler Gönderiler Widget'ı geniş bir çekici tema yelpazesi ve çok sayıda özelleştirme seçeneği sunar.

Bunu ne kadar kolay kurabileceğinizi WordPress'te görüntülenmeye göre gönderileri gösterme kılavuzumuzda öğrenebilirsiniz.

Veya WordPress'te gönderi sonrası özel widget'lar ekleme kılavuzumuza bakabilirsiniz; burada her blog gönderisinin sonuna çeşitli içerik türleri eklemeyi öğrenebilirsiniz.

Gönderi Gezinme Küçük Resimleri Hakkında Sıkça Sorulan Sorular

Gönderi gezinize küçük resimler ekleme hakkında sorularınız mı var? Başlamadan önce okuyucuların sıkça sorduğu bazı sorular şunlardır.

WordPress'te Resim ve Diğer Medya Dosyalarını Kullanmak İçin Bonus Bağlantılar

Bu öğreticinin, WordPress'te önceki ve sonraki gönderi bağlantılarıyla küçük resimleri nasıl kullanacağınızı öğrenmenize yardımcı olduğunu umuyoruz.

Sonra, şunları da öğrenmek isteyebilirsiniz:

• WordPress Gönderi Küçük Resimlerini Kırpma ve Düzenleme
• WordPress'e Öne Çıkan Video Küçük Resimleri Nasıl Eklenir
• WordPress'te Görsel Alt Metni ve Görsel Başlığı Arasındaki Fark
• WordPress'te Öne Çıkan Görselin Neden Görünmediğini Düzeltme
• Kaliteyi Kaybetmeden Web Performansı İçin Resimleri Nasıl Optimize Edersiniz

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.