WordPress Kenar Çubuğu Widget’larına Kısa Kodlar Nasıl Eklenir?

Kısa kodlar, web sitenize yeni özellikler ve işlevler eklemenin harika bir yoludur. Fakat bir sınırlamaları vardır: yalnızca sayfaların ve gönderilerin içeriğinde kullanılabilirler. Bu durum varsayılan kısa kodların yanı sıra özel olanlar, temalar, eklentiler veya bireysel WordPress kullanıcıları tarafından oluşturulanlar için geçerlidir. Bu soruna geçici bir çözüm bulmak için, bazı WordPress kullanıcıları temalarının, eklentilerinin ve hatta WordPress çekirdek dosyalarının şablon dosyalarını düzenlemeyi seçmiştir. Bu durum web sitelerinin alt bilgi veya üst bilgi gibi diğer bölümlerinde kısa kodlar kullanmalarına izin verir. Bu yöntem, hataya açık olmasının yanı sıra, her güncellemeden sonra değişiklikler geçersiz kılınacağından, aynı dosyaları tekrar tekrar düzenlemenizi gerektirir.

Neyse ki, buna artık gerek yok. Artık belirli widget’lara bir kısa kod çağrısı ekleyebilir ve bunları mevcut herhangi bir widget alanında (veya bazı programcıların dediği gibi WordPress kenar çubuklarında) kullanabilirsiniz. Bunu yaparak, bir kısa kodun işlevselliğini web sitenizin herhangi bir bölümüne genişletebileceksiniz. Fakat kısa kodların bu şekilde kullanılması yaygın bir bilgi olmayabileceğinden, bu makalede açıklamaya karar verdik.

Bu makale için, özel kısa kodlar hakkındaki eğitimimiz için oluşturduğumuz iki kısa kodu örnek olarak kullanacağız. İlki, geçerli tarihi gg – aa – yyyy biçiminde gösteren geçerli tarih kısa kodudur. İkincisi, metni seçtiğiniz renkte görüntüleyen renkli metin kısa kodudur. Bu makaleyle bağlantılı olduğundan, önce yukarıda bağlantısını verdiğimiz özel kısa kod öğreticisini okumanızı öneririz. Öğretici ayrıca kullanacağımız iki özel kısa kod hakkında çok daha fazla bilgi sağlamanın yanı sıra genel olarak bir kısa kod çağrısının nasıl ekleneceğini gösterecektir.

Bu iki kısa kod çok basit olsa da, uygun bir kenar çubuğu widget’ına bir kısa kod eklemeyi göstermek için kullanışlıdır.

Son olarak WordPress 5.8 güncellemesinden sonra, widget alanlarına bloklar eklemek ve Widget ekranını tamamen Gutenberg editörünü kullanarak düzenlemek mümkündür, iki tür WordPress kullanıcısı ortaya çıkmıştır. Bazıları hala Klasik Widget’lar ekranına güvenirken, diğerleri Gutenberg editörünü tamamen benimsemiş ve onu widget’ları düzenlemek için de kullanıyor. Bu yüzden makalenin ana bölümünü kasıtlı olarak, sırasıyla Klasik pencere öğelerine ve blok tabanlı pencere öğesi düzenleyici kullanıcılarına hitap edecek şekilde iki bölüme ayırdık. Bununla birlikte bu makalenin nasıl yapılır kısmına geçelim.

Blok Tabanlı Widget Düzenleyiciyi Kullanarak WordPress Kenar Çubuklarına Kısa Kodlar Nasıl Eklenir?

WordPress 5.0 güncellemesinden bu yana, Gutenberg editörü TinyMCE’yi varsayılan WordPress editörü olarak değiştirmiştir. Fakat son zamanlarda klasik Widgets ekranı da aynı değişikliğe gitti ve yerini blok tabanlı bir Widgets editörü aldı. Blok tabanlı editör, aşağıda ele alacağımız Paragraf ve Kısa Kod bloğunu kullanarak kısa kod eklemenin iki yolunu sunar.

