WordPress’te Göreceli Tarihler Nasıl Görüntülenir (2 Yöntem)

Uzun yıllar WordPress siteleri çalıştırdıktan sonra, küçük değişikliklerin büyük farklar yaratabileceğini öğrendik. Bu küçük ama önemli ayrıntılardan biri de yazılarınızda tarihi nasıl gösterdiğinizdir.

Çoğu blog genellikle bir yazının yayınlandığı tam tarihi gösterir. Ancak ‘2 gün önce’ veya ‘Dün’ gibi göreceli tarihler kullanmak okuyucular için daha iyi olabilir. Bu tarihler insanlara içeriğinizin ne kadar yeni ve alakalı olduğunu hızlı bir şekilde anlatır, bu da onların içeriği okuma olasılığını artırabilir.

Sorun şu ki, çoğu WordPress teması varsayılan olarak tarihleri bu şekilde göstermez. Ama endişelenmeyin! WordPress sitenizde göreli tarihleri göstermenin 2 kolay yolunu bulduk: biri bir eklenti kullanarak, diğeri ise bazı basit kodlar kullanarak.

Neden Mutlak/Tam Tarihler Yerine Göreceli Tarihler Görüntüleniyor?

Facebook veya Twitter gibi sosyal medya platformlarının gönderi tarihlerini tam tarihler yerine ‘2 saat önce’ veya ‘3 gün önce’ olarak gösterdiğini hiç fark ettiniz mi? Buna göreceli tarih formatı denir.

Mutlak tarihlerin aksine (’21 Ağustos 2024′ gibi), WordPress’teki göreli tarihler okuyucularınıza içeriğinizin ne kadar taze olduğuna dair hızlı bir fikir verir.

Bir örneğe bakalım. Ziyaretçiler belirli bir tarih yerine ‘2 gün önce’ tarihli bir gönderi gördüklerinde, bunun yeni bir içerik olduğunu anında anlarlar. Bu şekilde okuyucular, bugünün tarihini düşünmek veya zihinsel hesaplama yapmak zorunda kalmadan hangi gönderilerin yeni ve incelemeye değer olduğunu hızlı bir şekilde anlayabilir.

Ancak, göreli tarihlerin her tür web sitesi için uygun olmadığını belirtmek gerekir.

Örneğin, tarihi bir blog veya kesin tarihlerin çok önemli olduğu bir site işletiyorsanız, mutlak tarihlere bağlı kalmak daha iyi olabilir. Önemli olan, WordPress sitenize göreli tarihler ekleyip eklemeyeceğinize karar verirken içerik türünüzü ve kitle tercihlerinizi göz önünde bulundurmaktır.

Tüm bunlarla birlikte, WordPress’te göreli tarihler eklemenin 2 yoluna bir göz atalım. İşlemi sizin için kolaylaştıran bir eklenti bulduk, ancak daha fazla kontrol sunan bir kod yöntemi de bulduk. Tercih ettiğiniz yönteme geçmek için aşağıdaki hızlı bağlantıları kullanabilirsiniz:

Yöntem 1: Meks Time Ago Eklentisini Kullanma (Ücretsiz Ama Sınırlı)

WordPress’te göreceli zamanları ve tarihleri görüntülemek için basit bir eklenti arıyorsanız, sizin için harika bir seçimimiz var. Denediğimiz tüm göreceli tarih eklentileri arasında Meks Time Ago yeni başlayanlar için en kolay olanlardan biri. Ayrıca, ücretsizdir ve hem klasik hem de blok temalarla çalışır.

Meks Time Ago’yu kullanmak için WordPress eklentisini yönetici alanınıza yükleyebilir ve etkinleştirebilirsiniz.

Bundan sonra, kontrol panelinizdeki Ayarlar ” Genel bölümüne gidin. Aşağı kaydırın ve Meks Time Ago’nun eklenti ayarlarını bulacaksınız.

Etkinleştirmeniz gereken ilk ayar, ‘time ago’ biçiminin nereye uygulanacağıdır. Burada, ‘Tarih’ ve ‘Saat’i seçmeniz gerekir.

Bu tarih biçiminin belirli bir dakika, saat, gün ve ay sayısından daha eski olmayan gönderilere uygulanıp uygulanmayacağını da seçebilirsiniz.

Biz 12 ayla devam etmeye karar verdik.

Ardından, tarih biçiminde ‘önce’ kelimesinin nereye yerleştirileceğini değiştirebilirsiniz.

