Nasıl Doğru Kullanılır?

Yayınlanan: 2023-03-14


Bağlantı bağlantıları, yalnızca web sitesi sayfaları ve gönderilerindeki kullanıcı deneyimini iyileştirmekle kalmaz, aynı zamanda bir sayfada hızlı, etkileşimli gezinme için yararlıdır ve sonuç olarak genellikle SEO'yu artırır. Bu kılavuzda, WordPress bloklarını, HTML'yi ve eklentileri kullanarak WordPress'te bağlantı bağlantılarının nasıl ayarlanacağını öğreneceksiniz.

Ama önce, bağlantı bağlantılarıyla hazırlanmış bu içindekiler tablosunu kullanın!

İçindekiler :

Çapa bağlantısı nedir?

Bağlantı bağlantısı, kullanıcının sayfanın başka bir bölümüne gitmek için tıkladığı bir sayfa veya gönderi içinde bir köprü görevi görür.

Bu bir tür etkileşimli dahili bağlantıdır, ancak kullanıcıları sitenizdeki başka bir sayfaya göndermek yerine, mevcut sayfanın başka bir bölümüne yönlendirilirler.

Ayrıca, bağlantı bağlantıları, özellikle bir içindekiler tablosu olarak kullanıldığında, arama motorları ve kullanıcılar için bir sayfanın yapısını tanımlamaya nasıl yardımcı olduklarını görerek, SEO çabalarında güçlü bir rol oynar.

Kısacası, basit bir tıklama ziyaretçileri istedikleri içeriğe getirdiğinden, bağlantı bağlantıları kaydırmayı en aza indirir.

WordPress'teki bağlantı bağlantılarının yaygın kullanımları

Bunları web sitenize nasıl uygulayabileceğinizi daha iyi anlamak için bağlantı bağlantılarının ana kullanımlarına bir göz atın:

  • İçindekiler tablosu : sayfanın veya gönderinin belirli başlıklarına bağlantı listesi oluşturun; bir kullanıcı bir içindekiler tablosu öğesini tıkladığında, doğru başlığa yönlendirilir.
  • "Başa dön" düğmesi : genellikle bir içindekiler tablosu için bir karşı gezinme öğesi olarak uygulanır, "başa dön" bağlantısı veya düğmesi, kullanıcıyı bir sayfanın başına döndürür; özellikle uzun içeriğe sahip sayfalar için kullanışlıdır.
  • Dizinler/wikiler : bir sayfada depolanan veri veya içerik koleksiyonu genellikle gezinme bağlantıları gerektirir; bağlantı bağlantılarının bu kullanımı, içindekiler tablosuna benzer şekilde çalışır, ancak wikiler ve dizinler, içeriğe dağılmış bağlantı bağlantılarının yanı sıra gezinme için farklı biçimlere sahiptir.
  • Tek sayfalık web sitelerinde ve açılış sayfalarında gezinme menüleri : tek sayfalık bir web sitesinde, kullanıcıların hareket etmesi için hâlâ bir yola ihtiyaç vardır, bu nedenle, ziyaretçileri yeni sayfalara yönlendiren geleneksel bir menü yerine, bir bağlantı bağlantı menüsü otomatik olarak ilgili bölümlere kayar.
  • Kahraman banner'larındaki bağlantılar ve harekete geçirici mesajlar : tıklandığında kullanıcıları bir dönüşüm formuna veya ödeme modülüne gönderen bir harekete geçirici mesaj düğmesi ekleyebileceğiniz düşünülürse, bağlantı bağlantıları düğmelerin ve kahraman resimlerinin içinde iyi çalışır.
içindekiler tablosu bağlantı bağlantısı örneği
Bu içindekiler tablosu, bir ziyaretçinin kendisini aynı sayfada istedikleri bölüme gönderen bir bağlantı bağlantısını tıkladığını göstermektedir.
sizi sayfanın başına geri gönderen bir düğmeyi tıklamak
Bu "Başa dön" düğmesi, bir sayfanın en üstüne dönmek için hızlı bir yol sunar .

WordPress'te bağlantı bağlantıları nasıl oluşturulur (Blok ve Klasik Düzenleyici yöntemleri)

WordPress'e manuel olarak bağlantı bağlantıları eklemek, hem Block (Gutenberg) Düzenleyicide hem de Klasik WordPress Düzenleyicide yapılabilir. Her ikisini de kullanarak bağlantı bağlantılarını nasıl kuracağınızı size göstereceğiz.

WordPress Block (Gutenberg) Düzenleyicide bağlantı bağlantıları ekleme

WordPress'te bir sayfa veya gönderi oluşturarak başlayın. İçeriğinizle işiniz bittiğinde bağlantı bağlantılarıyla çalışmak en iyisidir.

