Tutorial WordPress: Jinsi ya Kujenga Testimonial Plugin

Kwa hiyo, hapa sisi ni kwa mafunzo yetu ya pili ya kila wiki kwenye WordPress. Tumejifunza jinsi ya kuunda haipatikani tovuti ya kurasa ya WP na Flip ya ukurasa-flip zamani. Leo tutajifunza zaidi kidogo kuhusu aina za post desturi, na jinsi ya kupakia data zao.

Kipengele hiki ni muhimu sana kwenye tovuti yako, kwani inakuwezesha kuonyesha watu kukupendekeza. Ushuhuda ni ushahidi mkubwa wa kijamii wa uovu wako. Na huna haja ya vipengele vingi au kanuni nyingi ili kufikia hili, kama utakavyoona na faili kadhaa unaweza kuanzisha ushuhuda wa sexy kwa ushuhuda wako.

Hebu tuanze basi!

Zip & Weka

Ikiwa una haraka ili uangalie hili, unaweza download na kufunga hiyo.

Utahitaji kuongeza data kisha, kwa kuongeza ushuhuda wachache kutumia ushuhuda mpya wa bidhaa unaweza kuona kwenye dashibodi yako:

Kisha unaweza kutumia shortcode ya msingi kupakia kwamba:

[ushuhuda rand = 0 max = 5]

Ukiongeza code hiyo utaona kitu kama hiki kwenye ukurasa wako:

Sasa tutaona jinsi ya kuunda na kuchunguza hili (kwa kuongeza kazi zaidi na kubadilisha uonekano).

Misingi

Kama tulivyosema hapo awali, utahitaji kuongeza kichwa cha metadata, tengeneza faili ya programu ya pembejeo na piga maandiko yako. Muda mrefu wa hadithi, utaunda folda mpya chini ya wp-content / plugins yako na jina la Plugin yako, kisha uunda faili yenye jina moja kama folda kuwa faili yako kuu ya programu.

Mara baada ya kufanya hivyo nakala na ushirike kama ifuatavyo:

<?php
/*
Plugin Name: Testimonials
Description: Display customer testimonials.
Version: 1.0
Author: Web Revenue Blog
License: GPL2
*/

//enqueueing scripts and styles
function plugin_scripts(){
    wp_enqueue_script('jquery');
    wp_enqueue_script('flexslider', plugins_url( 'js/jquery.flexslider-min.js' , __FILE__ ), array('jquery'), '2.2', false);
    wp_enqueue_script('testimonials', plugins_url( 'js/testimonials.js' , __FILE__ ), array('jquery'), '1.0', false);
    wp_enqueue_style('flexsliderCSS', plugins_url( 'css/flexslider.css' , __FILE__ ), false, '2.2', 'all' );
    wp_enqueue_style('testimonialsCSS', plugins_url( 'css/testimonials.css' , __FILE__ ), false, '1.0', 'all' );
}
add_action("wp_enqueue_scripts","plugin_scripts");

Hapa ndilo tunachofanya:

• Kuelezea WP nini jina la Plugin yetu, mwandishi, kinachofanya nini
• Kuunda kazi, ambako tunaingiza maandiko ya kawaida (kama jQuery) na maandiko ya desturi (kama vile mabadiliko), na Stylesheets
• Kuiambia WP kupakia scripts kazi katika script default default wito, hivyo watakuwa kweli kubeba katika kurasa

Yote ni ya baridi, lakini usisahau kuunda files chini ya / js na / css. Unaweza tu kupakua kwenye maudhui ya demo yetu kwa hivyo huna haja ya kuchimba mengi ili kupata mafaili ya flexslider.

Sasa tuna mambo yote ya msingi mahali ambapo tunaweza kuanza sehemu ya funny.

Aina ya Post Post

Kwa default, WordPress ina aina ya post ya kawaida ya 2, kurasa na machapisho. Lakini pia ina aina nyingi za posta za ndani (kama viambatisho), hivyo ufafanuzi wa "aina ya post" ni: Kila aina ya data unayohitaji kuhifadhi.

Kama Plugin yetu itaunda utendaji mpya WP haina nafasi iliyojengeka kuhifadhiwa, hivyo tunahitaji kuunda hiyo. Usiogope mdogo mdogo, ni rahisi sana, unaweza kutumia code hii:

// uchawi mweusi kuunda kazi ya aina ya posta create_post_type () {register_post_type ('ushuhuda', // safu mpya ya aina ya posta ('labels' => safu ('name' => __ ('Testimonials'), 'singular_name' => __ ('Ushuhuda')), 'public' => kweli, / * Aina ya chapisho imekusudiwa kutumiwa na umma. Hii ni pamoja na mwisho wa mbele na katika wp-admin. * / 'Inasaidia' => safu ('title' ',' editor ',' thumbnail ',' custom_fields '),' hierarchical '=> uongo)); }