• Paragraf Blokunu Kullanma

Paragraf bloğu, Gutenberg düzenleyicisine eklediğiniz herhangi bir metin için varsayılan blok türüdür. Paragraf bloğuna eklenen metin italik, sola hizalı gibi özelliklere sahip olabileceği gibi Transformer butonu ile alıntı veya liste haline getirilebilir. Bununla birlikte daha az bilinen şey, Gutenberg editörünü kullanarak WordPress kenar çubuklarına kısa kodlar eklemeye de hizmet edebileceğidir. Bunun nedeni, Paragraf bloğunun normal metindeki kısa kod çağrılarını tanıması ve buna göre işlemesidir. Bunu açıklayalım.

İlk olarak Görünüm > Widget’lar bölümüne gidin ve kısa kod eklemek istediğiniz widget alanını açın. Daha sonra seçilen widget alanına yeni bir blok eklemek için, ekranın sağ üst köşesindeki Widget’lar etiketinin yanındaki “+” düğmesine veya bir widget alanının altındaki eşdeğer “+” işaretine tıklayabilirsiniz. Her iki seçeneğin kullanılması, widget’ı daha sonra istediğiniz konuma sürükleyip bırakabileceğiniz seçilen widget alanının altına ekler.

Bir Paragraf bloğu eklemek için, onu mevcut bloklar listesinde bulmanız ve üzerine tıklamanız yeterlidir. Neyse ki, Paragraf bloğu oldukça kolay bir şekilde bulunabilir, fakat bulamıyorsanız arama özelliğini de kullanabilirsiniz.

Daha sonra kısa kod çağrısını buna eklemeniz ve sağ üst köşedeki “Güncelle” düğmesini tıklamanız yeterlidir.

Genel olarak konuşursak, bir kısa kod çağrısı şuna benzer bir metni temsil eder: [shortcode_name], kısa kod_adı yer tutucusu uygun şekilde değiştirilerek. Bazı durumlarda, kısa kod parametreleri de kabul edebilir, bu durumda şuna benzer bir metin eklemeniz gerekir: [shortcode_name parameter_1=’value_1′ parameter_2=’value_2′ parameter_3=’value_3′ …], kısa kodun kabul ettiği kadar çok parametre-değer çifti ile. Bu durum bazılarına çok kafa karıştırıcı gelebileceğinden, en iyi örneklerle açıklanır.

Bu makale için, özel kısa kodlarla ilgili makalemiz için oluşturduğumuz iki kısa kodu kullanmaya karar verdik: current_date kısa kodu ve renkli_metin kısa kodu. Birincisine gelince, herhangi bir parametre kabul etmediğinden, bu kısa kod için doğru çağrı yalnızca adını içerir, yani [current_date] etiket. İkincisine gelince, iki parametreyi kabul eder – başlık ve başlığın rengi. Bu yüzden bu kısa kod için doğru çağrı şu şekildedir:

[colored_text title="insert-your-title-here" title_color="insert-your-color-here"]

hem başlık hem de renk yer tutucularının doğru şekilde değiştirilmesi gereken yer.

Bununla birlikte bu makale için, önerilen kısa kod çağrılarından herhangi birini kullanmak, bir kenar çubuğu widget’ına bir kısa kod eklemeyi çok basit bir şekilde göstereceğinden, yeterli olacaktır. Bununla birlikte bu makale için, temelleri aşmanın ve bazı Gutenberg düzenleme ipuçlarını dahil etmenin en iyisi olacağını düşündük.

Her şeyden önce, yukarıda belirtilen her iki kısa kod çağrısını da dahil ettik. Bunlar tekil bir Paragraf bloğunun parçası olabilse de, aralarında bazı ek metinler olsa bile, onları ayrı Paragraf bloklarına yerleştirmenin en iyisi olacağını düşündük. Ayrıca görüntüleme amacıyla, arasına yer tutucu metin içeren ek bir Paragraf bloğu ekledik ve başlangıca bir Başlık bloğu ekledik.

