En çok ihtiyaç duyduğunuzda güvenilir WordPress eğitimleri.
WordPress Başlangıç Rehberi
WPB Kupası
25 Milyon+
Eklentilerimizi kullanan web siteleri
16+
Yıllık WordPress deneyimi
3000+
Uzmanlardan WordPress eğitimleri

Gönderi Kategorisine Göre Yedek Öne Çıkan Görsel Nasıl Ayarlanır

WordPress kategorileri için yedek öne çıkan resimler ayarlamanın, özellikle yüksek hacimli içeriğe sahip bloglar için büyük bir zaman kazancı olduğunu gördük.

Öne çıkan görseli olmayan makaleleriniz varsa veya bir kategorideki tüm gönderilerin benzer küçük resimlere sahip olmasını istiyorsanız, her kategori için bir yedek görsel ayarlayabilirsiniz.

Bu şekilde, hiçbir blog gönderisinin öne çıkan bir görsel olmadan kalmayacağından emin olabilirsiniz ve her gönderiye manuel olarak atamak zorunda kalmazsınız.

Bu makalede, belirli WordPress kategorileri için varsayılan yedek arka plan resimlerini nasıl ayarlayacağınızı göstereceğiz.

WordPress'te gönderi kategorisine göre yedek öne çıkan görseli ayarlama

Gönderi Kategorisi İçin Neden Yedek Öne Çıkan Görsel Eklenir?

Diyelim ki her yazıya tek bir kategori atadığınız bir WordPress blogunuz var. Bir nedenle öne çıkarılan bir görseli olmayan yazıların aynı yedek görseli göstermesini sağlamak için o kategorideki tüm yazılara atama yapabilirsiniz.

Bir yazı kategorisi için yedek görsel eklemenin bir diğer faydası da, kategori arşiv sayfalarınız çok fazla arama trafiği alıyorsa, onları daha ilgi çekici ve çekici hale getirmesidir.

Bununla birlikte, bir WordPress eklentisi ve özel kod kullanarak gönderi kategorisine göre bir yedek resim nasıl ekleyebileceğinizi görelim.

Varsayılan olarak WordPress, yazı kategori sayfalarınıza görsel ekleme seçeneği sunmaz. Ancak, bir WordPress eklentisi kullanarak yazı kategorileri için kolayca bir yedek görsel ayarlayabilirsiniz.

Öncelikle Category and Taxonomy Image eklentisini yükleyip etkinleştirmeniz gerekir. Daha fazla ayrıntı için lütfen bir WordPress eklentisinin nasıl kurulacağına ilişkin kılavuzumuza bakın.

Etkinleştirdikten sonra, WordPress yönetici panelinden Ayarlar » Taksonomi Resmi bölümüne gidebilirsiniz. Ardından, yazı kategorilerinize yedek olarak taksonomi görsellerini dahil etmek için 'kategori' onay kutusuna tıklayabilirsiniz.

Kategori için taksonomi resimlerini etkinleştirin

İşiniz bittiğinde 'Değişiklikleri Kaydet' düğmesine tıklamayı unutmayın.

Bundan sonra, WordPress kontrol panelinizden Yazılar » Kategoriler bölümüne gidebilirsiniz. Yeni bir kategori eklerken veya mevcut bir kategoriyi düzenlerken 'Resim' alanı görünecektir.

Kategoriler için yeni resim alanı

WordPress kategorinize eklemek istediğiniz bir görselin URL'sini girmeniz yeterlidir. Bununla ilgili daha fazla ayrıntı için lütfen WordPress'e yüklediğiniz görsellerin URL'sini nasıl alacağınıza ilişkin kılavuzumuza bakın.

Şimdi, öne çıkan bir resim atanmamış bir blog gönderisi yayınladığınızda, WordPress kategori için az önce ayarladığınız resmi kullanacaktır.

Demo sitemizde kullandığımız görselin önizlemesi burada.

Eklenti ile yedek resim önizlemesi

Hepsi bu kadar! Artık gönderi kategorisine göre bir yedek resim başarıyla eklediniz.

WordPress eklentisi kullanmadan gönderi kategorileri için bir yedek resim de yapılandırabilirsiniz. Ancak bu yöntem, kod parçacıkları içerdiği için yeni başlayanlara önerilmez.