Hapa tunatumia kazi ya register_post_type () kuwaambia WP "Hey Buddy, tunahitaji kuhifadhi data hii ya aina, tafadhali tupate tayari kuipata".

Tunamwambia pia kwamba aina hii ya data inaitwa "ushuhuda", inapaswa kuwa inapatikana kwa upatikanaji wa umma (hivyo kwa kweli kuunda kitu kipya cha menu katika dashibodi yako), mashamba tunayohitaji, na ikiwa ni hierarchical au si (kama kurasa ambazo tuna wazazi na kurasa za watoto).

Kisha tunahitaji kuiita kila wakati tunapopakia WordPress. Ndoano hii itafanya:

add_action ('init', 'create_post_type');

Mashamba ya Desturi

Sasa aina yetu ya post ya desturi ina kichwa (jina la mtu), yaliyomo (ushuhuda wa mtu), picha (inayoonyesha picha) lakini haifai kiungo, kwa kuwa ikiwa mtu huyo ni mzuri wa kuzungumza juu yako, unapaswa kuunganisha tovuti yao, sawa?

Tunaweza kufanya hivi na uwanja wa kawaida wa kawaida, lakini ni bora kuwa na uwanja "uliofungwa", ambapo mtumiaji haitaji kuchapa jina la uwanja, na pia mahali ambapo unaweza kuongeza sheria zingine za uthibitisho.

Kwanza kabisa tunahitaji kujenga metabox mpya, ambayo ni paneli nzuri zilizo na eneo lako la kuchapisha post, kila jopo ndogo ni metabox. Kazi hii itaunda na kuiita:

// kuongeza kazi ya uwanja wa sanduku la meta la URL add_custom_metabox () {add_meta_box ('custom-metabox', __ ('Link'), 'url_custom_metabox', 'testimonials', 'side', 'low'); } kuongeza_utendaji ('admin_init', 'add_custom_metabox');

Shughuli ya add_meta_box () inahitaji vigezo hivi:

1. ID - Kitambulisho cha kipekee cha hilo. Unaweza kutumia kitu chochote cha kipekee hapa kama "upinde wa mvua ya nyati" au "ushuhuda-kiungo". Kitu chochote ambacho kinaweza kutumika ndani
2. Kichwa - Nini itaonyeshwa kwa mtumiaji? Hapa ni muhimu kutumia kazi ya __ (), ni kazi ambayo inaruhusu watumiaji kutoka lugha za kigeni kutafsiri Plugin yako na faili za .po (bila kuhariri faili za Plugin)
3. Callback - Kazi ambapo una maudhui halisi ya metabox
4. Aina ya Chapisho - Kwa upande wetu tunataka ionekane tu kwa ushuhuda
5. Muktadha - Ambapo katika ukurasa unataka kuonyesha
6. Kipaumbele - Ikiwa ni lazima kabla ya vitu vingine vya nafasi sawa au baada yao

Sasa tunahitaji kuunda kazi ya url_custom_metabox (), tangu tumeiita.

// HTML ya eneo la msimamizi kazi url_custom_metabox () {global $ post; $ urllink = get_post_meta ($ post-> ID, 'urllink', kweli); // inathibitisha! ikiwa (! preg_match ("/ http (s?): ///", $ urllink) && $ urllink! = "") {$ error = "URL hii sio halali"; $ urllink = "http: //"; } // pato linalobadilisha ujumbe wa url na ongeza http: // kwenye uwanja wa kuingiza ikiwa (isset (makosa ya $)) {echo $ error; }?> URL: " />

Ok, sasa una tafsiri hii kwa Kiingereza wazi:

• Mtazamo wa kimataifa wa $ unaitwa, hivyo tunaweza kujua ni POSTID ya kipengee cha sasa
• Tunapakia thamani ya sasa kwa URL
• Tunathibitisha Ikiwa thamani ambayo mtumiaji ameingizwa haifai. Ikiwa kuna angalau tukio la "http" au "https" thamani ni sawa, vinginevyo ni sahihi na tunahitaji kutumia thamani ya msingi
• Kisha tunaonyesha makosa, ikiwa kuna yoyote
• Sasa tunaanza HTML halisi, na kuongeza thamani ya msingi katika uwanja wa pembejeo kama tulivyopata kwenye PHP

