WordPress Eğitimi: Bir Takdirler Eklentisi Nasıl Oluşturulur

Yazan makale:
  • WordPress
  • Güncelleme: Ağustos 12, 2013

Yani, burada WordPress ile ilgili ikinci haftalık dersimiz var. Nasıl oluşturulacağını öğrendik sonsuz kaydırma WP sitesi ve sayfa çevirme eklentisi geçmişte. Bugün, özel posta türleri ve verilerini nasıl yükleyeceğimiz hakkında biraz daha fazla bilgi edeceğiz.

Bu özellik sitenizde gerçekten önemlidir, çünkü sizi tavsiye eden kişilere göstermenize olanak tanır. Görüşler, senin beceriksizliğinin büyük bir sosyal kanıtı. Ve bunu elde etmek için karmaşık eklentilere veya kodlara ihtiyacınız yoktur, bir kaç dosyada göreceğiniz gibi, referanslarınız için seksi bir sunum oluşturabilirsiniz.

Hadi başlayalım o zaman!

Zip & Yükle

Bunu kontrol etmek için aceleniz varsa, şunları yapabilirsiniz: indir ve kurun.

Bazı verileri eklemeniz gerekecek, ardından gösterge tablosunda görebileceğiniz yeni referansları kullanarak birkaç referans ekleyerek:

list-referansları

Daha sonra yüklemek için temel kısa kodu kullanabilirsiniz:

[referansları rand = 0 max = 5]

Bu kodu eklediğinizde, sayfanızda böyle bir şey görürsünüz:

Ana-referansları

Şimdi bunu nasıl oluşturacağımızı ve keşfedeceğimizi göreceğiz (daha fazla işlev ekleyerek ve görünümü değiştirerek).

Temelleri

Daha önce de söylediğimiz gibi, başlık meta verileri, eklenti dosyasını oluşturun ve komut dosyalarınızı arayın. Uzun lafın kısası, eklentinizin adıyla wp-content / plugins'inizin altında yeni bir klasör oluşturacak, ardından ana eklenti dosyanızın olduğu klasörle aynı ada sahip bir dosya oluşturacaksınız.

Bunu kopyalayıp yapıştırdıktan sonra aşağıdaki gibi yapıştırın:

<? php / * Eklenti Adı: Referanslar Açıklama: Müşteri referanslarını görüntüleyin. Sürüm: 1.0 Yazar: Web Geliri Blog Lisansı: GPL2 * / // betikleri ve stilleri içeren bir fonksiyon plugin_scripts () {wp_enqueue_script ('jquery'); wp_enqueue_script ('flexslider', plugins_url ('js / jquery.flexslider-min.js', __FILE__), dizi ('jquery'), '2.2', yanlış); wp_enqueue_script ('referanslar', plugins_url ('js / testimonials.js', __FILE__), dizi ('jquery'), '1.0', yanlış); wp_enqueue_style ('flexsliderCSS', plugins_url ('css / flexslider.css', __FILE__), yanlış, '2.2', 'tümü'); wp_enqueue_style ('referanslarıCSS', plugins_url ('css / testimonials.css', __FILE__), yanlış, '1.0', 'tümü'); } add_action ("wp_enqueue_scripts", "plugin_scripts");

İşte yaptığımız şey:

  • WP'ye söylüyorum, eklentimizin adı, yazarı, ne yaptığı
  • Düzenli komut dosyalarını (jQuery gibi) ve özel komut dosyalarını (flexslider gibi) ve Stil sayfalarını eklediğimiz bir işlev oluşturmak
  • WP'ye betiklerin varsayılan betiklerinde çağrı yapmasını söyleme, böylece sayfalarda aslında yüklenecek

Her şey çok güzel, ama aslında / js ve / css altındaki dosyaları oluşturmayı unutmayın. Bunları demo içeriğimizde indirebilir, böylece flexslider dosyalarını bulmak için çok fazla şey yapmanıza gerek kalmaz.

Artık komik kısmı başlatabileceğimiz tüm temel şeylere sahibiz.

Özel Gönderi Türü

Varsayılan olarak, WordPress, 2 ortak posta türlerine, sayfalara ve yayınlara sahiptir. Ama aynı zamanda çok sayıda dahili posta türü (ek gibi) var, bu yüzden “yazı tipi” tanımı: saklamanız gereken her tür veri.

Eklentimiz yeni bir işlev oluşturacağından, WP'nin bunu saklamak için yerleşik bir yeri yoktur, bu yüzden bunu oluşturmamız gerekiyor. Korkmayın küçük çekirge, oldukça basit, bu kodu kullanabilirsiniz:

// yazı tipi işlevini oluşturmak için kara büyü, create_post_type () {register_post_type ('referanslar', // yeni yazı tipi dizisi ('labels' => array ('name' => __ ('Referanslar'), 'tekil_adı' => __ ('Övgü')), 'public' => true, / * Gönderi türü genel kullanıma yöneliktir. Buna ön uç ve wp-admin dahildir. * / 'Destekler' => dizi ('title ',' editor ',' thumbnail ',' custom_fields '),' hiyerarşik '=> yanlış)); }

Burada WP'ye “Hey Buddy, bu tür verileri depolamamız gerekiyor, lütfen onu almaya hazır olun” diyebilmek için register_post_type () işlevini kullanıyoruz.

Ayrıca, bu tür verilerin “referanslar” olarak adlandırıldığını, kamu erişimi için kullanılabilir olması gerektiğini (yani, bunun için kontrol panelinizde yeni bir menü öğesi oluşturması gerektiğini), üzerinde ihtiyaç duyduğumuz alanları ve hiyerarşik olduğunu söyleriz. ya da değil (ebeveyn ve çocuk sayfalarımız var gibi).

O zaman WordPress'i her yüklediğimizde aramalıyız. Bu kanca yapacak:

add_action ('init', 'create_post_type');

Özel Alanlar

Şimdi özel posta türümüzün başlığı (kişinin adı), içeriği (kişinin referansı), bir resim (öne çıkan resim) var ama bir bağlantı eksik, çünkü eğer kişi sizin hakkınızda konuşacak kadar güzelse, en azından siteleri, değil mi?

Bunu her zamanki özel alanlarla yapabiliriz, ancak kullanıcının alan adını yazması gerekmeyen ve ayrıca bazı doğrulama kuralları ekleyebileceğiniz “kapalı” bir alana sahip olmak çok daha iyidir.

Her şeyden önce, yazı düzenleme alanınızda bulunan bu güzel paneller olan yeni bir meta kutusu oluşturmamız gerekiyor, her küçük panel bir metaboxtır. Bu işlev oluşturup çağırır:

// URL meta kutusu alan fonksiyonu ekleyerek add_custom_metabox () {add_meta_box ('özel metabox', __ ('Bağlantı'), 'url_custom_metabox', 'referansları', 'taraf', 'düşük'); } add_action ('admin_init', 'add_custom_metabox');

Add_meta_box () işlevi şu parametreleri gerektirir:

  1. ID - Bunun için benzersiz bir tanımlayıcı. Burada “unicorn-eating-rainbow” veya “referans-link” gibi benzersiz bir şeyi kullanabilirsiniz. Dahili olarak kullanılabilecek her şey
  2. Başlık - Kullanıcı için ne gösterilecek? Burada __ () işlevini kullanmanız önemlidir, bu, yabancı dillerden kullanıcıların eklentinizi .po dosyalarıyla (eklenti dosyalarını düzenlemeden) çevirmesine olanak veren işlevdir.
  3. Geri arama - Meta kutusunun gerçek içeriğine sahip olduğunuz işlev
  4. Yazı Türü - Bizim durumumuzda sadece referanslar için görünür olmasını istiyoruz
  5. Bağlam - Sayfada göstermek istediğiniz yer
  6. Öncelik - Aynı konumdaki diğer öğelerden önce veya onlardan sonra olması gerekiyorsa

Şimdi onu aradığımızdan beri url_custom_metabox () işlevini oluşturmamız gerekiyor.

// Yönetici alanı işlevi için HTML url_custom_metabox () {global $ post; $ urllink = get_post_meta ($ post-> ID, 'urllink', doğru); // doğrulayarak! if (! preg_match ("/ http (s?): ///", $ urllink) && $ urllink! = "") {$ errors = "Bu URL geçerli değil"; $ urllink = "http: //"; } // output invlid url mesajını girin ve http: // giriş alanına ekleyin (ifset ($ errors)) {echo $ errors; }?> <p> <= "siteurl" için etiket>> URL: <br /> <giriş kimliği = "siteurl" size = "37" name = "siteurl" değer = "<? php if (isset ($ urllink)) ) {echo $ urllink;}?> "/> </label> </p> <? php}

Tamam, şimdi bunu düz İngilizce'ye çeviriyorum:

  • Genel değişken $ gönderi denir, dolayısıyla mevcut öğenin POSTID'ini nerede bulabiliriz
  • URL için geçerli değeri yüklüyoruz
  • Ekleyen kullanıcının değeri geçerliyse doğrularız. En az bir “http” veya “https” varlığı varsa, değer tamamdır, aksi halde geçerli olur ve varsayılan değeri kullanmamız gerekir.
  • Eğer varsa, hataları gösteririz.
  • Şimdi gerçek HTML'yi başlıyoruz, PHP'de olduğu gibi giriş alanında varsayılan değeri ekliyoruz.