Yapmanız gereken ilk şey, WordPress kategorileriniz için görseller oluşturmaktır. Kategori kod adını görsel dosya adınız olarak kullanın ve hepsini JPG veya PNG gibi aynı biçimde kaydedin.

Ardından, kategori görsellerinizi WordPress sitenize Ortam » Yeni Ekle bölümünden yükleyebilirsiniz.

Görselleri ortam kütüphanesine yükleyin

WordPress, kategori görsellerinizi yükleme sırasında saklayacak ve temanız tarafından tanımlanan görsel boyutlarını oluşturacaktır.

Kategori görsellerini yükledikten sonra, onları farklı bir dizine taşımanız gerekir. Sadece bir FTP istemcisi kullanarak web sitenize bağlanın ve /wp-content/uploads/ klasörüne gidin.

WordPress'te Yüklemeler klasörü

Yüklediğiniz kategori resimleri, /uploads/2022/08/ gibi ay klasöründe saklanacaktır.

Devam edin ve bu ayın klasörünü açın.

Medya yüklemeleri yıllık ve aylık klasörlerde düzenlendi

Daha fazla bilgi için lütfen WordPress'in sitenizde görseli nereye sakladığına ilişkin kılavuzumuza bakın.

Ardından, bilgisayarınızın masaüstünde category-images adında bir klasör oluşturun. Şimdi, tüm kategori görsellerinizi ve WordPress'in onlar için oluşturduğu tüm boyutlardaki görselleri masaüstünüzdeki bu yeni klasöre indirin.

İndirme bittikten sonra, category-images klasörünü /wp-content/uploads dizininize yüklemeniz gerekir. Bunu yapmak, tüm kategori resim boyutlarınızı temanıza kolayca çağrılabilecek ayrı bir klasörde bulundurmanızı sağlayacaktır.

Daha fazla ayrıntı için lütfen dosyaları WordPress'e yüklemek için FTP'nin nasıl kullanılacağına ilişkin kılavuzumuza bakın.

Kategori Resmini Varsayılan Yedek Arka Plan Resmi Olarak Görüntüleme

Son olarak, bir kategorideki gönderinin öne çıkan görseli ayarlanmamışsa, bu görsellerden birini yedek öne çıkan görsel olarak nasıl göstereceğinizi açıklayacağız.

Bu yöntem kod kopyalayıp yapıştırmayı içerir ve normalde kullanıcıların tema dosyalarını düzenlemesini önermeyiz. Küçük hatalar sitenizde büyük sorunlara neden olabilir.

Sitenize kod eklemenin daha kolay bir yolu WPCode kullanmaktır. Sitenizdeki özel kodu güvenli ve kolay bir şekilde yönetmenizi sağlayan en iyi WordPress kod parçacığı eklentisidir.

Öncelikle ücretsiz WPCode eklentisini yükleyip etkinleştirmeniz gerekir. Daha fazla ayrıntı için lütfen bir WordPress eklentisinin nasıl kurulacağına ilişkin kılavuzumuza bakın.

Ardından, yeni bir kod parçacığı eklemek için WordPress yönetici panelinizde Kod Parçacıkları » + Kod Parçacığı Ekle bölümüne gidebilirsiniz. Ardından 'Yeni Ekle' düğmesine tıklayın.

WPCode'da 'Yeni Parça Ekle'ye Tıklayın

Bundan sonra, özel kod ekleyebilir veya WPCode kitaplığından bir kod parçacığı kullanabilirsiniz.

Bunun için kendi özel kodunuzu kullanacaksınız, bu nedenle 'Özel Kod Ekle (Yeni Parça)' seçeneğinin üzerine gelin ve '+ Özel Parça Ekle' düğmesine tıklayın.

WordPress'e özel bir kod parçacığı ekleme

Ardından, ekranda görünen seçenekler listesinden kod türü olarak 'PHP Snippet' seçmeniz gerekir.

PHP parçacığı seçeneğini seçin

Şimdi kod parçacığınız için, kodun ne işe yaradığını hatırlamanıza yardımcı olacak herhangi bir isim girin.

Bir yedek resim ekleyin

Bundan sonra, aşağıdaki kod parçasını kopyalayıp 'Kod Önizleme' alanına yapıştırmanız yeterlidir.

