WordPress functions.php ile Open Graph Meta Tagları Ekleme

Tarafındankomut
0 Comments

Sosyal medyada bir link paylaştığınızda o güzel önizleme kartının çıkması sihir gibi görünüyor ama aslında tamamen teknik bir iş. Facebook, WhatsApp, LinkedIn ve benzeri platformlar sayfanızın meta etiketlerine bakarak o kartı oluşturuyor. WordPress sitenizde bu etiketleri doğru şekilde eklemezseniz ya çirkin bir önizleme çıkıyor, ya yanlış resim gösteriyor, ya da hiç çıkmıyor. Bu yazıda functions.php üzerinden Open Graph meta etiketlerini nasıl ekleyeceğinizi, özelleştireceğinizi ve WooCommerce ürünleri için nasıl yöneteceğinizi adım adım göreceğiz.

Open Graph Nedir ve Neden Önemlidir

Open Graph Protocol, Facebook’un 2010 yılında geliştirdiği bir standarttır. Amacı basit: web sayfalarını sosyal medya “grafiği”nin bir parçası haline getirmek. Bir URL paylaşıldığında platform, sayfanın bölümündeki og: önekli meta etiketlere bakıyor ve bu bilgilerle bir önizleme kartı oluşturuyor.

WordPress bu etiketleri varsayılan olarak eklemez. Yoast, RankMath gibi eklentiler bunu yapabilir ama her sitenin bir SEO eklentisine ihtiyacı olmayabilir. Üstelik kendi kontrolünüzde olan kod, eklentiye bağımlılıktan çok daha sağlıklı.

En kritik Open Graph etiketleri şunlar:

  • og:title: Paylaşım kartında görünecek başlık
  • og:description: Açıklama metni
  • og:image: Önizleme görseli (en az 1200×630 piksel önerilir)
  • og:url: Kanonik sayfa URL’si
  • og:type: Sayfa türü (website, article, product)
  • og:site_name: Site adı
  • og:locale: Dil/bölge bilgisi

functions.php’ye Kod Eklemeden Önce

Direkt olarak temanızın functions.php dosyasına yazmak yerine bir child tema kullanın. Ana temanız güncellendiğinde tüm değişiklikleriniz gider. Child tema yoksa en azından bir site-specific plugin oluşturun.

Kodu şuraya ekleyebilirsiniz:

  • Child temanın functions.php dosyası
  • /wp-content/plugins/ altında kendi oluşturduğunuz özel bir eklenti
  • wp-config.php ile aynı dizinde wp-content/mu-plugins/ klasörü

Biz örneklerimizde functions.php üzerinden anlatacağız ama mantık aynı.

Temel Open Graph Fonksiyonu

İlk olarak en basit haliyle tüm sayfalar için çalışan bir fonksiyon yazalım. Bu fonksiyon WordPress’in wp_head action hook’una bağlanarak bölümüne meta etiketleri ekleyecek.

<?php
function custom_open_graph_tags() {
    global $post;

    // Admin panelinde çalıştırma
    if ( is_admin() ) {
        return;
    }

    // Varsayılan değerler
    $og_title       = get_bloginfo( 'name' );
    $og_description = get_bloginfo( 'description' );
    $og_url         = home_url( '/' );
    $og_image       = ''; // Varsayılan görseli buraya ekleyebilirsiniz
    $og_type        = 'website';
    $og_site_name   = get_bloginfo( 'name' );
    $og_locale      = get_locale();

    // Tekil yazı/sayfa ise
    if ( is_singular() && isset( $post ) ) {
        $og_title       = get_the_title( $post->ID );
        $og_description = has_excerpt( $post->ID )
                          ? get_the_excerpt()
                          : wp_trim_words( get_the_content(), 55, '...' );
        $og_url         = get_permalink( $post->ID );
        $og_type        = 'article';

        // Öne çıkan görsel
        if ( has_post_thumbnail( $post->ID ) ) {
            $thumbnail = wp_get_attachment_image_src(
                get_post_thumbnail_id( $post->ID ),
                'large'
            );
            $og_image = $thumbnail[0];
        }
    }

    // Açıklamayı temizle
    $og_description = wp_strip_all_tags( $og_description );
    $og_description = esc_attr( $og_description );

    ?>
    <!-- Open Graph Meta Tags -->
    <meta property="og:title" content="<?php echo esc_attr( $og_title ); ?>" />
    <meta property="og:description" content="<?php echo $og_description; ?>" />
    <meta property="og:url" content="<?php echo esc_url( $og_url ); ?>" />
    <meta property="og:type" content="<?php echo esc_attr( $og_type ); ?>" />
    <meta property="og:site_name" content="<?php echo esc_attr( $og_site_name ); ?>" />
    <meta property="og:locale" content="<?php echo esc_attr( $og_locale ); ?>" />
    <?php if ( ! empty( $og_image ) ) : ?>
    <meta property="og:image" content="<?php echo esc_url( $og_image ); ?>" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <?php endif; ?>
    <!-- /Open Graph Meta Tags -->
    <?php
}
add_action( 'wp_head', 'custom_open_graph_tags', 1 );

