WordPress'te Bağlantı Rengini Değiştirme (Başlangıç Rehberi)

‘WordPress’ta bağlantı rengini nasıl değiştiririm?’ Bu, WPBeginner okuyucularımızdan düzenli olarak duyduğumuz bir sorudur.

Küçük bir ayrıntı gibi görünse de, bağlantı renkleri web sitenizin kullanılabilirliği ve dönüşüm oranları açısından önemli bir rol oynar. Bu nedenle WPBeginner'da bağlantılar için turuncu rengini kullanıyoruz.

İyi haber şu ki, WordPress'te bağlantı renklerini değiştirmek eskisine göre çok daha kolay hale geldi. CSS uzmanı olmanıza veya bir geliştirici kiralamanıza gerek yok – artık teknik becerilerinden bağımsız olarak herkesin kullanabileceği basit çözümler var.

Bu kılavuzda, WordPress'te bağlantı renklerinizi değiştirmenin tam adımlarını size adım adım göstereceğiz.

WordPress'te Bağlantı Rengini Neden Değiştirmelisiniz?

WordPress'te bağlantı renklerini değiştirmenin ana nedenleri, marka kimliğinize uyum sağlamak ve içeriğinizin okunabilirliğini artırmaktır. Bu renkleri özelleştirerek, ziyaretçilerinizin dikkatini sayfanızın en önemli bölümlerine yönlendirirsiniz.

Bağlantı renklerinizi özelleştirmenin birkaç özel faydası şunlardır:

• Daha İyi Erişilebilirlik: Yeterli renk kontrastı kullanmak, özellikle görme engelli ziyaretçiler için bağlantıların okunmasını ve tanımlanmasını kolaylaştırır. Genel bir kural olarak, WCAG yönergeleri normal boyutlu metinler için en az 4,5:1 kontrast oranı önerir. Yeni bir bağlantı rengi seçmeden önce, okunmasının kolay olduğundan emin olmak için WebAIM Contrast Checker ile test edebilirsiniz.
• Marka Tutarlılığı: Profesyonel bir görünüm için bağlantılarınızı logonuzla ve genel renk şemanızla uyumlu hale getirebilirsiniz.
• Daha Yüksek Tıklama Oranları: Bağlantılar için belirgin bir renk kullanmak (düğmeler veya harekete geçirici mesajlar gibi) ziyaretçileri tıklamaya teşvik eder ve dönüşümleri artırır.

Bununla birlikte, WordPress web sitenizde bağlantı rengini nasıl değiştireceğinize bakalım. Tercih ettiğiniz yönteme doğrudan atlamak için aşağıdaki hızlı bağlantıları kullanın:

WordPress Klasik Temalarda Bağlantı Rengi Nasıl Değiştirilir

Bazı klasik WordPress temaları, bağlantı renklerini değiştirmek için yerleşik ayarlara sahiptir. Kontrol etmek için Görünüm » Özelleştir'e gidin ve Renkler, Yazı Tipi veya benzeri bir bölüm arayın.

Astra, GeneratePress ve OceanWP gibi popüler temalar genellikle bu ayarlarda bağlantı rengi denetimleri içerir.

Özel bir ‘Bağlantı Rengi’ seçeneği görmüyorsanız, ‘Vurgu Rengi’ veya ‘Birincil Renk’ seçeneğini arayın, çünkü bu ayarlar genellikle web sitenizdeki bağlantı renklerini kontrol eder.

Örneğin, Sydney temasında bu seçenekler ‘Renkler’ bölümü altında bulunur.

Ardından, bağlantı renklerini değiştirmenize olanak tanıyan bir ayar bulun.

Sydney, hem varsayılan hem de üzerine gelme durumları için 'Bağlantı Rengi' seçenekleriyle bunu basit hale getirir.

Bağlantı üzerine gelme rengi, bir ziyaretçi bir bağlantının üzerine fareyle geldiğinde görünen renktir, bu nedenle dikkatlerini çekmek ve tıklama oranınızı artırmak için harika bir yoldur.