/**
 * Plugin Name: Category Thumbnail Fallback
 * Description: Use the category image as fallback when the post does not have a featured image
 */

class WPBCategoryThumbnailFallback
{
    protected static $taxonomies = ['category'];

    protected $nonceId = 'wpb_category_thumb_fallback_none';
    protected $fieldId = 'wpb_category_fallback_post_image';

    public $taxonomy;

    protected function __construct($taxonomy)
    {
        $this->taxonomy = $taxonomy;
    }

    public static function init()
    {
        foreach (static::$taxonomies as $taxonomy) {
            $_self = new self($taxonomy);

            add_action('admin_enqueue_scripts', [$_self, 'scripts']);

            add_action("{$taxonomy}_add_form_fields", [$_self, 'add']);
            add_action("{$taxonomy}_edit_form_fields", [$_self, 'edit'], 99, 2);

            add_action("created_{$taxonomy}", [$_self, 'saveTerm'], 10, 2);
            add_action("edited_{$taxonomy}", [$_self, 'editTerm'], 10, 2);

            add_filter("get_post_metadata", [$_self, 'fallback'], 99, 5);
        }
    }

    public function scripts($hook_suffix)
    {
        if (in_array($hook_suffix, ['term.php', 'edit-tags.php'])) {
            $screen = get_current_screen();

            if (is_object($screen) && "edit-{$this->taxonomy}" == $screen->id) {
                wp_enqueue_media();

                wp_add_inline_script('media-editor', $this->inlineScript());
            }
        }
    }

    public function add()
    {
        ?>
        <div class="form-field upload_image-wrap">
            <label for="upload_image">Image</label>
            <input id="upload_image" type="hidden" size="36" name="<?php
            echo esc_attr($this->fieldId)
            ?>" value=""/>
            <div id="wpb-category-image-preview" style="max-width: 150px; max-height: 150px;"></div>
            <input id="upload_image_button" class="button" type="button" value="Upload Image"/>
            <p>Enter a URL or upload an image</p>
        </div>
        <?php
        wp_nonce_field($this->nonceId, $this->nonceId);
    }

    public function edit($term, $taxonomy)
    {
        $value = get_term_meta($term->term_id, $this->fieldId, true);
        $image = wp_get_attachment_image((int)$value);
        ?>
        <tr class="form-field upload_image-wrap">
            <th scope="row"><label for="name">Image</label></th>
            <td>
                <label for="upload_image">
                    <input id="upload_image" type="hidden" size="36" name="<?php
                    echo esc_attr($this->fieldId)
                    ?>" value="<?php
                    echo esc_attr($value)
                    ?>"/>
                    <div id="wpb-category-image-preview" style="max-width: 150px; max-height: 150px;"><?php
                        echo $image;
                        ?></div>
                    <input id="upload_image_button" class="button" type="button" value="Upload Image"/>
                </label>
                <p class="description">Enter a URL or upload an image</p>
            </td>
        </tr>
        <?php
        wp_nonce_field($this->nonceId, $this->nonceId);
    }

    public function saveTerm($term_id, $tt_id)
    {
        $data = array_filter(wp_unslash($_POST), function ($value, $key) {
            return in_array($key, [$this->nonceId, $this->fieldId]);
        }, ARRAY_FILTER_USE_BOTH);

        if (
            empty($data) ||
            empty($data[$this->nonceId]) ||
            ! wp_verify_nonce($data[$this->nonceId], $this->nonceId) ||
            ! current_user_can('manage_categories')
        ) {
            return null;
        }

        if (empty($data[$this->fieldId]) || empty(absint($data[$this->fieldId]))) {
            return delete_term_meta($term_id, $this->fieldId);
        }

        $value = absint($data[$this->fieldId]);

        return update_term_meta($term_id, $this->fieldId, $value);
    }

    public function editTerm($term_id, $tt_id)
    {
        $this->saveTerm($term_id, $tt_id);
    }