Hook önceliğini 1 olarak veriyoruz çünkü bazı temalar kendi meta etiketleri ekleyebilir, biz en başa yerleşmek istiyoruz.

Varsayılan Görsel Ekleme

Her sayfanın öne çıkan görseli olmayabilir. Ana sayfa, arşiv sayfaları, kategori sayfaları gibi yerlerde OG görseli boş kalırsa Facebook çok çirkin bir sonuç gösterir. Varsayılan bir görsel tanımlamak şart.

<?php
function get_default_og_image() {
    // Medya kütüphanesinden bir resim ID'si kullanabilirsiniz
    // Ya da direkt URL
    $default_image = get_template_directory_uri() . '/assets/images/og-default.jpg';

    // Özelleştirilmiş logo varsa onu da kullanabilirsiniz
    $custom_logo_id = get_theme_mod( 'custom_logo' );
    if ( $custom_logo_id ) {
        $logo_data = wp_get_attachment_image_src( $custom_logo_id, 'full' );
        if ( $logo_data ) {
            return $logo_data[0];
        }
    }

    return $default_image;
}

function get_og_image_for_current_page() {
    global $post;

    // Tekil sayfalarda öne çıkan görsel
    if ( is_singular() && isset( $post ) ) {
        if ( has_post_thumbnail( $post->ID ) ) {
            $img = wp_get_attachment_image_src(
                get_post_thumbnail_id( $post->ID ),
                'og-image' // Özel görsel boyutu (aşağıda tanımlanıyor)
            );
            if ( $img ) {
                return $img[0];
            }
        }
    }

    // Kategori sayfalarında kategori resmi
    if ( is_category() ) {
        $cat_id  = get_queried_object_id();
        $cat_img = get_term_meta( $cat_id, 'category_image', true );
        if ( $cat_img ) {
            return wp_get_attachment_url( $cat_img );
        }
    }

    // Hiçbiri yoksa varsayılan
    return get_default_og_image();
}

Özel OG Görsel Boyutu Tanımlama

Facebook 1200×630 piksel önerir. WordPress’e bu boyutu öğretelim ki görseller otomatik bu boyuta kırpılsın.

<?php
function register_og_image_size() {
    // OG görsel boyutu: 1200x630, hard crop açık
    add_image_size( 'og-image', 1200, 630, true );

    // Twitter Card için ayrı boyut (isteğe bağlı)
    add_image_size( 'twitter-card', 1200, 600, true );
}
add_action( 'after_setup_theme', 'register_og_image_size' );

Bu kodu ekledikten sonra mevcut resimlerinizi yeniden oluşturmanız gerekir. Bunun için WP CLI veya “Regenerate Thumbnails” eklentisini kullanabilirsiniz.

WP CLI ile yeniden boyutlandırmak için:

wp media regenerate --yes

Sadece belirli bir boyutu yeniden oluşturmak için:

wp eval 'foreach(get_posts(["numberposts"=>-1,"post_type"=>"any"]) as $p) { $id = get_post_thumbnail_id($p->ID); if($id) wp_update_attachment_metadata($id, wp_generate_attachment_metadata($id, get_attached_file($id))); }'

WooCommerce Ürünleri İçin OG Etiketleri

WooCommerce ürünleri farklı bir yapıya sahip. og:type değerinin product olması, ürün fiyatı ve stok bilgisinin eklenmesi gerekiyor. Facebook ve bazı platformlar bu ekstra bilgileri kullanıyor.