Ardından değişikliklerinizi kaydetmek için ‘Yayınla’yı tıklayabilirsiniz.

Bazı temaların doğrudan bağlantı rengi ayarlarının olmadığını unutmayın. Bunun yerine, bağlantı rengi temanızın genel birincil veya ikincil renklerine bağlı olabilir.

Temanız doğrudan bağlantı rengi özelleştirmesi sunmuyorsa endişelenmeyin! Kodu kullanarak bağlantı renginizi nasıl değiştireceğinizi göstereceğimiz dördüncü yönteme gidebilirsiniz.

WordPress Blok Temalarında Bağlantı Rengi Nasıl Değiştirilir

Eğer bir blok teması kullanıyorsanız, bağlantı renklerinizi özelleştirmek için tam site düzenleyicisini kullanmanız gerekecektir.

WordPress kontrol panelinizde Görünüm » Düzenleyici bölümüne gidin.

Sitenizin görünümünü özelleştirmek için tüm menüleri göreceksiniz.

Burada 'Stiller'e tıklayın.

Tema varsayılan stillerinizin görüntülendiğini göreceksiniz.

Özelleştirmeye başlamak için kalem simgeli ‘Düzenle’ düğmesini arayın ve tıklayın.

Tam site düzenleyici, temanızın stillerini düzenlemek için bir kenar çubuğu ile açılacaktır.

Renk özelleştirme seçeneklerine erişmek için bu kenar çubuğundaki 'Renkler'e tıklayın.

Bağlantı seçeneğini bulun ve hem varsayılan hem de üzerine gelme durumları için renk ayarlarını ortaya çıkarmak üzere tıklayın. Web sitenizin tasarımıyla eşleşen bir renk seçmelisiniz.

Ancak, arka plan ile bağlantı rengi arasında yüksek kontrast olduğundan emin olmak da önemlidir. WCAG 2.1 yönergelerine göre, metin bağlantıları arka plana karşı en az 4,5:1 kontrast oranına sahip olmalıdır.

Bağlantılarınızın görme engelli ziyaretçiler için okunabilir olduğundan emin olmak için WebAIM’in Kontrast Denetleyicisi gibi ücretsiz araçları kullanarak renk seçimlerinizi test edebilirsiniz. 

Değişikliklerinizden memnun kaldığınızda, bunları sitenizde canlı hale getirmek için ‘Kaydet’i tıklamanız yeterlidir.

Blok Düzenleyicide Bireysel Bağlantı Renklerini Değiştirme

Bazen tek tek bağlantıların rengini değiştirmek isteyebilirsiniz. Örneğin, ziyaretçinin dikkatini bir açılış sayfasındaki eylem çağrısına çekmek isteyebilirsiniz.

Bunu yapmak için, özelleştirmek istediğiniz belirli bağlantıyı vurgulamanız yeterlidir.

Ardından, araç çubuğundaki ok simgesine tıklayın ve açılır menüden 'Vurgula'yı seçin.

Ardından, 'Metin' sekmesine tıklayın. Artık o belirli bağlantının rengini seçebilirsiniz.

Bu işlem tamamlandıktan sonra, kullanmak istediğiniz rengi seçin.

Daha fazla bağlantıyı özelleştirmek için bu adımları tekrarlamanız yeterlidir.

Bağlantıların görünümünden memnun kaldığınızda, değişikliklerinizi canlı hale getirmek için 'Kaydet'e tıklayın.

WordPress'te Kodla Bağlantı Rengi Nasıl Değiştirilir (Tüm Temalar)

Temanız bağlantı renginizi değiştirme seçeneği sunmuyorsa, en kolay yol WordPress sitenize özel CSS eklemektir.

WordPress eğitimlerinde, kod parçacıklarını temanızın functions.php dosyasına ekleme talimatlarıyla sıkça karşılaşırsınız.