    public function fallback($null, $object_id, $meta_key, $single, $meta_type)
    {
        if (
            $null === null &&
            $meta_key === '_thumbnail_id'
        ) {
            $meta_cache = wp_cache_get($object_id, $meta_type . '_meta');

            if ( ! $meta_cache) {
                $meta_cache = update_meta_cache($meta_type, [$object_id]);
                $meta_cache = $meta_cache[$object_id] ?? null;
            }

            $val = null;

            if (isset($meta_cache[$meta_key])) {
                if ($single) {
                    $val = maybe_unserialize($meta_cache[$meta_key][0]);
                } else {
                    $val = array_map('maybe_unserialize', $meta_cache[$meta_key]);
                }
            }

            if (empty($val)) {
                $fallbackImageId = $this->getPostFallbackImageId($object_id, $single);

                if ( ! empty($fallbackImageId)) {
                    return $fallbackImageId;
                }
            }

            return $val;
        }

        return $null;
    }

    public function getPostFallbackImageId($postId, $single)
    {
        $terms = get_the_terms($postId, $this->taxonomy);

        if (empty($terms) || is_wp_error($terms)) {
            return null;
        }

        foreach ($terms as $term) {
            $fallbackIdFromCategoryId = get_term_meta($term->term_id, $this->fieldId, $single);

            if ( ! empty($fallbackIdFromCategoryId)) {
                return $fallbackIdFromCategoryId;
            }
        }

        return null;
    }

    public function inlineScript()
    {
        return "jQuery(document).ready(function ($) {
            var custom_uploader;
            $('#upload_image_button').click(function (e) {
                e.preventDefault();
                //If the uploader object has already been created, reopen the dialog
                if (custom_uploader) {
                    custom_uploader.open();
                    return;
                }
                //Extend the wp.media object
                custom_uploader = wp.media.frames.file_frame = wp.media({
                    title: 'Choose Image',
                    button: {
                        text: 'Choose Image'
                    },
                    multiple: true
                });
                //When a file is selected, grab the URL and set it as the text field's value
                custom_uploader.on('select', function () {
                    console.log(custom_uploader.state().get('selection').toJSON());
                    attachment = custom_uploader.state().get('selection').first().toJSON();
                    
                    var thumbUrl = attachment && attachment.sizes && attachment.sizes.thumbnail && attachment.sizes.thumbnail.url
                    ? attachment.sizes.thumbnail.url
                    : attachment.url;
                    $('#wpb-category-image-preview').html('<img src=\"'+ thumbUrl +'\">');
                    $('#upload_image').val(attachment.id);
                });
                //Open the uploader dialog
                custom_uploader.open();
            });
        });";
    }
}

Ardından, 'Ekleme' bölümüne aşağı kaydırabilir ve eklentinin yerleşimi sizin için halletmesine izin vermek üzere 'Otomatik Ekle'yi seçebilirsiniz.

Ardından, 'Konum' açılır menüsünde 'Sayfa, Gönderi, Özel Gönderi Türü' bölümünün altındaki 'İçerikten Önce Ekle' seçeneğini seçin.

Yedek görsel ekleme seçeneğini belirleyin

Ardından sayfanın başına dönebilir ve geçişi 'Etkin Değil'den 'Etkin'e değiştirebilirsiniz.

Üstteki ‘Kod Parçasını Kaydet’ düğmesine tıkladığınızda, yedek resminiz yerleştirilmiş olacaktır.

WPCode kod parçacığını kaydet ve etkinleştir

Ayrıca WordPress'te özel kod parçacıklarının nasıl ekleneceğine ilişkin kılavuzumuza da bakmak isteyebilirsiniz.

Not: Bu kod parçacığı yalnızca 'kategori' taksonomisi ile çalışacaktır. Ancak, aşağıdaki sınıftaki listeye adlarını ekleyerek ve köşeli parantez içindeki terimi örneğin 'etiket' veya 'gönderi' olarak değiştirerek daha fazla taksonomi ekleyebilirsiniz.

protected static $taxonomies = ['category'];

İşiniz bittiğinde, yedek görüntüyü görmek için web sitenizi ziyaret etmeniz yeterlidir.

Yedek resim önizlemesi

Umarız bu makale, yazı kategorisine göre yedek bir öne çıkan görsel eklemenize yardımcı olmuştur. Ayrıca WordPress yazılarına ilerleme çubuğu ekleme kılavuzumuza ve web sitesi grafikleri için en iyi Canva alternatifleri hakkındaki uzman seçimlerimize de bakabilirsiniz.

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.

