WordPress’te bağlantı rengini nasıl değiştireceğinizi öğrenmek ister misiniz?
Bağlantı rengini değiştirmek, ziyaretçilerin web sitenizde yollarını bulmalarını kolaylaştırabilir. Benzersiz bir renk şeması oluşturmak da sitenizin öne çıkmasına yardımcı olabilir.
Bu makalede, WordPress’te bağlantı rengini nasıl değiştireceğinizi adım adım göstereceğiz.
WordPress’te Bağlantı Rengi Neden Değiştirilir?
WordPress’te bir bağlantı eklediğinizde, temanız bu bağlantının rengini otomatik olarak belirleyecektir. Bazen WordPress temanızın varsayılan renkleri tam olarak istediğiniz gibi olabilir, ancak bağlantıların nasıl görüneceği üzerinde daha fazla kontrole ihtiyacınız olabilir.
Örneğin, bağlantı rengini markanızla veya özel logonuzla eşleşecek şekilde değiştirmek isteyebilirsiniz. Ya da sitenizi sınırlı görüşe sahip okuyucular için daha erişilebilir hale getirmek için renk kontrastını artırmak isteyebilirsiniz.
Bazı temalarda bağlantı rengini tema seçenekleri panelinden veya WordPress tema özelleştiricisinden değiştirebilirsiniz, bu nedenle önce bu yerleri kontrol ettiğinizden emin olun. Ayrıca temanızın belgelerine de bakmanızda fayda var.
Bununla birlikte, hangi temayı kullanıyor olursanız olun WordPress web sitenizdeki bağlantı rengini nasıl değiştireceğinizi görelim. Kullanmak istediğiniz yönteme doğrudan atlamak için aşağıdaki hızlı bağlantıları kullanmanız yeterlidir:
Video Eğitimi
Yazılı talimatları tercih ediyorsanız, okumaya devam edin.
Yöntem 1: Tek Tek Bağlantıların Rengini Değiştirin
Bazen tek tek bağlantıların rengini değiştirmek isteyebilirsiniz. Örneğin, ziyaretçinin dikkatini bir açılış sayfasındaki harekete geçirici mesaja çekmek isteyebilirsiniz.
Bunu yapmak için, özelleştirmek istediğiniz bağlantıyı vurgulamanız yeterlidir. Ardından, mini araç çubuğundaki ok simgesine tıklayın ve ‘Vurgula’yı seçin.
Şimdi yapmak istediğiniz değişikliğe bağlı olarak ‘Arka Plan’ veya ‘Metin’i seçebilirsiniz.
Bunu yaptıktan sonra, devam edin ve kullanmak istediğiniz rengi seçin.
Daha fazla bağlantı özelleştirmek için bu adımları tekrarlamanız yeterlidir.
Bağlantıların nasıl göründüğünden memnun olduğunuzda, değişikliklerinizi canlı hale getirmek için ‘Güncelle’ veya ‘Yayınla’ya tıklayın.
Yöntem 2: WPCode Kullanarak WordPress’te Bağlantı Rengini Değiştirin (Önerilen)
Bağlantı rengini değiştirmenin en kolay yolu WordPress sitenize özel CSS eklemektir.
Genellikle, WordPress eğitimlerinde temanızın functions.php dosyasına eklemeniz için talimatlar içeren kod parçacıkları bulacaksınız.
En büyük sorun, özel kod parçacığındaki küçük bir hatanın bile WordPress sitenizi bozabilmesi ve erişilemez hale getirebilmesidir. Ayrıca WordPress temanızı bir sonraki güncellemenizde tüm özelleştirmelerinizi kaybedersiniz.
İşte burada WPCode devreye giriyor.
Bu ücretsiz eklenti, sitenizi riske atmadan özel CSS eklemeyi kolaylaştırır.
Yapmanız gereken ilk şey ücretsiz WPCode eklentisini yüklemek ve etkinleştirmektir. Daha fazla ayrıntı için WordPress eklentisi yükleme hakkındaki adım adım kılavuzumuza bakın.
Etkinleştirmenin ardından Kod Parçacıkları ” Parçacık Ekle‘ye gidin.
Burada, farenizi ‘Özel Kodunuzu Ekleyin’ seçeneğinin üzerine getirmeniz yeterlidir.
Göründüğünde, ‘Snippet kullan’ seçeneğine tıklayın.
Başlamak için, özel kod parçacığı için bir başlık yazın. Bu, parçacığı WordPress kontrol panelinde tanımlamanıza yardımcı olacak herhangi bir şey olabilir.
Bundan sonra, ‘Kod Türü’ açılır menüsünü açın ve ‘CSS Snippet’i seçin.
Şimdi devam edebilir ve kod kutusuna özel bir CSS parçacığı ekleyebilirsiniz. Kullanabileceğiniz farklı parçacıklardan bazılarına göz atalım.
WordPress Web Sitenizdeki Bağlantı Rengini Değiştirin
Başlangıç olarak, genel bağlantı rengini özelleştirmek isteyebilirsiniz. Bu, ziyaretçilerin bir bağlantıya tıklamadan önce görecekleri renktir.
Bunu yapmak için, aşağıdaki kod parçacığını WPCode kod kutusuna eklemeniz yeterlidir:
a {
color: #FFA500;
}
Yukarıdaki örnekte, # onaltılık kodu bağlantı rengini turuncu olarak değiştirecektir, bu nedenle#FFA500
öğesini kullanmak istediğiniz renkle değiştirmeniz gerekecektir.
Hangi hex kodunu kullanacağınızdan emin değilseniz, HTML Renk Kodları web sitesinde farklı renkleri keşfedebilir ve kodlarını alabilirsiniz.
Bu arada, bir bağlantı rengi seçmek için yardıma ihtiyacınız varsa, lütfen mükemmel bir renk şemasının nasıl seçileceğine ilişkin kılavuzumuza bakın.
Kodunuzun nasıl göründüğünden memnun olduğunuzda, ‘Etkin Değil’ geçişine tıklayarak bunun yerine ‘Etkin’i gösterin. Son olarak, CSS snippet’ini canlı hale getirmek için ‘Snippet’i Kaydet’e tıklayın.
Şimdi, WordPress web sitenizi ziyaret ederseniz, yeni bağlantı rengini iş başında göreceksiniz.
WordPress’te Bağlantı Hover Rengini Değiştirme
Bir diğer seçenek de bağlantı fareyle üzerine gelme rengini değiştirmektir. Bu, bir ziyaretçi faresini bir bağlantının üzerine getirdiğinde görünen renktir, bu nedenle dikkatlerini çekmek ve tıklama oranınızı artırmak için harika bir yoldur.
Bu değişikliği yapmak için aşağıdaki parçacığı WPCode editörüne yapıştırmanız yeterlidir:
a:hover {
color: #FF0000;
text-decoration: underline;
}
Yukarıdaki kod bağlantı rengini kırmızıya çevirecek ve ziyaretçiler üzerine geldiğinde metnin altını çizecektir. Daha önce olduğu gibi, #FF0000
hex kodunu kullanmak istediğiniz herhangi bir renkle değiştirebilirsiniz.
Canlı yayına geçmeye hazır olduğunuzda, yukarıda açıklanan aynı süreci izleyerek kod parçacığını yayınlayabilirsiniz.
WordPress’te Ziyaret Sonrası 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, ziyaretçilerin daha önce hangi bağlantılara tıkladıklarını göstererek WordPress blogunuzda yollarını 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 #0000FFhex
kodunu bağlantılarınızda kullanmak istediğiniz renkle değiştirdiğinizden emin olun.
Bu işlem tamamlandıktan sonra, ‘Etkin Değil’ geçişine tıklayarak ‘Etkin’ olarak değişmesini sağlayın. Ardından, kodu sitenizde, blogunuzda veya çevrimiçi mağazanızda canlı hale getirmek için ‘Snippet’i Kaydet’e tıklayın.
WordPress’te Gezinti Bağlantılarınızın Rengini Değiştirin
Son olarak, navigasyon menünüzdeki bağlantıları da özelleştirmek isteyebilirsiniz.
Daha fazla ayrıntı için WordPress gezinti menülerinin nasıl şekillendirileceğine ilişkin kılavuzumuza bakın.
Yöntem 3: CSS’yi Düzenlemeden Bağlantı Rengini Değiştirin
CSS kodunu doğrudan web sitenize eklemek yerine, sitenizi görsel olarak düzenlemek için bir CSS stil eklentisi kullanabilirsiniz.
CSS Hero eklentisini kullanmanızı öneririz. Çok acemi dostudur ve sürükle ve bırak sayfa oluşturucuya benzer şekilde web sitenizi görsel olarak özelleştirmenizi sağlar.
Eklentiyi kurduktan sonra, etkinleştirmek ve hesabınızı bağlamak için ‘Ürün Etkinleştirmeye Devam Et’ düğmesine tıklayın.
Bu sizi kullanıcı adınızı ve şifrenizi girebileceğiniz bir ekrana götürecektir.
Ardından, hesabınızı doğrulamak için ekrandaki talimatları izleyin. Bundan sonra CSS Hero sizi otomatik olarak WordPress kontrol paneline geri götürecektir.
Ardından, WordPress yönetici araç çubuğunun üst kısmındaki ‘CSS Hero ile Özelleştir’ düğmesine tıklayın.
Bu, web sitenizi üzerinde CSS Hero çalışırken açacaktır.
CSS Hero Ne Görürsen Onu Alırsın (WYSIWYG) düzenleyicisini kullanır. Bu, herhangi bir içeriğe tıklayarak o içeriği özelleştirmenizi sağlayan bir araç çubuğu açabileceğiniz anlamına gelir.
Başlamak için, düzenlemek istediğiniz bağlantının bir örneğine tıklayın. Bu kılavuzda blog yazısı bağlantılarını özelleştireceğiz.
Bir bağlantı seçtikten sonra, ‘Tipografi’ menü öğesine tıklayın ve bağlantılarınız için yeni bir renk seçin.
Listeden bir renk seçebilir veya hex kodu ekleyebilirsiniz.
WordPress Gezinti Menünüzün Rengini Değiştirin
Ardından, bağlantı rengini değiştirerek özel bir gezinme menüsü oluşturmak için CSS Hero’yu kullanabilirsiniz.
Gezinti menünüzün üzerine gelin ve menü öğelerinden herhangi birine tıklayın.
Ardından, ‘Tipografi’ seçeneğini seçin.
Şimdi bunun yerine kullanmak istediğiniz rengi seçebilirsiniz.
Bağlantı renklerini değiştirmeyi tamamladıktan sonra, değişikliklerinizi canlı hale getirmek için ‘Kaydet ve Yayınla’ düğmesine tıklamanız yeterlidir.
Umarız bu makale WordPress’te bağlantı rengini nasıl değiştireceğinizi öğrenmenize yardımcı olmuştur. WordPress’te metin renginin nasıl değiştirileceğine ilişkin kılavuzumuzu veya göz atmanız gereken en iyi WordPress tasarım örneklerinden oluşan uzman seçimimizi de görmek 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.
Syed Balkhi
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Chris
The code was able to change the link colours in the side bar but not the links in the article. How do I change the colour of the link in the article?
WPBeginner Support
The code if for all links, if it only changes the link color for you in one spot it means that your specific theme has more specific CSS rules than the code then it would override our CSS. To find the CSS affecting your content we would recommend using Inspect Element following our guide below!
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Yönetici
Abdul Rehman Asad
Thanks for sharing this.
WPBeginner Support
You’re welcome!
Yönetici
Shaun Mendonsa
Very useful article and just what I needed.
WPBeginner Support
Glad our article was helpful!
Yönetici
Chloe
Thank you, this is so helpful! Is there a way you can share how to add bolded links in CSS? I’d like to make all my links bold.
WPBeginner Support
You should be able to add bold in the post editor for your links the same as you would for other text in your paragraphs without needing to edit your CSS.
Yönetici
Tom Maglienti
Great Article! When using CSS Hero to change link colors for example, if I change the color on one blog post link does it change all links on the site the same way inserting the CSS code directly does?
Thanks!