WordPress’e Daha Fazla Gönderi Yükle Düğmesi Nasıl Eklenir

750 425 KreatifAjans

WordPress’e daha fazla gönderi yükle düğmesi eklemek ister misiniz? Birçok popüler platform, kullanıcıların sayfanın altına ulaştıklarında daha fazla gönderi yüklemelerine izin verir. Bu makalede, WordPress’e nasıl kolayca daha fazla gönderi yükle düğmesi ekleyeceğinizi göstereceğiz.

How to add load more posts button in WordPress

WordPress’e Ne Zaman ve Neden Daha Fazla Gönderi Yükle Düğmesi Ekleyin

Kullanıcılarınızı içerikle meşgul tutmak, daha fazla görüntüleme ve sonuç olarak daha fazla abone almanıza yardımcı olur.

Birçok blog, ana sayfalarının, bloglarının ve arşiv sayfalarının sonundaki basit ‘Eski yazılar’ gezinme bağlantısını kullanır. Bazı web siteleri, daha fazla bağlam sağlayan sayısal sayfada gezinme kullanır.

Bununla birlikte, sonsuz kaydırmadan veya daha fazla gönderi yükle düğmesinden büyük ölçüde yararlanabilecek belirli web siteleri vardır. Bazı örnekler şunları içerir: fotoğrafçılık web siteleri, listeler ve viral içerikli web siteleri.

Tamamen yeni bir sayfa yüklemek yerine, ‘daha fazla gönderi yükle’ düğmesi sonsuz kaydırma gibi çalışır. Bir sonraki içerik grubunu hızlı bir şekilde getirmek için JavaScript kullanır. Bu, kullanıcı deneyimini iyileştirir ve onlara içeriğinizin daha fazlasını görüntüleme şansı verir.

Bununla birlikte, WordPress sitenize daha fazla gönderi yükle düğmesini nasıl kolayca ekleyeceğinize bir göz atalım.

WordPress’e Daha Fazla Gönderi Yükle Düğmesi Ekleme

Yapmanız gereken ilk şey, Ajax Load More eklentisini yüklemek ve etkinleştirmektir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına dair adım adım kılavuzumuza bakın.

Etkinleştirmenin ardından eklenti, WordPress yönetici menünüze ‘Ajax Daha Fazla Yükle’ etiketli yeni bir menü öğesi ekleyecektir. Tıklamanız ve eklentinin ayarlar sayfasına gitmeniz gerekir.

Ajax Load More settings

Ayarlar sayfasında, düğmenizin rengini seçebilirsiniz. Ayrıca düğmeyi, kullanıcılar düğmeyi tıklatmadan sonraki gönderileri otomatik olarak yükleyen sonsuz kaydırmayla değiştirebilirsiniz.

Ardından, gönderileri görüntülemek üzere şablonunuzu eklemek için Ajax Daha Fazla Yükle »Tekrarlayıcı Şablon sayfasını ziyaret etmeniz gerekir.

Eklenti, yayınları görüntülemek için WordPress döngüsünü içeren temel bir şablonla birlikte gelir. Ancak, temanızla eşleşmiyor ve web sitenizde uygunsuz görünebilir.

Bunu düzeltmek için temanızın indeks, arşiv ve blog sayfalarında gönderileri görüntülemek için kullandığı kodu kopyalamanız gerekir.

Normalde, bu kod temanızın template-parts klasöründe bulunur. Bu klasörde, farklı içeriği görüntülemek için şablonlar göreceksiniz. Örneğin, content-page.php, content-search.php ve daha fazlası.