Açıklama: İçeriğimiz okuyucu desteklidir. Bu, bazı bağlantılarımıza tıkladığınızda bir komisyon kazanabileceğimiz anlamına gelir. WPBeginner'ın nasıl finanse edildiğini, neden önemli olduğunu ve bize nasıl destek olabileceğinizi görün. İşte editöryal sürecimiz.

Nihai WordPress Araç Seti

Araç Kitimize ÜCRETSİZ erişim kazanın - her profesyonelin sahip olması gereken WordPress ile ilgili ürün ve kaynaklardan oluşan bir koleksiyon!

Okuyucu Etkileşimleri

12 CommentsLeave a Reply

  1. Makaledeki WPCode kod parçasında bir şeyler yanlış olduğunu düşünüyorum, sol sütunda bazı üst üste binen satır numaraları gösteriyor.

    • Bu, CSS'imizin şu anda sayıları tek karakterli bir sütunla sınırlamasından kaynaklanmaktadır.

      Yönetici

  2. En ilginç olanı, küçük resmi değiştirmek için bir kancaya sahip olmak, böylece küçük resmin kullanıldığı her yerde değiştirmekle uğraşmak zorunda kalmamak.

  3. Thank you. This works like a charm :-)

    Gönderide yedek arka plan resmi görüntülenirken; kategori/arşiv sayfalarında veya gönderilerin ana sayfada görüntülendiği yerlerde bunları nasıl gösterebileceğime dair herhangi bir fikriniz var mı?

  4. bu aynı gereksinim için artık bir eklentimiz var mı? yoksa hala manuel yöntemi mi kullanmamız gerekiyor?

  5. Merhaba!
    Lütfen makalelerin "ŞİMDİ SAĞDA DAHA FAZLASI WPBEGINNER" bölümünde gösterildiği gibi nasıl görüntülendiğini gösterir misiniz? Bir Wordpress şablonu
    Teşekkür ederim

  6. I turned off the organize posts by date month in settings/media, and changed url to reflect uploads directory specifically – that way I can avoid the extra step. I’m hoping this won’t cause issues with my host but it certainly makes life a little easier for me. Thank you so much for sharing this info, I have been searching for a looooong time and it’s finally how I want it :)

  7. merhaba,,, wordpress ana sayfama dinamik resim eklemek istiyorum. zaten farklı konumlara ayarlanmış 5 resim var..
    ben sadece onları değiştirmek ve gönderi ve kategorilere göre yeni fotoğraf eklemek istiyorum…
    lütfen yardım edin
    deneme yaptım ama başarılı olamadım
    post by thumbian fonksiyonunu kullandım

  8. Bu harika, ancak sınıflandırılmış tema sitemde Gönderi Kategorisi Görselini Varsayılan Yedek Öne Çıkan Görsel olarak görüntülemeyi uygulamaya çalışırken feci şekilde başarısız oldum. 'Stok' gönderi kategorilerinden farklı kategoriler kullanıyor ve yazar yardım etmiyor.

    Kategori Resmini Varsayılan Yedek Arka Plan Resmi Olarak Görüntüleme'yi temama uygulamama yardımcı olabileceğiniz herhangi bir teknik hizmetiniz var mı, ücretli veya başka türlü?

  9. Bu gerçekten harika, benim durumumda gerçekten kullanışlı bir ipucu. Tek sorun, yukarıdaki ilk kodun eksik olması. Neyse ki "if" kısmına ihtiyacım yoktu, bu yüzden onu çıkardım ve her şey yolunda gitti.

    "Yeni başlayanlar" sitenizdeki oldukça gelişmiş ipuçları için teşekkürler. Devam edin!

  10. Başka bir fikir, gönderi kaydedildiğinde gönderi küçük resmini ayarlamak olabilir. Yukarıdaki çözümün avantajı, kategori küçük resminin kolayca değiştirilebilmesidir.

Leave A Reply

Yorum bırakmayı seçtiğiniz için teşekkürler. Lütfen tüm yorumların yorum politikamıza göre denetlendiğini ve e-posta adresinizin YAYINLANMAYACAĞINI unutmayın. Lütfen ad alanında anahtar kelime KULLANMAYIN. Kişisel ve anlamlı bir sohbet edelim.