Çoğu kişi bu ifadeye aşina olduğu için ilgili tarihten sonra tutmayı tercih ettik.

Son olarak, gerekirse ‘ago’ kelimesini farklı bir terimle değiştirebilirsiniz. Boş da bırakabilirsiniz.

Bunu yaptıktan sonra ‘Değişiklikleri Kaydet’e tıklayın.

İşte bu kadar! Artık tüm gönderi tarihleriniz göreceli tarihlere sahip olacak. Her şeyin doğru görünüp görünmediğini görmek için değişikliklerinizi mobil, masaüstü ve tablette görüntüleyebilirsiniz.

İşte bir örnek:

Meks Time Ago ile ilgili sevmediğimiz bir şey, gönderi bugün veya dün yayınlanmış olsa bile, eklentinin yayınlanma tarihini ‘X dakika önce’ veya ‘X saat önce’ olarak göstermesidir.

Bazı insanlar bu formatı önemsemez, ancak bazıları da tarihin ‘Bugün’ veya ‘Dün’ olarak görüntülenmesini isteyebilir. Eğer tercihiniz bu yöndeyse, bir sonraki yöntemi uygulayabilirsiniz.

Yöntem 2: Özel Kod Kullanma (Özelleştirilebilir Ancak Biraz Gelişmiş)

Bu yöntem özel kod içerir ve daha önce açıkladığımız gibi, tarihleri ‘X dakika önce’ veya ‘X saat önce’ yerine ‘Bugün’ veya ‘Dün’ olarak göstermek istiyorsanız daha iyi bir seçimdir.

Ama gözünüz korkmasın! Süreç boyunca size adım adım yol göstereceğiz. Ayrıca, web sitenizi bozmadan özel kod eklemeyi güvenli ve kolay hale getiren WPCode adlı bir kod parçacığı eklentisi kullanacağız.

WPCode incelememizde eklenti hakkında daha fazla bilgi edinebilirsiniz.

İlk olarak, WordPress eklentisini yönetici alanınıza yükleyin ve etkinleştirin.

Bundan sonra, Kod Parçacıkları ” + Parçacık Ekle’ye gitmeniz gerekir. Ardından, ‘Özel Kodunuzu Ekleyin (Yeni Snippet)’ seçeneğini seçin ve ‘+ Özel Snippet Ekle’ düğmesine tıklayın.

Şimdi, yeni özel kodunuza bir ad verin. ‘Zamanla Biçimlendirilmiş Göreceli Tarih’ gibi basit bir şey olabilir.

Ayrıca, Kod Türünü ‘PHP Snippet’ olarak değiştirin.

Bu işlem tamamlandıktan sonra, aşağıdaki kod parçacığını kopyalayıp Kod Önizleme kutusuna yapıştırın:

/**
 * Converts a timestamp into a human-readable relative date string.
 *
 * @param int $timestamp The timestamp to convert
 * @return string The human-readable relative date string
 */
function human_readable_relative_date( $timestamp ) {
    $time_difference = time() - $timest  // Calculate the time difference between now and the timestamp
    $seconds_in_a_day = 86400;  // Number of seconds in a day


    if ( $time_difference < 0 ) {
        return 'Date is in the future';  // Handle future dates
    } elseif ( $time_difference < $seconds_in_a_day ) {
        return 'Today at ' . date( 'H:i', $timestamp );  // Handle same-day dates
    } elseif ( $time_difference < 2 * $seconds_in_a_day ) {
        return 'Yesterday at ' . date( 'H:i', $timestamp );  // Handle one-day-old dates
    } elseif ( $time_difference < 7 * $seconds_in_a_day ) {
        $days = floor( $time_difference / $seconds_in_a_day );  // Calculate full days ago
        return $days . ($days == 1 ? ' day' : ' days') . ' ago at ' . date( 'H:i', $timestamp );  // Handle dates within the last week
    } elseif ( $time_difference < 30 * $seconds_in_a_day ) {
        $weeks = floor( $time_difference / ( 7 * $seconds_in_a_day ) );  // Calculate full weeks ago
        return $weeks . ($weeks == 1 ? ' week' : ' weeks') . ' ago at ' . date( 'H:i', $timestamp );  // Handle dates within the last month
    } elseif ( $time_difference < 365 * $seconds_in_a_day ) {
        $months = floor( $time_difference / ( 30 * $seconds_in_a_day ) );  // Calculate full months ago
        return $months . ($months == 1 ? ' month' : ' months') . ' ago at ' . date( 'H:i', $timestamp );  // Handle dates within the last year
    } else {
        $years = floor( $time_difference / ( 365 * $seconds_in_a_day ) );  // Calculate full years ago
        return $years . ($years == 1 ? ' year' : ' years') . ' ago at ' . date( 'H:i', $timestamp );  // Handle dates older than a year
    }
}