Gönderinin başında bir içindekiler tablosu oluşturun. Bağlamayı düşündüğünüz metin bölümünü zihninize not edin; bu eğitim için, "Bow Sweep" madde işaretini bağlayacağız.

bağlantı bağlantısı eklemek için iyi olan bir metin parçası seçmek

Bağlamayı planladığınız metinle ilgili (önceden oluşturulmuş) bölüme gidin. Okuyucunun veya kendinizin kafasını karıştırmamak için bağlantınızın metnini ve başlık bağlantısını aynı tutmak en iyisidir.

  • Başlıktan önce bir imleç yerleştirin.
  • Engelle sekmesini tıklayın.
  • Gelişmiş bölümünü açmak için aşağı kaydırın.

HTML Çapa alanını bulun.

Blok sekmesini açma

Kısa ve akılda kalıcı bir HTML bağlantısı yazın. Bir HTML bağlantısında boşluk olamaz, bu nedenle tek bir kelimeye bağlı kalın veya kısa çizgiler ekleyin.

Gördüğünüz gibi, "bow-sweep" HTML çapası yaptık:

WordPress'te bir HTML bağlantı bağlantısı oluşturma
  • Bağlamayı düşündüğünüz orijinal metne geri dönün; bu durumda, içindekiler tablosundaki bir öğedir.
  • Bağlanacak metni vurgulayın.
  • Bağlantı düğmesini tıklayın.
metni vurgulama ve bağlamayı seçme

Yeni alana “ # ” ve ardından başlığa az önce eklediğiniz HTML bağlantısını yazın. Gir'i tıklayın.

HTML bağlantı bağlantılarını WordPress'e yapıştırma

Arka uçta metnin hiper bağlantılı olduğunu göreceksiniz:

az önce oluşturduğumuz WordPress'te bir bağlantı bağlantısı

Test etmek için ön uca gidin. Bağlantıya tıklamak, sayfa odağını istenen çapaya çeker; bu durumda, "Bow Sweep" başlığı.

ön uçta çalışan WordPress'teki bağlantı bağlantıları

WordPress Classic Editor'da (HTML) bağlantı bağlantıları ekleme

WordPress Classic Editor, bağlantı bağlantıları eklemek için belirli bir bloğa veya alana sahip değildir; bunun yerine Metin düzenleyicide HTML kullanırsınız. Endişelenmeyin, minimum kodlama var, sadece kopyalayıp yapıştırıyorsunuz.

  • WordPress'te bir sayfa/yazı açın.
  • Başlıklar ve bağlamayı düşündüğünüz metin (içindekiler tablosu gibi) içeren bazı içerikler oluşturun.
  • Referans için bağlamak istediğiniz metni bulun.
bağlamak istediğimiz metne bakarak
  • Bağlantı bağlantısını eklemek istediğiniz başlığa gidin.
  • Bir sonraki adımda Metin düzenleyiciye geçerken doğru noktayı hızlı bir şekilde bulmak için bu başlığı vurgulayın.
sağ başlığa bakıyorum

Metin düzenleyiciye geçin.

WordPress'teki Metin sekmesine tıklamak

Vurgulanan metni kod içinde arayın. Bazen, WordPress sizi doğrudan ona getirir. Metni vurgulamanızı önermemizin nedeni, bölümün Metin düzenleyicide vurgulanmış olarak kalması nedeniyle bulmanın daha kolay olmasıdır.

doğru başlığı bulmak

Başlık etiketini (<h1>, <h2>, <h3>…) ve arasındaki her şeyi silin.

Bu kodu aynı alana yapıştırın ("example-anchor" yerine istediğiniz şeyi ve "Example Header" yerine daha önce sahip olduğunuz üstbilgiyi yazın):

 <h2 id="example-anchor">Example Header</h2>
bağlantı kimliğine sahip başlık

Artık bağlantı HTML setine sahipsiniz.

  • Metin düzenleyici sekmesinde kalın.
  • Bağlamak istediğiniz metne gidin. Bu eğitimde, içindekiler tablosundaki "Bow Sweep" metnidir.
  • Metni vurgulayın ve silin.
bağlantı oluşturmak için metni vurgulama

İmleci aynı noktada tutarak, bu kodu yerine yapıştırın (“example-anchor” yerine önceki adımda kullandığınız çapayı koyun ve “Example Text” yerine kullanmak istediğiniz metni yazın):

 <a href="#example-anchor">Example Text</a>

Unutmayın, HTML bağlantı metninden önce bir " # " eklemeniz gerekir.

Not: Bu örnekte, HTML'de <li> etiketlerimiz var; bunlar bir liste öğesi (madde işareti) yapmak içindir, bu yüzden bunlarla uğraşmamalısınız .