Jenerik content.php şablonunu arayacaksınız. Demo temamızın content.php dosyasından bir örnek:

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php // Post thumbnail. twentyfifteen_post_thumbnail(); ?> <header class="entry-header"> <?php if ( is_single() ) : the_title( '<h1 class="entry-title">', '</h1>' ); else : the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); endif; ?> </header><!-- .entry-header --> <div class="entry-content"> <?php /* translators: %s: Name of current post */ the_content( sprintf( __( 'Continue reading %s', 'twentyfifteen' ), the_title( '<span class="screen-reader-text">', '</span>', false ) ) ); wp_link_pages( array( 'before' => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>', 'after' => '</div>', 'link_before' => '<span>', 'link_after' => '</span>', 'pagelink' => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%', 'separator' => '<span class="screen-reader-text">, </span>', ) ); ?> </div><!-- .entry-content --> <?php // Author bio. if ( is_single() && get_the_author_meta( 'description' ) ) : get_template_part( 'author-bio' ); endif; ?> <footer class="entry-footer"> <?php twentyfifteen_entry_meta(); ?> <?php edit_post_link( __( 'Edit', 'twentyfifteen' ), '<span class="edit-link">', '</span>' ); ?> </footer><!-- .entry-footer --> </article><!-- #post-## -->

Bu kodu bulduğunuzda, eklenti ayarlarında Tekrarlayıcı Şablonları alanına yapıştırmanız gerekir.

Ayarlarınızı kaydetmek için ‘Şablonu Kaydet’ düğmesine tıklamayı unutmayın.

Daha sonra, kısakodu oluşturmak için Ajax Daha Fazla Yükle »Shortcode Builder sayfasını ziyaret etmeniz gerekir.

Bu sayfa, özelleştirebileceğiniz birçok farklı seçenek içerir. İlk önce konteyner tipini seçmeniz gerekecek. Emin değilseniz, daha önce kopyaladığınız şablona bakın. Modern temaların çoğu <div> ; öğesi.

Bundan sonra düğme etiketleri bölümüne gidin. Burada düğmede görünen metni değiştirebilirsiniz. Eklenti varsayılan olarak ‘Eski Yazılar’ı kullanır ve bunu’ Daha fazla gönderi yükle ‘veya istediğiniz herhangi bir şey olarak değiştirebilirsiniz.

Button label

Son olarak, gönderilerin otomatik olarak yüklenmesini mi yoksa kullanıcıların daha fazla gönderi yükle düğmesini tıklamasını mı beklemeyi seçmeniz gerekir.

Disable scroll

Kısa kodunuz artık kullanıma hazırdır. Sağ sütunda, kısa kod çıktısını göreceksiniz. Devam edin ve kısa kodu kopyalayın ve sonraki adımda ihtiyacınız olacağı için bir metin düzenleyicisine yapıştırın.

Shortcode output

WordPress Temanıza Daha Fazla Gönderi Ekleme

Öğreticinin bu kısmı, WordPress tema dosyalarınıza kod eklemenizi gerektirir. Bunu daha önce yapmadıysanız, WordPress’te kodun nasıl kopyalanıp yapıştırılacağına ilişkin kılavuzumuza bir göz atın.

Herhangi bir değişiklik yapmadan önce WordPress temanızı yedeklemeyi unutmayın.

Temanıza daha fazla gönderi yükle düğmesini eklemek istediğiniz şablon dosyalarını bulmanız gerekecek. Temanızın nasıl düzenlendiğine bağlı olarak, genellikle bu dosyalar index.php, archives.php, kategoriler.php vb.

Daha önce kopyaladığınız kısa endwhile;, endwhile; hemen sonra endwhile; etiket.

Kısa kodu bir tema dosyasına eklediğimiz için, bunu do_shortcode işlevinin içine şu şekilde eklememiz gerekecek:

echo do_shortcode('[ajax_load_more container_type="div" post_type="post"]');

Artık değişikliklerinizi kaydedebilir ve ‘Daha fazla gönderi yükle’ düğmesini çalışırken görmek için web sitenizi ziyaret edebilirsiniz.

Click to load more posts button preview

Umarız bu makale, WordPress’e daha fazla gönderi yükle düğmesinin nasıl ekleneceğini öğrenmenize yardımcı olmuştur. Ayrıca yeni başlayanlar için en yararlı WordPress ipuçları, püf noktaları ve hack’lerden oluşan mega listemizi de görmek isteyebilirsiniz.