WordPress Tutorial: Hur man skapar ett testimonials plugin

Så här är vi för vår andra veckastudie om WordPress. Vi har lärt oss hur man skapar en oändlig rullande WP-webbplats och sid-flip-plugin tidigare. Idag kommer vi att lära oss lite mer om anpassade inläggstyper och hur du laddar deras data.


Den här funktionen är verkligen viktig på din webbplats eftersom den låter dig visa personer som rekommenderar dig. Vittnesmål är ett stort socialt bevis på din awesomeness. Och du behöver inte komplexa plugins eller mycket kod för att uppnå detta, eftersom du ser med ett par filer kan du skapa en sexig presentation för dina vittnesmål..

Låt oss komma igång då!

Blixtlås & Installera

Om du har bråttom med att kontrollera detta kan du ladda ner och installera det.

Du måste lägga till lite data då genom att lägga till några vittnesmål med de helt nya vitsord som du kan se i din instrumentpanel:

list-vittnesmål

Sedan kan du använda den grundläggande kortkoden för att ladda:

[vittnesmål rand = 0 max = 5]

När du har lagt till den koden ser du något liknande på din sida:

main-vittnesmål

Nu får vi se hur vi skapar och utforskar detta (genom att lägga till fler funktioner och ändra utseendet).

Det grundläggande

Som vi tidigare sagt måste du lägga till rubrikmetadata, skapa plugin-filen och ringa dina skript. Lång historia kort, du skapar en ny mapp under ditt wp-innehåll / plugins med ditt plugin-namn och skapar sedan en fil med samma namn som mappen som ska vara din huvud-plugin-fil.

När du har gjort den kopian och klistra in enligt följande:

<?php
/ *
Plugin-namn: vittnesmål
Beskrivning: Visa kundbedömningar.
Version: 1.0
Författare: Web Revenue Blog
Licens: GPL2
* /

// att skriva skript och stilar
function plugin_scripts () {
wp_enqueue_script ( ‘jquery’);
wp_enqueue_script (‘flexslider’, plugins_url (‘js / jquery.flexslider-min.js’, __FILE__), array (‘jquery’), ‘2.2’, falsk);
wp_enqueue_script (‘testimonials’, plugins_url (‘js / testimonials.js’, __FILE__), array (‘jquery’), ‘1.0’, falsk);
wp_enqueue_style (‘flexsliderCSS’, plugins_url (‘css / flexslider.css’, __FILE__), falskt, ‘2.2’, ‘alla’);
wp_enqueue_style (‘testimonialsCSS’, plugins_url (‘css / testimonials.css’, __FILE__), false, ‘1.0’, ‘all’);
}
add_action ("wp_enqueue_scripts","plugin_scripts");

Så här gör vi:

  • Berätta för WP vad är vår plugin-namn, författare, vad den gör
  • Skapa en funktion, där vi sätter in vanliga skript (som jQuery) och anpassade skript (som flexslider), och formatmallar
  • Berätta för WP för att ladda skriptfunktionen i dess standardskriptsamtal, så de kommer faktiskt att laddas på sidorna

Allt är ganska coolt, men glöm inte att skapa filerna under / js och / css. Du kan bara ladda ner dem i vårt demoinnehåll så att du inte behöver gräva mycket för att hitta flexslider-filerna.

Nu har vi alla grundläggande saker på plats som vi kan starta den roliga delen.

Den anpassade inläggstypen

Som standard har WordPress två vanliga inläggstyper, sidor och inlägg. Men det har också många interna inläggstyper (som bilagor), så definitionen av “inläggstyp” är: Varje typ av data du behöver lagra.

Eftersom vår plugin skapar en ny funktionalitet har WP inte en inbyggd plats att lagra det, så vi måste skapa det. Var inte rädd liten gräshoppa, det är ganska enkelt, du kan använda den här koden:

