WordPress'te nasıl kısa kod oluşturulacağını öğrenmek ister misiniz?
WordPress'te nasıl kısa kod oluşturulacağını öğrenmek, yazılarınızı ve sayfalarınızı kişiselleştirmenin etkili bir yolu olabilir. Ancak, süreçte yeniyseniz, web sitenizde böyle bir özelliği nasıl kullanacağınızı bulmakta zorlanabilirsiniz.
Bu nedenle, başlamanıza yardımcı olacak bir rehber hazırladık. Kısa kodların nasıl çalıştığına ve bunların nasıl etkili bir şekilde uygulanacağına bakarak, ek eklentilere ihtiyaç duymadan içeriğinizi beğeninize göre özelleştirmeye başlayabilirsiniz.
Bu yazıda, WordPress kısa kodlarının ne olduğunu ve neden bunları kullanmayı düşünebileceğinizi tartışacağız. Sonra size kendinizinkini nasıl oluşturacağınızı göstereceğiz.
Ama daha önce, eğer WordPress keşfi hiç kurmadıysanız Bir WordPress blog 7 adımlarını nasıl yüklenir et Nasıl bulmak yüklemek ve blogunuzda bir WordPress tema etkinleştirmek için
O zaman neden burada olduğumuza dönelim.
WordPress kısa kodları nelerdir?
WordPress kısa kodları, öğeleri bir gönderiye veya sayfaya hızlı bir şekilde yerleştirmenize olanak tanıyan kısayollar görevi görür. Bunlar genellikle köşeli parantez içine alınmış tek bir kod satırıdır. Örneğin :
[exemplecodehortcode]Bu kod, web sitenizin ön ucunda önceden belirlenmiş bir özellik gösterecektir.
WordPress ilk tanıtılan kısa kodlar serbest bırakılmasıyla Kısa kod API'si. Bu, kullanıcıların gönderilerine ve sayfalarına aşağıdaki gibi çekici öğeler eklemelerini kolaylaştırdı: Google Haritalar veya Facebook "Beğen" düğmesi.
WordPress'te var varsayılant altı kısa kod :
- başlık: Altyazıları içeriğin etrafına sarın
- galeri : resim galerilerini görüntüler
- ses: ses dosyalarını gömer ve oynatır
- video : video dosyalarını gömer ve oynatır
- çalma listesi : ses veya video dosyalarının bir koleksiyonunu görüntüler
- gömmek : satır içi öğeleri sarar
Ayrıca iki temel kısa kod biçimlendirme türüyle karşılaşacaksınız: self-closing et enclosing.
Kısa kodlar self-closing kendi başına durabilir ve bir kapanış etiketine ihtiyaç duymaz.
Bu arada, enclosing düzenlemek istediğiniz içeriği çevreleyin ve sizi etiketi manuel olarak kapatmaya zorlayın. Örneğin, URL'yi etiketler arasına kaydırarak bir YouTube videosunu gömebilirsiniz. embed et /embed :
Örneğin, bu aşağıdaki sonucu yaratacaktır:
Kesin olarak en iyi WordPress eklentileri kendi kısa kodları ile gel. Örneğin, WP Formları et İletişim Formu 7 hızlı bir şekilde yerleştirmenize izin veren kısa kodlara sahiptir. İletişim formu bir gönderide veya sayfada. gibi bir eklenti de kullanabilirsiniz. Maksimum Düğmeler web sitenizde istediğiniz yere bir düğme kısa kodu eklemek için.
Neden WordPress Kısa Kodlarını Kullanmayı Düşünmelisiniz?
WordPress kısa kodlarını kullanmanın birçok nedeni vardır. Örneğin, HTML'de uzun bir kod parçası öğrenmekten ve yazmaktan daha kolay ve hızlıdır. Ayrıca, içeriğinizi temiz ve erişilebilir tutmanıza yardımcı olurlar.
Kısa kodlar, tekrar tekrar kullandığınız belirli özellikleri otomatikleştirmek için kullanılabilir. Örneğin, bir düğme kullanırsanız harekete geçirici mesaj (CTA) makalelerinizin her birinde, özel bir kısa kodun hazır olması hızlı ve kolay bir çözüm olabilir.
Belirtilmelidir ki Gutenberg editörü kısa kodların kullanımına bağlı olarak aynı şekilde çalışır. WordPress kullanıcılarının blokların kullanımı yoluyla çeşitli etkileşimli özellikler eklemesine olanak tanır.
Böyle bir yöntem, yeni başlayanlar için çok daha uygundur çünkü doğrudan kullanıcı arayüzüne içerik ekleyebilirsiniz. Ancak, WordPress blok düzenleyicisi sundukları açısından hala sınırlıdır. Neyse ki, bir blok ile geliyor Kısa kod, sayfalarınıza özel içerik eklemenizi sağlar.
WordPress'te kısa kod nasıl oluşturulur
Zaten kodlama bilginiz varsa, kendi özel kısa kodlarınızı oluşturabilirsiniz. Bu, web sitenizin görünümü ve işlevselliği üzerinde tam kontrol sahibi olmanızı sağlar.
Özel bir WordPress kısa kodunun nasıl oluşturulacağını görelim. Bu eğitimde, örnek olarak bir makaleye sosyal medya bağlantıları ekleyeceğiz.
Adım 1 – Yeni bir tema dosyası oluşturun
Başlamadan önce, WordPress web sitenizi tamamen yedekleyin. Ayrıca, dosyanın dışında özel kısa kodunuz için ayrı bir dosya oluşturmanız gerekecektir. functions.php senin WordPress tema. Bu, bir şeylerin ters gitmesi durumunda bir geri dönüş çözümü sağlayacaktır.
bir istemci kullanabilirsiniz FTP (Dosya Aktarım Protokolü) gibi FileZilla web sitenizin tema dosyalarına erişmek için. Web sitenize giriş yaptıktan sonra şuraya gidin: wp-content> temalar ve mevcut tema klasörünüzü bulun. Örneğimizde, bu olacak baykuş:
klasörünüzü açın WordPress tema, sağ tıklayın ve basın Yeni dosya oluştur.
Yeni dosyanıza bir ad verin özel-kısa kodlar.php sonra tıklayın OK. Daha sonra üzerine sağ tıklayıp seçeneği seçerek düzenleyebilirsiniz. Görünümü Düzenle :
Bu, dosyayı varsayılan metin düzenleyicinizde açacaktır. Ardından, aşağıdaki kod bloğunu eklemeniz yeterlidir:
<?php ?>
Bu, yeni dosyanızın WordPress'in üzerine kurulu olduğu betik dili olan PHP olarak yorumlanmasını sağlar.
Daha sonra değişikliklerinizi kaydedebilir ve dosyayı kapatabilirsiniz. Sunucuda güncelleneceğinden ve web sitenize uygulanacağından emin olmak için aşağıdaki kutuyu işaretlediğinizden emin olun:
Ardından dosyayı açın functions.php aynı tema klasöründe ve belgenin altına aşağıdaki kod satırını ekleyin:
include('shortcodes-personnalises.php');
Bu, sisteme dosyada yaptığınız değişiklikleri dahil etmesini söyleyecektir. özel-kısa kodlar.php içinde functions.php onları ayırmanıza izin verirken. Hazır olduğunuzda, değişikliklerinizi kaydedin ve dosyayı kapatın.
Adım 2 - Kısa Kod İşlevini Oluşturun
Ardından, ne yapacağını bildiren kısa kod işlevini oluşturmanız gerekir. Seçeneği tekrar seçin Görünümü Düzenle dosyanın özel-kısa kodlar.php. İşlevinizi bağlamak üzere bir eylem eklemek için aşağıdaki kod parçacığını kullanın:
function subscribe_link(){
return 'Follow us on <a rel="nofollow" href="https://twitter.com/BlogPasCher">Twitter</a>';
}Ardından, kanca eylemi etkinleştirildiğinde çalışacak olan bir geri arama işlevi eklemeniz gerekecek. Aşağıdaki kod satırını yukarıda belirtilenden hemen sonra eklemek, WordPress'e işlevinizin bir kısa kod olduğunu söyleyecektir:
add_shortcode('sabonner', 'subscribe_link');İşlevi kullanarak bir kısa kod oluşturduğunuzda add_shortcode, bir kısa kod etiketi atarsınız " ($tag) " ve karşılık gelen bir işlev kancası " ($func) kısayol her kullanıldığında çalışacaktır.
Başka bir deyişle, kısa kod etiketi [abone ol] ise, kanca 'abone ol_bağlantısı' ziyaretçiyi sağlanan URL'ye yönlendirir.
Bu nedenle dosyanızda kullandığınız kodun tamamı shortcodes-personnalises.php şöyle görünecek:
Etiketleri adlandırırken, alt çizgi kullanılabilse de, yalnızca küçük harf kullanmanız gerektiğine dikkat edilmelidir. Aynı zamanda çok önemli tire kullanmaktan kaçının, diğer kısa kodlarla etkileşime girebileceğinden.
Adım 3 – Kendi Kendine Kapanan Kısa Kodu Web Sitesine Ekleyin
Artık ilk kodunuzu WordPress sitenizde kendi kendine kapanan bir kısa kod olarak test edebilirsiniz. WordPress blok düzenleyicisini kullanarak [abone ol] etiketini doğrudan gönderiye ekleyebilirsiniz:
Bu, web sitenizin ziyaretçilerine aşağıdaki içeriği gösterecektir:
Bu kısa koddan memnunsanız, başka bir şey yapmanız gerekmez. Ancak özelleştirmek isterseniz bir sonraki adıma geçebilirsiniz.
Adım 4 - Kısa Koda Parametreler Ekleyin
Kısa kodu uyarlayabilirsiniz "abone" diğer sosyal medya bağlantılarını görüntülemek için ek işlevsellik için. URL'yi değiştirmek için bir parametre ekleyerek bunu yapabilirsiniz.
Yöntemlerden biri yönetim özellikleri ekle, dosyayı açmanız gerekiyor özel-kısa kodlar.php ve aşağıdaki kodu ekleyin:
function subscribe_link_att($atts) {
$default = array(
'link' => '#',
);
$a = shortcode_atts($default, $atts);
return 'Follow us on '.$a['link'];
}
add_shortcode('sabonner', 'subscribe_link_att');Bu, kısa kod etiketinizdeki bağlantıları Gutenberg düzenleyicisine eklemek için özelleştirmenize olanak tanır. Dosyadaki önceki kodun üzerine yapıştırabilirsiniz. özel-kısa kodlar.php. Bunun gibi bir şeye benzemeli:
ekleme kısa kod_atts() işlevi kullanıcı özniteliklerini bilinen tüm özniteliklerle birleştirecek ve eksik veriler varsayılan değerleriyle değiştirilecektir. Hazır olduğunuzda, değişikliklerinizi kaydedin ve dosyayı kapatın.
Adım 5 - Ayarları test edin
Artık güncellenmiş kısa kodu WordPress Blok Düzenleyici'de test edebilirsiniz. Örneğimizde, Twitter ve Facebook bağlantılarımızı aşağıdaki kısa kodlarla test ediyoruz:
[abone ol link='https://www.facebook.com/live.blogpascher']Facebook[/abone ol]
[abone ol bağlantısı='https://twitter.com/BlogPasCher']Twitter[/abone ol]
Bu, ön uçta aşağıdaki sonucu üretecektir:
Bu kendi kendine kapanan kısa kod, sosyal profillerinizin doğrudan URL'lerini ziyaretçilere gösterir. Ancak, bu özelliğin biraz parlak görünmesini isteyebilirsiniz.
Örneğin, kullanıcılara tıklamak üzereyken görüntülenen bağlantı metnini tamamen özelleştirmenize izin veren ekli bir sürüm oluşturabileceksiniz. Bir sonraki adımda nasıl yapacağınızı göstereceğiz.
Adım 6 – Çevreleyen Kısa Kod Oluşturun
Ekleyen kısa kod, önceki otomatik kapanma örneğiyle aynı şekilde biçimlendirilecektir. Ancak, işlev için ek bir parametre içerecektir.
İlk olarak, eklemeniz gerekecek $content = null, bu işlevi çevreleyen bir kısa kod olarak tanımlar. Daha sonra ekleyebilirsiniz do_shortcode içeriği kısa kodlar için arayacak olan WordPress'ten.
Dosyanın içinde özel-kısa kodlar.php, yeni ek kısa kodu ekleyin:
function subscribe_link_att($atts, $content = null) {
$default = array(
'link' => '#',
);
$a = shortcode_atts($default, $atts);
$content = do_shortcode($content);
return 'Suivez nous sur <a href="'.($a['link']).'" style="color: blue">'.$content.'</a>';
}
add_shortcode('sabonner', 'subscribe_link_att');Hazır olduğunuzda, dosyanız özel-kısa kodlar.php şöyle görünmeli:
Önceki kodun bir özelliği var "stil" ek, bağlantı metnini mavi renge değiştirecek. İşiniz bittiğinde değişikliklerinizi kaydetmeyi unutmayın.
Adım 7 – Web Sitesine Ekleyen Kısa Kodu Ekleyin
Nihai sonucu görmek için artık kısa kodunuzu WordPress blok düzenleyicisine ekleyebilirsiniz:
Fark ettiğiniz gibi, bu sarmalayıcı kısa kodunu kullanarak sosyal medya sayfanızın URL'lerini ve ziyaretçiye görüntülenen bağlantı metnini kolayca değiştirebilirsiniz. Bu durumda, seçtik " Facebook " et "Heyecan" :
Orası ! Artık sayfalarınızdaki ve gönderilerinizdeki abonelik bağlantıları için özel bir kısa kod oluşturdunuz. Yukarıda belirtilen tüm adımların, WordPress özelliğini kullanarak her türlü farklı öğeyi oluşturmak için değiştirilebileceğini unutmayın. Shortcodes.
WordPress web sitenize ek işlevler eklemek, kısa kodlarla çok daha kolaydır. Bunları mevcut içeriğinizi kişiselleştirmek ve iletişim formları, resim galerileri veya abonelik bağlantıları gibi etkileşimli özellikler eklemek için kullanabilirsiniz.
Diğer önerilen kaynaklar
Ayrıca, web sitenizi ve blogunuzu daha iyi ele geçirmek ve kontrol altına almak için sizi aşağıdaki kaynaklara başvurmaya davet ediyoruz.
- Elementor ile Z indeksli kayan bir düğme nasıl oluşturulur
- Ne zaman ve nasıl bir alt WordPress yüklemek için
- Basit Bir Gutenberg Bloğu WordPress Eklentisi Nasıl Oluşturulur
- Bir WordPress Web Sitesine Özel Yazı Tipleri Nasıl Eklenir
Sonuç
Bu yazıda, WordPress'te kendi kısa kodunuzu nasıl oluşturacağınızı öğrendik. Herhangi bir endişeniz veya öneriniz varsa, lütfen bize bildirin. Yorumlar.
Bununla birlikte, ayrıca bize danışabilirsiniz kaynakların bulunduğuİnternet siteleri oluşturma projelerinizi yürütmek için daha fazla elemana ihtiyacınız varsa, WordPress blog oluşturma ya da Divi: Tüm zamanların en iyi WordPress teması.
Bu arada, bu yazıyı farklı sosyal ağlarda paylaş.
...