Ek bir ipucu olarak, isterseniz dört ayrı bloktan oluşan bir yığının bir Grup bloğuna dönüştürülebileceğini not edeceğiz. Grup bloklarının avantajı, ek seçeneklere erişmeleri, manipüle edilmelerinin daha kolay olması ve eğer isterseniz Yeniden Kullanılabilir bloklara eklenebilmeleridir.

Örneğimize gelecek olursak dört bloğu bir Grup bloğu haline getirmek için hepsini seçip üstlerinde çıkan Grup ikonuna basmanız ve alt menüden “Grup” seçeneğini seçmeniz gerekecektir. Elbette, önceki işlem(ler)inizi kaydetmek için ekranınızın sağ üst köşesindeki “Güncelle” düğmesine tıkladığınızdan emin olun.

Bunu açıkladıktan sonra, geriye kalan tek şey sonucu ön uçta test etmektir. Bizimki aşağıdaki ekran görüntüsünde gösterilmektedir.

• Kısa kod bloğunu kullanma

Çok amaçlı bir blok olan Paragraph bloğunu kullanmanın yanı sıra, özellikle kısa kod eklemek için yapılmış Gutenberg bloğunu, yani Shortcode bloğunu da kullanabilirsiniz.

Bunu yapmak için, Görünüm > Widget’lar bölümüne gidin ve kısa kod eklemek istediğiniz widget alanını seçin. Daha sonra ekranınızın sol üst köşesindeki Widget’lar etiketinin yanındaki “+” işaretini tıklayın. Kullanılabilir bloklar listesinden Kısa Kod bloğunu bulun ve seçin. Bu durum Kısa Kod bloğunu seçilen pencere öğesi alanının sonuna ekleyecektir ve ardından bloğu istediğiniz konuma sürükleyip bırakabilirsiniz. Ardından geriye kalan tek şey, kısa kod çağrısını Kısa Kod bloğuna eklemek ve yaptığınız değişiklikleri kaydetmek için sağ üst köşedeki “Güncelle” düğmesini tıklamaktır.

Daha önce bahsedildiği gibi, kısa kod çağrısı şuna benzer bir etikettir: [shortcode_name] verilen kısa kod parametreleri kabul ederse, parametre-değer çiftlerini de içerebilir. Örneğimizde kullanılan kısa kodlar için bu, [current_date] etiketi, geçerli tarih kısa kodu parametreleri kabul etmediğinden ve [colored_text title=’insert-your-title-here’ title_color=’insert-your-color-here’], çünkü renkli metin kısa kodu başlık ve başlık rengi parametrelerini kabul eder. Söylemeye gerek yok, buna göre başlığınızı buraya ekleyin ve renginizi buraya ekleyin yer tutucularını değiştirmeniz gerekecek.

Daha önce de belirtildiği gibi, Gutenberg editörünü kullanırken WordPress kenar çubuklarına nasıl kısa kod ekleyebileceğinizi göstermek için bu iki kısa koddan herhangi birini sergilemek yeterlidir. Fakat önceki alt bölümdeki ile aynı düzeni oluşturarak her ikisini de göstereceğiz. Bu sefer bir Başlık bloğu, ayrı kısa kod çağrıları olan iki Kısa Kod bloğu ve aralarında bir Paragraf içerecektir. Tabii ki, bu dört bloğu bir Grup bloğuna dönüştürmek isteğe bağlıdır ve önceden gösterildiği gibi Grup bloğunu önceden ekleyerek veya daha sonra dört bloğu bir Grup bloğuna dönüştürerek yapılabilir.

Bu alt bölüm için, “+” işaretine tıklayarak ve Grup bloğuna tıklayarak önceki yaklaşımı seçtik. Daha sonra aşağıdaki ekran görüntülerinde gösterilen karşılık gelen değerlerle Başlık, iki Kısa Kod ve bir Paragraf bloğu ekledik.