<?php
function woo_product_open_graph_tags() {
    if ( ! function_exists( 'is_product' ) || ! is_product() ) {
        return;
    }

    global $post;
    $product = wc_get_product( $post->ID );

    if ( ! $product ) {
        return;
    }

    // Ürün başlığı
    $og_title = $product->get_name();

    // Kısa açıklama varsa onu kullan, yoksa tam açıklamayı kırp
    $short_desc = $product->get_short_description();
    $og_description = ! empty( $short_desc )
                      ? wp_strip_all_tags( $short_desc )
                      : wp_trim_words( wp_strip_all_tags( $product->get_description() ), 55, '...' );

    // Ürün URL
    $og_url = get_permalink( $post->ID );

    // Ürün görseli
    $og_image = '';
    $image_id = $product->get_image_id();
    if ( $image_id ) {
        $img_data = wp_get_attachment_image_src( $image_id, 'og-image' );
        $og_image = $img_data ? $img_data[0] : '';
    }

    // Fiyat bilgisi
    $price    = $product->get_price();
    $currency = get_woocommerce_currency();

    // Stok durumu
    $availability = $product->is_in_stock() ? 'instock' : 'oos';

    ?>
    <!-- WooCommerce Product Open Graph -->
    <meta property="og:type" content="product" />
    <meta property="og:title" content="<?php echo esc_attr( $og_title ); ?>" />
    <meta property="og:description" content="<?php echo esc_attr( $og_description ); ?>" />
    <meta property="og:url" content="<?php echo esc_url( $og_url ); ?>" />
    <?php if ( ! empty( $og_image ) ) : ?>
    <meta property="og:image" content="<?php echo esc_url( $og_image ); ?>" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:image:alt" content="<?php echo esc_attr( $og_title ); ?>" />
    <?php endif; ?>
    <meta property="product:price:amount" content="<?php echo esc_attr( $price ); ?>" />
    <meta property="product:price:currency" content="<?php echo esc_attr( $currency ); ?>" />
    <meta property="product:availability" content="<?php echo esc_attr( $availability ); ?>" />
    <!-- /WooCommerce Product Open Graph -->
    <?php
}
add_action( 'wp_head', 'woo_product_open_graph_tags', 2 );

Bu hook’u 2 önceliğiyle ekliyoruz ki temel OG fonksiyonundan sonra çalışsın ve ürün sayfalarında gerekli etiketleri override etsin.

Twitter Card Etiketleri de Ekleyelim

Open Graph etiketleri Twitter/X’te de kısmen çalışır ama Twitter’ın kendi Twitter Card standartı var. İkisini birlikte eklemek iyi pratik.

<?php
function custom_twitter_card_tags() {
    global $post;

    if ( is_admin() ) {
        return;
    }

    $card_type   = 'summary_large_image';
    $title       = get_bloginfo( 'name' );
    $description = get_bloginfo( 'description' );
    $image       = get_default_og_image();

    // Twitter kullanıcı adınız (@ olmadan)
    $twitter_site = '@sitenizinadi';

    if ( is_singular() && isset( $post ) ) {
        $title       = get_the_title( $post->ID );
        $description = has_excerpt( $post->ID )
                       ? get_the_excerpt()
                       : wp_trim_words( get_the_content(), 55, '...' );

        if ( has_post_thumbnail( $post->ID ) ) {
            $img   = wp_get_attachment_image_src(
                get_post_thumbnail_id( $post->ID ),
                'og-image'
            );
            $image = $img ? $img[0] : $image;
        }
    }

    $description = esc_attr( wp_strip_all_tags( $description ) );

    ?>
    <!-- Twitter Card Meta Tags -->
    <meta name="twitter:card" content="<?php echo esc_attr( $card_type ); ?>" />
    <meta name="twitter:site" content="<?php echo esc_attr( $twitter_site ); ?>" />
    <meta name="twitter:title" content="<?php echo esc_attr( $title ); ?>" />
    <meta name="twitter:description" content="<?php echo $description; ?>" />
    <?php if ( ! empty( $image ) ) : ?>
    <meta name="twitter:image" content="<?php echo esc_url( $image ); ?>" />
    <?php endif; ?>
    <!-- /Twitter Card Meta Tags -->
    <?php
}
add_action( 'wp_head', 'custom_twitter_card_tags', 3 );

Özel OG Meta Alanı: Post Bazında Override

Bazen belirli bir yazı için farklı bir OG başlığı veya görseli kullanmak isteyebilirsiniz. Bunun için post meta alanı ekleyelim. Bu alan WordPress edit ekranında görünür ve oradan elle doldurulabilir.