WordPress HTML düzenleyicisindeki bağlantı bağlantısı

Alternatif olarak, bağlantıyı eklemek için HTML Metin düzenleyicisini atlayabilirsiniz.

Bunu yapmak için ( Metin sekmesinde bağlantı HTML'sini ayarladıktan sonra):

  • Görsel sekmesine gidin.
  • İstediğiniz metni vurgulayın.
  • Bağlantı Ekle/Düzenle'yi tıklayın.
metni vurgulama ve bağlantı ekle'ye tıklama
  • Daha önce oluşturduğunuz HTML çapasını yapıştırın veya yazın.
  • Bağlantı noktasının önüne bir “ # ” ekleyin.
  • Uygula'yı tıklayın.
bağlantı olarak bir HTML etiketi ekleme

Şimdi düzenleyicide bir bağlantı görmelisiniz:

bağlantının tamamı WordPress'te ayarlandı

Son olarak, ön uca gidin. Sizi doğru bağlantı başlığına yönlendirip yönlendirmediğini görmek için bağlantıya tıklayın.

WordPress'teki bağlantı bağlantılarına tıklamak

Bağlantı bağlantısı içindekiler tablosu nasıl otomatik eklenir?

Bağlantı bağlantıları ile bir içindekiler tablosunu manuel olarak oluşturmak zaman alıcıdır.

Daha kolay bir yol, dahil edilen tüm başlık etiketlerini kullanarak WordPress gönderileri için otomatik olarak bir içindekiler tablosu oluşturan bir eklenti kurmaktır. İçindekiler tablonuzda hangi öğelerin yer alacağı üzerinde biraz daha az kontrol vardır, ancak bu çok daha hızlı bir yöntemdir.

Bu görev için çeşitli eklentiler mevcuttur, ancak Easy Table of Contents eklentisini öneririz.

Eklenti otomatik olarak, içerikteki tüm başlıklara giden bağlantı bağlantılarına sahip bir içindekiler tablosu ekler. Ancak düzenleyicide hiçbir şey görmeyeceğinizi unutmayın; içindekileri görüntülemek için gönderiyi önizlemeli veya yayınlamalısınız.

içindekiler tablosunu ön uçta gösterme

Kolay İçindekiler Tablosu, hangi gönderi türlerinin otomatik içindekiler tablosuna izin verdiğini ayarlamanıza olanak tanır. Ayrıca, hem Klasik WordPress Düzenleyici hem de Blok (Gutenberg) Düzenleyici için herhangi bir yere bir içindekiler tablosu eklemek için [ez-toc] kısa kodunu kullanabilirsiniz.

WordPress'te içindekiler tablosu bağlantı bağlantılarını göstermek için bir kısa kod koymak

WordPress'te bağlantı bağlantıları için son ipuçları

Nasıl oluşturulacağını öğrendikten sonra, bağlantı bağlantılarına ve içindekiler tablosuna kendinizi kaptırmak kolaydır.

Bu nedenle, bağlantı bağlantılarını doğru şekilde uygulamak için ipuçlarını burada bulabilirsiniz:

  1. Yalnızca çok uzun içerik için bağlantı bağlantıları kullanın ; 200 kelimelik bir makale için bir içindekiler tablosuna sahip olduğunuzda, geliştirilmiş bir kullanıcı deneyimi amacını boşa çıkarırsınız.
  2. Bağlantı metnini kısa tutun ; amaç, kullanıcı için işleri kolaylaştırmaktır.
  3. Bağlantı metninin ve başlığın aynı ifadeler/sözcükler olduğundan emin olun ; kullanıcıların bağlantının söylediğiyle aynı şeyi görme beklentileri vardır.
  4. Bağlantı bağlantılarını sayfanın üst kısmında tutun ; bu, anında gezinme için en iyisidir.
  5. Bir "başa dön" bağlantı bağlantısı eklemeyi düşünün ; ya kullanıcıyla birlikte hareket etmeli ya da sayfanın altında oturmalıdır.
  6. Bağlantılı başlığın, bağlantı bağlantısı tıklandığında gerçekten görünür olduğundan emin olun ; başlığı bulmak için kaydırmak zorunda olmak iyi değil.
  7. İçeriği yayınlamadan önce her zaman bağlantı bağlantılarını test edin ; yanlış bir HTML biti, bozuk bir bağlantıya neden olabilir.

WordPress'te bağlantı bağlantılarını kullanmayı nasıl planlıyorsunuz? Lütfen yorumlarda bize bildirin!

ücretsiz rehber

Hızlandırmak için 5 Temel İpucu
WordPress Siteniz

Yükleme sürenizi %50-80 oranında azaltın
sadece basit ipuçlarını takip ederek.