Tüm içeriği ekledikten sonra “Güncelle” düğmesine tıkladık ve Ana Kenar Çubuğu widget alanını içeren gönderilerden birini inceleyerek web sitesinin ön ucundaki sonuçları test ettik. Sonuç aşağıda gösterilmiştir ve vurgulanmıştır.

İki sonucu karşılaştırarak görebileceğiniz gibi, blok tabanlı pencere öğesi düzenleyicisini kullanarak WordPress kenar çubuklarına kısa kodlar eklemek için Paragraf veya Kısa Kod bloğunu kullanırken aynı sonuca sahip olmalısınız. Böylece, hangisinin kullanılacağı seçimi kişisel tercihe gelir.

Klasik Pencere Öğeleri Ekranını Kullanarak WordPress Kenar Çubuklarına Kısa Kodlar Nasıl Eklenir?

Blok Tabanlı Widget’lar ekranı, 5.8 güncellemesinden bu yana her WordPress örneğinde varsayılan olarak etkin olsa da, bu değişikliği geri almanın ve Klasik Widget’lar ekranını bir kez daha kullanmanın hala yolları vardır. Bu yüzden Klasik Pencere Öğeleri ekranına alışkın olan ve pencere öğelerini yönetmek için Gutenberg düzenleyicisini kullanmak istemeyen eski WordPress kullanıcıları mutlu olabilir, çünkü bu değişikliği geri almak oldukça basittir.

Yalnızca Classic Widgets adlı bir eklentiyi kurmanız ve etkinleştirmeniz gerekir. Ne yazık ki, eklenti sayfasında belirtildiği gibi eklenti “en az 2022’ye kadar veya gerekli olduğu sürece desteklenecek ve sürdürülecek” olduğundan, bu yalnızca geçici bir çözüm olabilir. Bununla birlikte WordPress’in klasik kenar çubuğu widget’larına nasıl kısa kod ekleyebileceğinizi ele alacağız. Bu durum sırasıyla bir Metin widget’ına veya bir Özel HTML widget’ına kısa kodlar, yani kısa kod çağrıları eklemeyi içerir. Nasıl olduğunu açıklayalım.

• Metin Widget’ını Kullanma

Metin widget’ı, en kullanışlı varsayılan WordPress widget’larından biridir. Herhangi bir şablon dosyasını değiştirmeden bir widget alanına metin veya HTML kodu eklemenizi sağlar. Bu widget’a içerik eklerken, düzgün bir şekilde oluşturulabilmesi için Görsel sekmesine metin, Metin sekmesine HTML kodunun eklenmesi gerekir.

Ayrıca WordPress Metin widget’ı kısa kod çağrılarını kabul eder (örn. [shortcode_name]) geçerli bir metin biçimi olarak. Bu şekilde eklenen bir kısa kod çağrısı, kısa kodun çıktısını göstermek için web sitesinin ön ucunda düzgün bir şekilde işlenir.

Bu yüzden örneğin WordPress kenar çubuğunuza bir kısa kod eklemek isterseniz, bunu bir Metin widget’ı kullanarak yapabilirsiniz. Görünüm > Widget’lara giderek başlayın, kısa kodunuzu eklemek istediğiniz widget alanını bulun ve içine bir Metin widget’ı ekleyin. Daha sonra Görsel sekmesine kısa kod çağrısını ekleyin ve aşağıdaki Kaydet düğmesine tıklayın.

Bu örnekte yukarıda bahsedilen özel kısa kodların her ikisini de kullandık. Bunları kısaca açıklayalım.

İlk kısa kod herhangi bir parametre kabul etmediğinden, onu kısa kod adını kullanarak “adlandırdık”, yani [current_date]. Ve ikinci kısa kod iki parametreyi – başlık ve başlık rengi – kabul ettiğinden, bunları karşılık gelen kısa kod çağrısında sağladık. Ayrıca görsel olarak ayırmak için bazı Lorem Ipsum metinleri de ekledik…