// den svarta magin för att skapa inläggstypen
funktion create_post_type () {
register_post_type (
“vittnesmål”, // ny inläggstyp
array (
“etiketter” => array (
‘name’ => __ (‘Vittnesmål’),
‘singular_name’ => __ (‘Testimonial’)
),
‘offentligt’ => true, / * Posttypen är avsedd för allmän användning. Detta inkluderar i frontend och i wp-admin. * /
“stöder” => array ( ‘titel’, ‘redaktör’, ‘thumbnail’, ‘custom_fields’),
‘hierarchical’ => falsk
)
);
}

Här använder vi bara funktionen register_post_type () för att berätta för WP “Hej kompis, vi måste lagra den här typen av data, var vänlig redo att ta emot den”.

Vi berättar också för honom att den här typen av data kallas ”vittnesmål”, de ska vara tillgängliga för allmänhetens åtkomst (så det skapar faktiskt ett nytt menyalternativ i din instrumentpanel för det), fälten som vi behöver på det och om det är hierarkiskt eller inte (som sidor som vi har förälders- och barnsidor).

Då måste vi ringa det varje gång vi laddar WordPress. Den här kroken gör det:

add_action (‘init’, ‘create_post_type’);

De anpassade fälten

Nu har vår anpassade inläggstyp titeln (personens namn), innehållet (personens vittnesmål), en bild (med bild) men det saknas en länk, eftersom om personen är trevlig nog att prata om dig, bör du åtminstone länka till deras webbplats, rätt?

Vi kan göra detta med vanliga anpassade fält, men det är mycket bättre att ha ett “stängt” fält, där användaren inte behöver skriva in fältets namn, och där du också kan lägga till några valideringsregler.

Först och främst måste vi skapa en ny metabox, som är de fina panelerna du har i ditt inläggsredigeringsområde, varje liten panel är en metabox. Den här funktionen skapar och kallar den:

// lägga till metafältet URL-adress
funktion add_custom_metabox () {
add_meta_box (‘custom-metabox’, __ (‘Link’), ‘url_custom_metabox’, ‘testimonials’, ‘side’, ‘low’);
}
add_action (‘admin_init’, ‘add_custom_metabox’);

Funktionen add_meta_box () kräver dessa parametrar:

  1. ID – Den unika identifieraren för det. Du kan använda allt unikt här som “enhörning-äta-regnbåge” eller “vittnesmål-länk”. Allt som kan användas internt
  2. Titel – Vad kommer att visas för användaren? Här är det viktigt att använda funktionen __ (), det är den funktion som tillåter användare från främmande språk att översätta ditt plugin med .po-filer (utan att redigera plugin-filer)
  3. Återuppringning – Funktionen där du har det faktiska innehållet i metaboxen
  4. Inläggstyp – I vårt fall vill vi att den ska vara synlig endast för vittnesmål
  5. Kontext – Var på sidan du vill visa den
  6. Prioritet – Om det ska vara före andra objekt med samma position eller efter dem

Nu måste vi skapa url_custom_metabox () -funktionen, eftersom vi har kallat den.

// HTML för adminområdet
funktion url_custom_metabox () {
global $ post;
$ urllink = get_post_meta ($ post->ID, ‘urllink’, sant);

// validera!
if (! preg_match ( "/ HTTP (S?): ///", $ urllink) && $ urllink! = "") {
$ fel = "Den här webbadressen är inte giltig";
$ urllink = "http: //";
}

// mata ut inkommande url-meddelande och lägg till http: // i inmatningsfältet
if (isset ($ -fel)) {echo $ -fel; }
?>

URL:

<?php
}

Ok, översätt nu detta till vanligt engelska:

  • Den globala variabeln $ post kallas, så vi kan veta vad som är POSTID för det aktuella objektet
  • Vi laddar det aktuella värdet för webbadressen
  • Vi validerar Om värdet som användaren har lagt in är giltigt. Om det finns minst en “http” eller “https” förekomst är värdet OK, annars är det giltigt och vi måste använda standardvärdet
  • Då visar vi felen, om det finns några
  • Nu börjar vi själva HTML: n och lägger till standardvärdet i inmatningsfältet som vi har i PHP