En büyük sorun, özel kod parçasındaki küçük bir hata bile WordPress sitenizi bozabilir ve erişilemez hale getirebilir. Ayrıca WordPress temanızı bir sonraki güncellemenizde tüm özelleştirmelerinizi kaybedeceksiniz.

İşte burada WPCode devreye giriyor. 3 milyondan fazla kurulumuyla, tema dosyalarına dokunmadan özel kod eklemesi gereken WordPress yeni başlayanları için özel olarak tasarlanmıştır.

Bu, tek bir yazım hatasıyla sitenizi bozma veya tema güncellemeleri sırasında özelleştirmeleri kaybetme riskini ortadan kaldırır.

Kapsamlı testlerden sonra, özel kodu web sitenize eklemenin en güvenli ve en kolay yolu olduğu sonucuna vardık. Ayrıntılar için WPCode incelememize bakın.

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

Etkinleştirdikten sonra Kod Parçacıkları » Parçacık Ekle'ye gidin.

Burada, farenizi ‘Özel Kodunuzu Ekleyin (Yeni Kod Parçası).’ üzerine getirin.

Ardından, göründüğünde ‘+ Özel Kod Parçacığı Ekle’ düğmesine tıklayın.

Ardından, ekranda görüntülenen seçenekler listesinden kod türü olarak 'CSS Snippet'i seçmeniz gerekir.

Ardından, özel kod parçacığı için bir başlık girin. Bu, kod parçacığını WordPress kontrol panelinde tanımlamanıza yardımcı olacak herhangi bir şey olabilir.

Artık kod kutusuna özel bir CSS parçacığı ekleyebilirsiniz. Kullanabileceğiniz farklı parçacıklardan bazılarına bakalım.

WordPress Sitenizdeki Bağlantı Rengini Değiştirin

Başlamak için, genel bağlantı rengini özelleştirmek isteyebilirsiniz. Bu, ziyaretçilerin bir bağlantıya tıklamadan önce göreceği renktir.

Web sitenizdeki içeriğin tamamında bağlantı renklerini değiştirmek için bu CSS kod parçacığını kullanın:

a {
     color: #FFA500;
}

Not: Bu CSS kodu, tüm web siteniz için bağlantı rengini değiştirir. Bu, gezinme menülerini, düğmeleri ve altbilgi bağlantılarını içerir.

Yukarıdaki örnekte, # ondalık kodu bağlantı rengini turuncuya değiştirecektir, bu nedenle #FFA500'ü kullanmak istediğiniz renkle değiştirmeniz gerekecektir.

Hangi onaltılık kodu kullanacağınızdan emin değilseniz, HTML Renk Kodları web sitesinde farklı renkleri keşfedebilir ve kodlarını alabilirsiniz. Alternatif olarak, mükemmel tonu bulmak için Google’ın renk seçicisi gibi ücretsiz bir çevrimiçi araç kullanabilirsiniz.

Kodunuzun görünümünden memnun kaldığınızda, ‘Etkin Değil’ geçiş düğmesine tıklayarak ‘Etkin’ olarak görünmesini sağlayın. Son olarak, CSS kod parçasını canlı hale getirmek için ‘Kod Parçasını Kaydet’e tıklayın.

Şimdi, WordPress web sitenizi ziyaret ederseniz, yeni bağlantı renginin etkili olduğunu göreceksiniz.

WordPress'te Ziyaret Edildikten Sonra Bağlantı Rengini Değiştirme

Bağlantı fareyle üzerine gelme rengini değiştirmek için aşağıdaki parçacığı WPCode'un düzenleyicisine yapıştırmanız yeterlidir:

a:hover {
     color: #FF0000;
     text-decoration: underline;
}

Yukarıdaki kod, ziyaretçiler üzerine geldiğinde bağlantı rengini kırmızıya çevirecek ve metni altını çizecektir. Daha önce olduğu gibi, kullanmak istediğiniz herhangi bir renge değiştirmek için #FF0000 onaltılık kodunu değiştirebilirsiniz.