<?php
// Meta box ekle
function og_custom_meta_box() {
    add_meta_box(
        'og_custom_fields',
        'Open Graph Özel Ayarlar',
        'og_custom_meta_box_callback',
        array( 'post', 'page', 'product' ),
        'normal',
        'default'
    );
}
add_action( 'add_meta_boxes', 'og_custom_meta_box' );

// Meta box içeriği
function og_custom_meta_box_callback( $post ) {
    wp_nonce_field( 'og_custom_nonce', 'og_custom_nonce_field' );

    $og_title = get_post_meta( $post->ID, '_og_custom_title', true );
    $og_desc  = get_post_meta( $post->ID, '_og_custom_description', true );
    $og_image = get_post_meta( $post->ID, '_og_custom_image', true );

    ?>
    <p>
        <label for="og_custom_title"><strong>OG Başlık (boş bırakılırsa yazı başlığı kullanılır):</strong></label><br>
        <input type="text" id="og_custom_title" name="og_custom_title"
               value="<?php echo esc_attr( $og_title ); ?>"
               style="width:100%; margin-top:5px;" />
    </p>
    <p>
        <label for="og_custom_description"><strong>OG Açıklama:</strong></label><br>
        <textarea id="og_custom_description" name="og_custom_description"
                  rows="3" style="width:100%; margin-top:5px;"><?php echo esc_textarea( $og_desc ); ?></textarea>
    </p>
    <p>
        <label for="og_custom_image"><strong>OG Görsel URL'si (boş bırakılırsa öne çıkan görsel kullanılır):</strong></label><br>
        <input type="url" id="og_custom_image" name="og_custom_image"
               value="<?php echo esc_url( $og_image ); ?>"
               style="width:100%; margin-top:5px;" />
    </p>
    <?php
}

// Meta box kaydet
function og_save_custom_meta( $post_id ) {
    if ( ! isset( $_POST['og_custom_nonce_field'] ) ) {
        return;
    }

    if ( ! wp_verify_nonce( $_POST['og_custom_nonce_field'], 'og_custom_nonce' ) ) {
        return;
    }

    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
        return;
    }

    if ( ! current_user_can( 'edit_post', $post_id ) ) {
        return;
    }

    $fields = array(
        '_og_custom_title'       => 'og_custom_title',
        '_og_custom_description' => 'og_custom_description',
        '_og_custom_image'       => 'og_custom_image',
    );

    foreach ( $fields as $meta_key => $post_key ) {
        if ( isset( $_POST[ $post_key ] ) ) {
            update_post_meta(
                $post_id,
                $meta_key,
                sanitize_text_field( $_POST[ $post_key ] )
            );
        }
    }
}
add_action( 'save_post', 'og_save_custom_meta' );

Şimdi bu özel alanları ana OG fonksiyonumuza entegre edelim:

<?php
function get_og_data_for_post( $post_id ) {
    $data = array();

    // Özel alanları kontrol et
    $custom_title = get_post_meta( $post_id, '_og_custom_title', true );
    $custom_desc  = get_post_meta( $post_id, '_og_custom_description', true );
    $custom_image = get_post_meta( $post_id, '_og_custom_image', true );

    // Başlık: özel alan > yazı başlığı
    $data['title'] = ! empty( $custom_title )
                     ? $custom_title
                     : get_the_title( $post_id );

    // Açıklama: özel alan > özet > içerik özeti
    if ( ! empty( $custom_desc ) ) {
        $data['description'] = $custom_desc;
    } elseif ( has_excerpt( $post_id ) ) {
        $data['description'] = get_post_field( 'post_excerpt', $post_id );
    } else {
        $content = get_post_field( 'post_content', $post_id );
        $data['description'] = wp_trim_words( wp_strip_all_tags( $content ), 55, '...' );
    }

    // Görsel: özel alan > öne çıkan görsel > varsayılan
    if ( ! empty( $custom_image ) ) {
        $data['image'] = $custom_image;
    } elseif ( has_post_thumbnail( $post_id ) ) {
        $img = wp_get_attachment_image_src(
            get_post_thumbnail_id( $post_id ),
            'og-image'
        );
        $data['image'] = $img ? $img[0] : get_default_og_image();
    } else {
        $data['image'] = get_default_og_image();
    }

    return $data;
}

Tüm Bileşenleri Bir Araya Getiren Final Fonksiyon

Şimdiye kadar yazdığımız parçaları temiz bir yapıda birleştiriyoruz. Gerçek dünyada kullanacağınız şekli bu.

<?php
/**
 * Ana Open Graph Meta Tag Fonksiyonu
 * Child tema functions.php veya özel eklentiye ekleyin
 */