Efter denna punkt måste vi faktiskt spara det som skickas av användaren. Vi kommer att använda “save_post” -kroken, så varje gång WordPress sparar ett inlägg kommer det att kalla den här funktionen:

// sparar anpassade fältdata
funktion 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’);

Här kontrollerar vi bara om det finns några postdata som heter “webbplatslänk” som är vårt fältnamn. Om det finns en webbplatslänk, låt oss spara den.

När allt är på plats, så ser din nya vittnesida ut:

new-rekommendation

Laddar våra anpassade data

Nu måste vi faktiskt ladda våra artiklar, och vi kommer att använda funktionen get_posts (), mest för att vi bara har enkla data så att vi inte behöver en ordentlig WP-slinga (som skulle lägga till mycket DB-samtal och vi verkligen inte behöver inte det).

Så låt oss först skapa en funktion för att få vår webbplats länk, om det finns något.

// returnera URL för ett inlägg
funktion get_url ($ post) {
$ urllink = get_post_meta ($ post->ID, ‘urllink’, sant);

returnera $ urllink;
}

Nu kan vi starta kortkodsfunktionen. Ett enkelt sätt att standardisera och validera kortkoddata är att skapa attribut för loopen som en matris, så att vi kan lägga till nya objekt som vi behöver dem, så här:

// registrera kortkoden för att visa vittnesmål
funktion load_testimonials ($ a) {

$ args = array (
"post_type" => "vittnesmål"
);

if (isset ($ a [‘rand’]) && $ a [‘rand’] == true) {
$ args [‘orderby’] = ‘rand’;
}
if (isset ($ a [‘max’])) {
$ args [‘posts_per_page’] = (int) $ a [‘max’];
}
// få alla vittnesmål
$ posts = get_posts ($ args);

// HTML-UTGÅNG
}
add_shortcode ("vittnesmål","load_testimonials");

Som ni ser har vi kortkodattributen laddade och skickas till $ args-matrisen när de validerar, i det format som WordPress behöver det, så vi kan ladda inlägg med dem.

Nu måste vi lägga till någon HTML-kod där, efter flexsliders standardstruktur. Så här ser det ut:

eko ”;
echo ‘

    ‘;

    förhand ($ inlägg som $ inlägg) {
    // få tummen bild
    $ url_emony = wp_get_attachment_hops_url (get_post_ymsnail_id ($ post)->ID));
    $ link = get_url ($ post);
    echo ‘

  • ‘;
    if (! tom ($ url_tatt)) {echo ‘‘; }
    echo ‘

    ‘. $ Post->Post titel.’

    ‘;
    if (! tom ($ post)->post_content)) {echo ‘

    ‘. $ Post->POST_CONTENT.’
    ‘; }
    if (! tom ($ länk)) {echo ‘Besök webbplatsen

    ‘; }
    echo ‘

  • ‘;
    }

    echo ‘

‘;
eko ”;

Vänta, men varför skulle vi skapa HTML-koden inuti PHP-funktionen? Det beror på att vi villkorligt kan ladda innehåll bara om användaren har lagt till innehåll, så att du inte har tomma HTML-taggar, bara väntar på att röra upp din layout.

Vad sägs om sidofältet?

De flesta vill bara visa vittnesmål i sidofältet, och det här plugin fungerar inte riktigt bra eftersom textwidgets inte bearbetar kortkoder. Det finns en enkel lösning för det här, lägg bara till det i din kod:

add_filter (‘widget_text’, ‘do_shortcode’);

Vad kommer härnäst?

Så, tyckte du om den här tutorialen? Vad skulle du lägga till som ett alternativ för din vittnesmålskod? Har du några idéer för framtida inlägg? Låt oss veta med kommentaravsnittet!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map