Baada ya hatua hii tunahitaji kuokoa kile kinachotumwa na mtumiaji. Tutatumia ndoano "salama_kusafirisha", hivyo kila wakati WordPress itaokoa chapisho ititaja kazi hii:

// huhifadhi kazi ya data ya uwanja wa kawaida save_custom_url ($ post_id) {global $ post; ikiwa (isset ($ _ POST ['siteurl'])) {update_post_meta ($ post-> ID, 'urllink', $ _POST ['siteurl']); }} ongeza_utendaji ('save_post', 'save_custom_url');

Hapa tunaangalia tu kama kuna data yoyote ya post inayoitwa "sitelink" ambayo ni jina la uwanja wetu. Ikiwa kuna sitelink, hebu tuihifadhi.

Baada ya kila kitu kuwekwa sawa, hii ndio jinsi ukurasa wako mpya wa ushuhuda utaonekana kama:

Inapakia Data yetu ya Desturi

Sasa tunahitaji kwa kweli kupakia vitu vyetu, na tutatumia kazi za_to_posts (), hasa kwa sababu tuna data rahisi tu kwa hivyo hatuhitaji kitanzi sahihi cha WP (ambacho kinaongeza simu nyingi za DB na tunatupa kweli Tunahitaji).

Kwa hiyo, hebu kwanza tujenge kazi ili kupata kiungo cha tovuti yetu, ikiwa kuna.

// kurudi URL kwa kazi ya posta get_url ($ post) {$ urllink = get_post_meta ($ post-> ID, 'urllink', kweli); kurudi $ urllink; }

Sasa, tunaweza kuanza kazi ya njia fupi. Njia rahisi ya kutofautisha na kuhalalisha data ya njia fupi inaunda sifa za kitanzi kama safu, ili tuweze kuongeza vitu vipya kama tunavyohitaji, kama hii:

// kusajili nambari fupi ili kuonyesha ushuhuda kazi mzigo_testimonials ($ a) {$ args = array ("post_type" => "ushuhuda"); ikiwa (isset ($ a ['rand']) && $ a ['rand'] == kweli) {$ args ['orderby'] = 'rand'; } ikiwa (isset ($ a ['max'])) {$ args ['posts_per_page'] = (int) $ a ['max']; } // kupata ushuhuda wote $ posts = pata_post ($ args); // HTML OUTPUT} ongeza_shortcode ("ushuhuda", "mzigo_wa ushuhuda");

Kwa kuwa unaweza kuona tuna sifa za shortcode zilizobeba na kupitishwa kwa safu ya args ya $ wakati inapohakikisha, kwa muundo ambao WordPress inahitaji, hivyo tunaweza kupakia machapisho kutumia yao.

Sasa tunahitaji kuongeza msimbo wa HTML huko, kufuatia muundo wa default wa flexslider. Hapa ni jinsi itaonekana kama:

mwangwi ' '; mwangwi ' '; kitangulizi (machapisho ya $ kama $ post) {// kupata picha ya kidole gumba $ url_thumb = wp_get_attachment_thumb_url (get_post_thumbnail_id ($ post-> ID)); Kiunga cha $ = get_url ($ post); mwangwi ' '; ikiwa (! tupu ($ url_thumb)) {echo ' '; } mwangwi ' '. $ post-> post_title.' '; ikiwa (! tupu ($ post-> post_content)) {echo ' '. $ post-> post_content.' '; } ikiwa (! tupu ($ link)) {echo ' Tembelea Tovuti '; } mwangwi ' '; } mwangwi ' '; mwangwi ' ';

Kusubiri, lakini kwa nini tunaweza kuunda msimbo wa HTML ndani ya kazi ya PHP? Hiyo ni kwa sababu tunaweza kupakia maudhui kwa hali tu ikiwa mtumiaji ameongeza maudhui, kwa hivyo huwezi kuwa na vitambulisho vya HTML vyenye tupu, unasubiri kuharibu mpangilio wako.

Je, ni juu ya ubao wa kando?

Watu wengi wanataka tu kuonyesha ushuhuda kwenye ubao wa vidogo, na programu hii haifanyi kazi vizuri tangu vilivyoandikwa vyenye maandishi haipati mchakato mfupi. Kuna suluhisho rahisi kwa hili, tu kuongeza hii katika msimbo wako:

add_filter ('widget_text', 'do_shortcode');

Nini hapo?

Hivyo, umefurahia mafunzo haya? Ungeongeza nini kama chaguo kwa shortcode yako ya ushuhuda? Je, una mawazo yoyote ya machapisho ya baadaye? Hebu tujue kutumia sehemu ya maoni!