/**
 * Shortcode function to convert a given timestamp or date to a human-readable relative date string.
 *
 * @param array $atts Shortcode attributes
 * @return string The human-readable relative date string
 */
function relative_date_shortcode( $atts ) {
    $attributes = shortcode_atts(
        array(
            'timestamp' => '',  // Default value for 'timestamp' attribute
            'date' => '',       // Default value for 'date' attribute
        ),
        $atts
    );


    // If no timestamp or date attribute provided, use the post's published date
    if ( empty($attributes['timestamp']) && empty($attributes['date']) ) {
        global $post;
        if ( !is_null($post) ) {
            $attributes['timestamp'] = get_the_time('U', $post->ID);  // Get the post's timestamp
        }
    } elseif ( !empty($attributes['date']) ) {
        $attributes['timestamp'] = strtotime($attributes['date']);  // Convert 'date' attribute to timestamp
    }
    
    // Validate the timestamp
    if ( !empty($attributes['timestamp']) && is_numeric($attributes['timestamp']) ) {
        return human_readable_relative_date( $attributes['timestamp'] );  // Return the human-readable relative date
    } else {
        return 'Invalid timestamp or date';  // Return an error message if the timestamp is invalid
    }
}
add_shortcode( 'relative_date', 'relative_date_shortcode' );  // Register the shortcode

İlk işlev olan human_readable_relative_date, bir tarihi alır ve kullanıcı dostu bir biçime dönüştürür.

Örneğin, ‘Bugün saat 14:30’ veya ‘3 gün önce saat 10:15’i’ gösterebilir. Bu, okuyucularınızın bir gönderinin ne kadar eski olduğunu anlamasını kolaylaştırır.

İkinci işlev olan relative_date_shortcode, WordPress’te kullanabileceğiniz bir kısa kod oluşturur. Bu kısa kod, tema dosyalarınızı değiştirmeden içeriğinize kolayca göreli tarihler eklemenizi sağlar.

Bu kodu kullanarak gönderi tarihlerinizi daha kullanıcı dostu hale getirebilirsiniz. Okuyucular içeriğinizin ne kadar yeni olduğunu hızlı bir şekilde görecek ve bu da sitenizin daha güncel ve ilgi çekici hissetmesini sağlayacaktır.

Ardından, ‘Ekleme’ bölümüne ilerleyin. Ardından, Ekleme Yöntemi için ‘Otomatik Ekleme’ ve Konum için ‘Yalnızca Ön Uç’ seçeneklerini belirleyin.

Sağ üst köşedeki ‘Etkin Değil’ geçişini ‘Etkin’ olarak değiştirin ve ‘Snippet’i Kaydet’ düğmesine tıklayın.

Kodunuz etkinken, WordPress blogunuzda göreli tarihleri nasıl etkinleştirebileceğinizi görelim. İşlem, kullandığınız tema türüne göre farklılık gösterecektir.

Blok Temalarına Göreceli Tarih Formatı Nasıl Eklenir

Bir blok tema kullanıyorsanız, kısa kodu ‘Post Meta’ şablon bölümünüze ekleyebilirsiniz.

Bu şablon bölümü, blog yazılarınız hakkında yazar, kategori ve yayınlanma tarihi gibi bilgileri görüntülemekten sorumludur.

İlk olarak, tam site düzenleyicisini açmak için Görünüm ” Düzen leyici’ye gidin.

Şimdi blok temanızı özelleştirmek için çeşitli seçenekler göreceksiniz.

Burada, ‘Desenler’e tıklayın.

Bir sonraki sayfada, temanızın sahip olduğu tüm kalıpları ve şablon parçalarını göreceksiniz.

‘Meta Gönder’ seçeneğini seçmeniz yeterlidir.

Şimdi Meta Sonrası şablon bölümünü görmelisiniz.

Öncelikle, kısa kodumuzla değiştirebilmemiz için mevcut Tarih bloğunu silmeniz gerekir.

Bunu yapmak için Tarih bloğuna tıklayabilirsiniz.