function site_open_graph_meta_tags() {
    global $post;

    if ( is_admin() || is_feed() ) {
        return;
    }

    $og = array(
        'title'       => get_bloginfo( 'name' ),
        'description' => get_bloginfo( 'description' ),
        'url'         => home_url( '/' ),
        'image'       => get_default_og_image(),
        'type'        => 'website',
        'site_name'   => get_bloginfo( 'name' ),
        'locale'      => str_replace( '_', '-', get_locale() ),
    );

    // WooCommerce ürün sayfası
    if ( function_exists( 'is_product' ) && is_product() && isset( $post ) ) {
        $product_data  = get_og_data_for_post( $post->ID );
        $og['title']   = $product_data['title'];
        $og['description'] = $product_data['description'];
        $og['image']   = $product_data['image'];
        $og['url']     = get_permalink( $post->ID );
        $og['type']    = 'product';
    }
    // Tekil yazı veya sayfa
    elseif ( is_singular() && isset( $post ) ) {
        $post_data     = get_og_data_for_post( $post->ID );
        $og['title']   = $post_data['title'];
        $og['description'] = $post_data['description'];
        $og['image']   = $post_data['image'];
        $og['url']     = get_permalink( $post->ID );
        $og['type']    = is_page() ? 'website' : 'article';
    }
    // Kategori / Etiket sayfası
    elseif ( is_category() || is_tag() || is_tax() ) {
        $term = get_queried_object();
        if ( $term ) {
            $og['title']   = $term->name . ' - ' . get_bloginfo( 'name' );
            $og['description'] = ! empty( $term->description )
                                 ? wp_strip_all_tags( $term->description )
                                 : get_bloginfo( 'description' );
            $og['url'] = get_term_link( $term );
        }
    }
    // Yazar arşivi
    elseif ( is_author() ) {
        $author = get_queried_object();
        if ( $author ) {
            $og['title']   = $author->display_name . ' - ' . get_bloginfo( 'name' );
            $og['description'] = get_the_author_meta( 'description', $author->ID ) ?: get_bloginfo( 'description' );
            $og['url']     = get_author_posts_url( $author->ID );
        }
    }
    // Arama sayfası
    elseif ( is_search() ) {
        $og['title']   = '"' . get_search_query() . '" Arama Sonuçları - ' . get_bloginfo( 'name' );
        $og['url']     = get_search_link();
        $og['type']    = 'website';
    }

    // Güvenli çıktı için temizleme
    $og['description'] = esc_attr( wp_strip_all_tags( $og['description'] ) );
    $og['title']       = esc_attr( wp_strip_all_tags( $og['title'] ) );

    // Açıklamayı 200 karakterle sınırla
    if ( mb_strlen( $og['description'] ) > 200 ) {
        $og['description'] = mb_substr( $og['description'], 0, 197 ) . '...';
    }

    echo "n<!-- Open Graph Meta Tags -->n";
    echo '<meta property="og:title" content="' . $og['title'] . '" />' . "n";
    echo '<meta property="og:description" content="' . $og['description'] . '" />' . "n";
    echo '<meta property="og:url" content="' . esc_url( $og['url'] ) . '" />' . "n";
    echo '<meta property="og:type" content="' . esc_attr( $og['type'] ) . '" />' . "n";
    echo '<meta property="og:site_name" content="' . esc_attr( $og['site_name'] ) . '" />' . "n";
    echo '<meta property="og:locale" content="' . esc_attr( $og['locale'] ) . '" />' . "n";

    if ( ! empty( $og['image'] ) ) {
        echo '<meta property="og:image" content="' . esc_url( $og['image'] ) . '" />' . "n";
        echo '<meta property="og:image:type" content="image/jpeg" />' . "n";
        echo '<meta property="og:image:width" content="1200" />' . "n";
        echo '<meta property="og:image:height" content="630" />' . "n";
        echo '<meta property="og:image:alt" content="' . $og['title'] . '" />' . "n";
    }

    // Makale türü için ek etiketler
    if ( $og['type'] === 'article' && isset( $post ) ) {
        echo '<meta property="article:published_time" content="' . get_the_date( 'c', $post->ID ) . '" />' . "n";
        echo '<meta property="article:modified_time" content="' . get_the_modified_date( 'c', $post->ID ) . '" />' . "n";

        $categories = get_the_category( $post->ID );
        if ( ! empty( $categories ) ) {
            echo '<meta property="article:section" content="' . esc_attr( $categories[0]->name ) . '" />' . "n";
        }
    }

    echo "<!-- /Open Graph Meta Tags -->nn";
}
add_action( 'wp_head', 'site_open_graph_meta_tags', 1 );