Canlıya geçmeye hazır olduğunuzda, yukarıda açıklanan aynı işlemi izleyerek kod parçasını yayınlayabilirsiniz.

WordPress'te Ziyaret Edildikten Sonra Bağlantı Rengini Değiştirme

Ardından, bir kullanıcı bağlantıya tıkladıktan sonra bağlantı rengini değiştirmek isteyebilirsiniz. Bu, hangi bağlantıları zaten tıkladıklarını göstererek ziyaretçilerin WordPress blogunuzda yolunu bulmalarına yardımcı olabilir.

Ziyaret edilen bağlantı rengini değiştirmek için aşağıdaki CSS kodunu kullanabilirsiniz:

a:visited {
     color: #0000FF;
}

Her zaman olduğu gibi, mavi #0000FF onaltılık kodunu bağlantılarınızda kullanmak istediğiniz renkle değiştirdiğinizden emin olun.

Bu işlem bittikten sonra, ‘Etkin Değil’ geçiş düğmesine tıklayarak ‘Etkin’ durumuna getirin. Ardından, kodu sitenizde, blogunuzda veya çevrimiçi mağazanızda canlı hale getirmek için ‘Kod Parçacığını Kaydet’e tıklayın.

WordPress’te Belirli Sayfalar İçin Bağlantı Renklerini Değiştirme

Bağlantı renklerini yalnızca belirli sayfalarda (örneğin, bir açılış sayfası veya iletişim sayfası) değiştirmek istiyorsanız, sayfa başına özel CSS seçicileri kullanabilirsiniz.

Her WordPress sayfasının .page-id-123 gibi benzersiz bir gövde sınıfı vardır. Bu CSS’yi kullanarak o belirli sayfadaki bağlantıları hedefleyebilirsiniz:

.page-id-123 .entry-content a {
     color: #FF6600;
}