Üzerine tıklamak zor geliyorsa, üstteki ‘Liste Görünümü’ düğmesine tıklayabilir ve ‘Tarih’ bloğunu seçebilirsiniz. Ardından, üç noktalı menüye tıklayın ve ‘Sil’i seçin.

Tarih bloğu silindikten sonra, devam edin ve ‘Kısa Kod’ bloğunu Yazı Metanıza ekleyin.

Bunu, sayfanın herhangi bir yerindeki ‘+’ düğmesine tıklayarak ve Kısa Kod bloğunu oraya sürükleyip bırakarak yapabilirsiniz.

Bundan sonra, aşağıdaki kısa kodu bloğa yazın:

[relative_date]

Bu işlem tamamlandıktan sonra ‘Kaydet’e tıklayın.

Artık tek gönderi şablonunuz göreli tarihleri kullanacaktır.

İşte demo sitemizde nasıl göründüğü:

Klasik Temalarda Göreceli Tarih Formatı Nasıl Eklenir

WordPress klasik temalarında göreli tarih ekleme işlemi biraz daha farklı ve tekniktir. Bunun nedeni her klasik temanın farklı konfigürasyonlara sahip olmasıdır.

Ama biraz sabırlı olun. İster ücretsiz ister premium bir WordPress teması kullanıyor olun, kendi başınıza nasıl yapacağınızı kolayca anlayabilmeniz için size bir örnek vereceğiz.

Klasik tema dosyalarınızı ilk kez özelleştiriyorsanız, bunu bir hazırlama sitesinde veya WordPress sitenizin yerel bir sürümünde yapmanızı öneririz. Bu şekilde, kodun düzenlenmesinden kaynaklanan beklenmedik hatalar canlı web sitenizi etkilemeyecektir.

Yapmanız gereken ilk adım, gönderi meta verilerinizi görüntülemekten sorumlu olan tema dosyasını bulmaktır. Bu olabilir:

• Tekli gönderi dosyanız (genellikle single.php olarak adlandırılır)
• Yazı içeriğinizi görüntüleyen şablon kısmı (content.php gibi bir şey)
• Yazı bilgilerini görüntülemek için işlevler içeren şablon etiketleri dosyanız (genellikle template-tags.php olarak adlandırılır)

Genel bir kural olarak, yazı tarihini görüntüleyen kod satırlarını aramalısınız. Bu satırlar genellikle the_date(), the_time(), get_the_date ( ) , get_the_time ( ), get_the_modified_date ( ) veya get_the_modified_time() gibi WordPress işlevlerini çağırır.

Yardıma ihtiyacınız varsa, basit bir eklenti kullanarak hangi WordPress tema dosyalarının düzenleneceğini nasıl bulacağınıza dair adım adım bir kılavuzumuz var. Alternatif olarak, daha fazla yardım almak için WordPress tema geliştiricinizle iletişime geçebilir veya belgelerine göz atabilirsiniz.

Bizim durumumuzda, gönderi tarihini görüntülemekten sorumlu dosya template-tags.php’dir. İşte temanın tam yayınlanma tarihini göstermek için kullandığı orijinal kodun tamamı:

if ( ! function_exists( 'twentysixteen_entry_date' ) ) :
	/**
	 * Prints HTML with date information for current post.
	 *
	 * Create your own twentysixteen_entry_date() function to override in a child theme.
	 *
	 * @since Twenty Sixteen 1.0
	 */
	function twentysixteen_entry_date() {
		$time_string = '<time class="entry-date published updated" datetime="%1$s">%2$s</time>';

		if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) {
			$time_string = '<time class="entry-date published" datetime="%1$s">%2$s</time><time class="updated" datetime="%3$s">%4$s</time>';
		}

		$time_string = sprintf(
			$time_string,
			esc_attr( get_the_date( 'c' ) ),
			get_the_date(),
			esc_attr( get_the_modified_date( 'c' ) ),
			get_the_modified_date()
		);

		printf(
			'<span class="posted-on"><span class="screen-reader-text">%1$s </span><a href="%2$s" rel="bookmark">%3$s</a></span>',
			/* translators: Hidden accessibility text. */
			_x( 'Posted on', 'Used before publish date.', 'twentysixteen' ),
			esc_url( get_permalink() ),
			$time_string
		);
	}
endif;

Dosyanın kendisini düzenlemek için dosyayı FTP veya WordPress barındırma sağlayıcınızın dosya yöneticisi aracılığıyla açabilirsiniz.