Bu noktadan sonra, kullanıcı tarafından gönderilenleri gerçekten kaydetmeliyiz. "Save_post" kancasını kullanacağız, bu yüzden WordPress bir gönderi kaydettiğinde bu işlevi çağırır:

// özel alan verisi işlevini kaydeder save_custom_url ($ post_id) {global $ post; if (isset ($ _ POST ['siteurl']))) {update_post_meta ($ post-> ID, 'urllink', $ _POST ['siteurl']); }} add_action ('save_post', 'save_custom_url');

Burada, alan adı olan “site bağlantısı” adı verilen herhangi bir gönderi verisinin olup olmadığını kontrol ediyoruz. Bir site bağlantısı varsa, onu kaydedelim.

Her şey tamamlandıktan sonra, yeni referans sayfanız şöyle görünecektir:

Yeni-bonservis

Özel Verilerimizi Yükleme

Şimdi uygun bir WP döngü gerek kalmaz (yani DB aramaların bir sürü eklemek ve biz gerçekten don olurdu biz aslında bizim öğelerin yüklenmesini gerekir ve biz sadece basit veriye sahip çünkü çoğunlukla, () işlevini get_posts kullanacağız gerek yok.

Bu nedenle, önce sitemizin bağlantısını bulmak için bir işlev oluşturalım.

// bir post işlevi için URL döndürür get_url ($ post) {$ urllink = get_post_meta ($ post-> ID, 'urllink', doğru); $ urllink döndür; }

Şimdi, kısa kod işlevini başlatabiliriz. Kısa kod verisini varsayılan ve doğrulamak için basit bir yol, döngü için bir öznitelik nitelikleri oluşturmaktır, böylece bunlara ihtiyaç duyduğumuzda yeni öğeler ekleyebiliriz:

// referansları işlevini göstermek için kısa kodu kaydetme load_testimonials ($ a) {$ args = array ("post_type" => "referansları"); if (isset ($ a ['rand']) && $ a ['rand'] == doğru) {$ args ['orderby'] = 'rand'; } if (isset ($ a ['max']))) {$ args ['posts_per_page'] = (int) $ a ['max']; } // tüm referansları almak $ posts = get_posts ($ args); // HTML ÇIKIŞI} add_shortcode ("referanslar", "load_testimonials");

Görebildiğiniz gibi, WordPress'in gereksinim duyduğu biçimde doğruladıkları sırada $ args dizisine yüklenen ve geçirilen kısa kod özniteliklerine sahibiz, bu yüzden bunları kullanarak yayınları yükleyebiliriz.

Şimdi, flexslider'ın varsayılan yapısını takip ederek, orada bir miktar HTML kodu eklememiz gerekiyor. Nasıl görüneceği şöyle:

echo '<div>'; echo '<ul>'; foreach ($ yazı olarak $ $) {// baş parmak resmi alma $ url_thumb = wp_get_attachment_thumb_url (get_post_thumbnail_id ($ post-> ID)); $ link = get_url ($ post); echo '<li>'; if (! empty ($ url_thumb)) {echo '<img src = "'. $ url_thumb. '" />'; } echo '<h2>'. $ post-> post_title. '</h2>'; if (! empty ($ post-> post_content)) {echo '<p>'. $ post-> post_content. '<br />'; } if (! empty ($ link)) {echo '<a href="'.$link.'"> Siteyi Ziyaret Edin </a> </p>'; } echo '</li>'; } echo '</ul>'; echo '</div>';

Bekle, ama neden PHP fonksiyonunun içindeki HTML kodunu oluşturalım? Bunun nedeni, içeriği yalnızca kullanıcı içerik eklediyse koşullu olarak yükleyebilmemizdir. Bu nedenle, boş HTML etiketlerine sahip olmayacaksınız, sadece düzeninizi bozmayacaksınız.

Kenar çubuğuna ne dersin?

Çoğu kişi sadece kenar çubuğunda referanslar göstermek istiyor ve metin eklentileri kısa kodları işlemediği için bu eklenti gerçekten işe yaramayacak. Bunun için basit bir çözüm var, sadece bunu kodunuza ekleyin:

add_filter ('widget_text', 'do_shortcode');

Sıradaki ne?

Yani, bu öğreticiden hoşlandınız mı? Referans kısa kodunuz için bir seçenek olarak neler eklersiniz? Gelecek gönderiler için herhangi bir fikrin var mı? Yorumlar bölümünü kullanarak bize bildirin!

Rochester Oliveira hakkında

Brasil, Itajubá (MG) 'dan bir web tasarımcısı ve girişimcisiyim. Karanlık konular hakkında yazmayı ve güzel şeyler yapmayı seviyorum.