Sayfanızın kimliğini (sayfa düzenleyici URL'sinde bulabilirsiniz) gerçek sayfa kimliğinizle 123 değiştirin.

Alternatif olarak, WPCode Pro kullanıyorsanız, özel seçicilere gerek kalmadan CSS kod parçacıklarını yalnızca belirli sayfalara uygulamak için koşullu mantık özelliğini kullanabilirsiniz.

Bir Web Sitesinde Bağlantılar İçin En İyi Renk Nedir?

En iyi bağlantı rengi markanıza ve web sitesi tasarımınıza bağlıdır, ancak izlenecek kanıtlanmış en iyi uygulamalar vardır:

• Mavi standarttır: Çoğu kullanıcı, varsayılan web kuralı olduğu için bağlantıların mavi (#0000FF veya benzer tonlar) olmasını bekler. Mavi bağlantılar anında tanınabilir.
• Yüksek kontrast esastır: Erişilebilirlik (WCAG AA uyumluluğu) için bağlantı renginiz arka plana karşı en az 4,5:1 kontrast oranına sahip olmalıdır.
• Kırmızı ve yeşilden kaçının: Bu renkler renk körlüğü olan kullanıcılar (erkeklerin yaklaşık %8'ini ve kadınların %0,5'ini etkiler) için ayırt edilmesi zor olabilir.
• Altını çizin: Bağlantıların altını çizmek (özellikle üzerine gelindiğinde) görme engelli kullanıcılara yardımcı olur ve genel kullanılabilirliği artırır.
• Markanızla eşleştirin: Markanız belirli bir renk paleti kullanıyorsa, yeterli kontrastı korurken uyumlu bir bağlantı rengi seçin.

WPBeginner'da, markamızla eşleştiği ve beyaz arka planımıza karşı net bir şekilde öne çıktığı için bağlantılar için turuncu (#FFA500) kullanıyoruz.

Video Eğitim

Yazılı talimatları takip etmekten hoşlanmıyorsanız, bunun yerine video eğitimimize göz atabilirsiniz:

WordPress'te Bağlantı Rengini Değiştirme Hakkında Sıkça Sorulan Sorular

Web sitemizde bağlantı renklerini değiştirmekle ilgili okuyucularımızın sıkça sorduğu bazı sorular şunlardır:

Bir köprünün rengini değiştirebilir miyim?

Evet, çoğu WordPress teması, Görünüm ayarları veya Site Düzenleyici aracılığıyla köprü renklerini küresel olarak değiştirmenize olanak tanır. Ayrıca, bağlantıyı vurgulayıp araç çubuğundan bir renk seçerek gönderi düzenleyicisinin içinde tek tek bağlantıların rengini değiştirebilirsiniz.

WordPress'te bir bağlantı nasıl özelleştirilir?

Bağlantıyı blok düzenleyicide seçip araç çubuğu seçeneklerini kullanarak özelleştirebilirsiniz. Bu, hedef URL'yi değiştirmenize, yeni sekmede açılmasını sağlamanıza veya sağ kenar çubuğundaki renk ve stil ayarlarını yapmanıza olanak tanır.

URL bağlantımı nasıl özelleştiririm?

URL'nin kendisinin metnini (slug) değiştirmek için, sağ kenar çubuğundaki 'Gönderi' ayarlarına gidin ve 'URL' bölümünü arayın. Bağlantının yazı tipi veya rengi gibi görsel olarak nasıl göründüğünü değiştirmek istiyorsanız, blok düzenleyicideki 'Stil' ayarlarını kullanın.

Daha fazla ayrıntı için, WordPress site URL'lerinizi nasıl değiştireceğiniz hakkındaki eğitimimize bakın.

WordPress'te bağlantıları nasıl değiştiririm?

İçerik düzenleyicisindeki mevcut bağlantı metnine tıklamanız ve kayan araç çubuğundaki 'Düzenle' (kalem simgesi) düğmesini seçmeniz yeterlidir. Oradan, yeni bir URL yapıştırabilir veya ziyaretçilerinize göstermek istediğiniz metni değiştirebilirsiniz.

Sayfa bağlantımı nasıl değiştirebilirim?

Sayfa bağlantısını, ‘URL’ bölümü altındaki Sayfa ayarları kenar çubuğunda kalıcı bağlantı bölümünü düzenleyerek değiştirebilirsiniz. Sayfa zaten yayınlanmışsa, eski bağlantıyı kullanan ziyaretçilerin doğru yeni sayfaya yönlendirilmesi için 301 yönlendirmesi ayarlamanızı öneririz.

Bir web sitesinde bağlantılar için en iyi renk nedir?

Mavi en tanınabilir bağlantı rengidir, ancak en iyi seçim markanıza ve tasarımınıza bağlıdır. Erişilebilirlik için 4,5:1 kontrast oranını sağlayın, renk körü kullanıcılar için kırmızı/yeşilden kaçının ve netlik için üzerine gelindiğinde altını çizin. Okunabilirliği korurken marka renklerinizle eşleştirin.

WordPress'te bağlantı simgesi nasıl değiştirilir?

WordPress'in bağlantı simgeleri eklemek veya değiştirmek için varsayılan bir ayarı yoktur, bu nedenle genellikle bir eklenti kullanmanız gerekir. External Links gibi eklentiler, giden bağlantılara otomatik olarak simgeler ekleyebilir veya FontAwesome ve özel CSS kullanarak simgeleri manuel olarak ekleyebilirsiniz.

Umarız bu makale, WordPress'te bağlantı rengini nasıl değiştireceğinizi öğrenmenize yardımcı olmuştur. Ayrıca WordPress'te metin renginin nasıl değiştirileceği hakkındaki kılavuzumuza veya en etkili WordPress tasarım öğeleri hakkındaki nihai kılavuzumuza da bakmak isteyebilirsiniz.

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.