Bluehost kullanıcısıysanız, web barındırma hesabınıza giriş yaparak dosya yöneticisini kullanabilirsiniz. Ardından, kontrol panelinde ‘Web Siteleri’ sekmesine tıklayın ve özelleştirmeye çalıştığınız site için ‘Ayarlar’ı seçin.

Bu, sitenizin ayarlar sayfasını açacaktır.

‘Gelişmiş’ sekmesine geçin ve Dosya Yöneticisi bölümündeki ‘Yönet’ düğmesine tıklayın.

Şimdi Bluehost dosya yöneticisinde olmalısınız.

Dosyamızın adı template-tags.php olduğu için public_html ” wp-content ” theme-name ” inc bölümüne gitmemiz gerekiyordu.

Şimdi aralarından seçim yapabileceğiniz birkaç dosya göreceksiniz.

Burada, devam edin ve template-tags.php dosyasını seçin. Dosyaya sağ tıklayın ve ‘Düzenle’yi seçin.

Şimdi, yayınlanma tarihini görüntülemekten sorumlu olan kodu bulun.

Bunu yapmak için CTRL / Command ve F tuşlarını kullanabilirsiniz.

Şimdi, bu kodu daha önce WPCode kullanarak eklediğimiz human_readable_relative_date fonksiyonunu çağıracak şekilde düzenlemeniz gerekecektir.

Orijinal kodu if ( ! function_exists( 'twentysixteen_entry_date' ) ) : ' den endif; ' e nasıl değiştirdiğimiz aşağıda açıklanmıştır:

if ( ! function_exists( 'twentysixteen_entry_date' ) ) :
	/**
	 * Prints HTML with date information for current post.
	 *
	 * Create your own twentysixteen_entry_date() function to override in a child theme.
	 *
	 * @since Twenty Sixteen 1.0
	 */
	function twentysixteen_entry_date() {
		// Get the post's published timestamp
		$published_timestamp = get_the_time('U');


		// Generate the human-readable relative date
		$relative_date = human_readable_relative_date( $published_timestamp );


		// Output the relative date
		printf(
			'<span class="posted-on"><span class="screen-reader-text">%1$s </span><a href="%2$s" rel="bookmark">%3$s</a></span>',
			/* translators: Hidden accessibility text. */
			_x( 'Posted on', 'Used before publish date.', 'twentysixteen' ),
			esc_url( get_permalink() ),
			$relative_date
		);
	}
endif;

Kodu değiştirdikten sonra, ‘Değişiklikleri Kaydet’ düğmesine tıklayın.

Kodunuz çalışmıyorsa ve bu konuda tamamen acemiyseniz, kodunuzda neyin yanlış olduğunu bulmak için OpenAI’nin ChatGPT’si gibi bir AI aracı kullanmanızı öneririz.

Şöyle basit bir soru sorabilirsiniz: ‘Merhaba, aşağıdaki kodu kullanarak X yapmaya çalışıyorum [kodunuzu buraya yapıştırın], ancak çalışmıyor. Sorunun ne olduğunu anlamama yardımcı olabilir misiniz?

Bununla birlikte, kodunuz çalışıyorsa, tekli gönderi şablonunuzda görmeniz gereken şey budur:

WordPress Blogunuzu Özelleştirmek için Bonus İpuçları

WordPress yazılarınıza göreli tarihler eklemek dışında blogunuzu özelleştirebileceğiniz birçok yol vardır. İşte bazı fikirler:

• WordPress’te Kategorileri Farklı Şekillendirme
• WordPress Yazılarınıza İlerleme Çubuğu Ekleme
• WordPress Yazı Küçük Resimleri için Varsayılan Yedek Resim Nasıl Ayarlanır
• Her WordPress Gönderisine Farklı Stil Verme
• WordPress Yazılarına Okuma İlerleme Çubuğu Ekleme
• WordPress’te Geri Dönen Ziyaretçiler için Yeni Yazılar Nasıl Vurgulanır?
• WordPress’te Breadcrumb Navigasyon Bağlantıları Nasıl Görüntülenir?

Umarız bu makale WordPress’te göreli tarihlerin nasıl görüntüleneceğini öğrenmenize yardımcı olmuştur. Ayrıca WordPress için en iyi sürükle ve bırak sayfa oluşturuculara ilişkin uzman seçimlerimize ve bir WordPress web sitesinin nasıl düzenleneceğine ilişkin nihai kılavuzumuza göz atmak isteyebilirsiniz.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.