Yoast veya RankMath ile Çakışmayı Önleme

Sitenizde bu eklentiler kuruluysa OG etiketleri zaten ekleniyor olabilir. Çift etiket oluşmasını önlemek için kontrol ekleyin:

<?php
function should_add_custom_og_tags() {
    // Yoast SEO aktifse kendi OG'sini kullanmasına izin ver
    if ( defined( 'WPSEO_VERSION' ) && get_option( 'wpseo_social' ) ) {
        $wpseo_social = get_option( 'wpseo_social' );
        if ( ! empty( $wpseo_social['opengraph'] ) ) {
            return false;
        }
    }

    // RankMath aktifse
    if ( class_exists( 'RankMath' ) ) {
        return false;
    }

    return true;
}

// Yukarıdaki fonksiyonu şu şekilde kullanın:
function site_open_graph_meta_tags_safe() {
    if ( ! should_add_custom_og_tags() ) {
        return;
    }
    site_open_graph_meta_tags();
}
// Önceki add_action satırını bununla değiştirin:
// add_action( 'wp_head', 'site_open_graph_meta_tags_safe', 1 );

Test Etme ve Hata Ayıklama

Kodu ekledikten sonra mutlaka test edin.

Facebook Sharing Debugger: developers.facebook.com/tools/debug/ adresine gidin, sitenizin URL’sini girin. Facebook önbelleği temizleyip en güncel etiketleri çekecek. Orada hangi etiketlerin okunduğunu, hangi görselin kullanıldığını ve varsa hataları görürsünüz.

LinkedIn Post Inspector: linkedin.com/post-inspector/ adresinde de benzer şekilde test edebilirsiniz.

Twitter Card Validator: cards-dev.twitter.com/validator artık eskisi gibi çalışmıyor ama Twitter Web’de URL paylaşınca önizlemeyi doğrudan görebilirsiniz.

WP CLI ile mevcut durumu hızlıca kontrol etmek için:

# Belirli bir sayfanın head içeriğini çek ve og: etiketlerini filtrele
curl -s "https://siteniz.com/ornek-yazi/" | grep -i "og:"

# Daha okunabilir çıktı için
curl -s "https://siteniz.com/" | grep 'property="og:' | sed 's/^ *//'

Sık Karşılaşılan Sorunlar

Görsel çıkmıyor: Görselin HTTP değil HTTPS URL’si olduğundan emin olun. Facebook HTTPS olmayan görsel URL’lerini reddediyor.

Eski önizleme çıkıyor: Facebook agresif önbellekleme yapıyor. Debugger aracında “Scrape Again” butonuna basın.

Görsel boyutu hatası: 1200×630’dan küçük görseller bazen kabul edilmiyor. Minimum 600×315 piksel gerekli, önerilen 1200×630.

Açıklama çok uzun: Facebook 200 karakteri aşan açıklamaları kesiyor. Biz zaten 200 karakter sınırı koyduk.

Türkçe karakter sorunu: og:locale değerini tr_TR yerine tr-TR formatında da deneyebilirsiniz. Bazı platformlar tire ile çalışıyor.

Sonuç

Open Graph meta etiketleri, sosyal medyada sitenizin nasıl göründüğünü doğrudan etkiliyor. Yanlış veya eksik etiketler yüzünden paylaşımlar çirkin görünüyor, tıklama oranları düşüyor. Bu yazıda anlattığımız yaklaşımla eklenti bağımlılığı olmadan, tamamen kontrol sizde olacak şekilde bu sorunu çözebilirsiniz.

En kritik nokta: her zaman test edin. Kod yazdıktan sonra Facebook Debugger’a gidin, gerçek sonucu görün. Özellikle görsel URL’sinin doğru ve erişilebilir olduğundan, açıklamanın temiz olduğundan emin olun. WooCommerce mağazanız varsa ürün sayfalarını ayrıca test etmeyi unutmayın çünkü ürün türü için ek meta alanlar gerekiyor.

Bu kodları child temaya veya özel bir mu-plugin’e ekleyin, ana temaya direkt yazmayın. Böylece tema güncellemelerinde kodunuz kaybolmaz ve uzun vadede yönetmesi kolay bir yapıya sahip olursunuz.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir