Treci la conținutul principal

Cum de a crea un widget personalizat pe WordPress

Divi: cea mai ușoară temă WordPress de utilizat

Divi: cea mai bună temă WordPress din toate timpurile!

mai mult Descărcări 901.000, Divi este cea mai populară temă WordPress din lume. Este completă, ușor de folosit și are mai mult de șabloane gratuite 62. [Recomandat]

Doriți să vă creați propriile widget-uri personalizate pe WordPress?

Widgeturile vă permit să glisați și să fixați articole în orice bară laterală sau zonă widget pregătită de pe site-ul dvs. web. Prin urmare, în acest articol vă vom arăta cum să creați cu ușurință un widget WordPress personalizat.

Dar înainte, dacă nu ați instalat niciodată WordPress, descoperiți Cum se instalează un blog WordPress pași 7 et Cum de a găsi, a instala și a activa o temă WordPress pe blog-ul dvs. 

Apoi înapoi la motivul pentru care suntem aici.

Creați un widget personalizat pe wordpress

Ce este un widget WordPress?

Widgeturile WordPress conțin bucăți de cod pe care le puteți adăuga la barele laterale ale site-ului dvs. sau la zonele adaptate widgeturilor. Gândiți-vă la acestea ca la module pe care le puteți utiliza pentru a adăuga diferite elemente folosind o interfață simplă „Drag and Drop”.

În mod implicit, WordPress vine cu un set standard de widgeturi pe care le puteți utiliza cu orice temă WordPress. 

Descoperă și tu cele mai bune teme noastre premium WordPress.

Widgetul tabloului de bord Wordpress

WordPress permite, de asemenea, dezvoltatorilor să-și creeze propriile widget-uri personalizate. Multe teme și plugin-uri WordPress vin cu propriile lor widget-uri pe care le puteți adăuga la barele laterale.

De exemplu, puteți adăuga un formular de contact, un formular de autentificare personalizat sau o galerie foto într-o bară laterală fără a scrie niciun cod.

Acestea fiind spuse, să vedem cum să creați cu ușurință propriile dvs. widget-uri personalizate pe WordPress.

Cum de a crea un widget personalizat pe WordPress

Acest tutorial este destinat persoanelor care au cunoștințe de dezvoltare web.

Înainte de a începe, ar fi mai bine să creezi un plugin specific pe site-ul web în care lipiți codul widget pentru acest tutorial.

Creați cu ușurință site-ul dvs. web cu Elementor

Elementor vă permite să creați cu ușurință orice design de site web cu un aspect profesionist. Nu mai plătiți scump pentru ceea ce puteți face singur. [Gratuit]

Puteți, de asemenea, să lipiți codul în fișierul "funcții.php" din tema dvs. WordPress. Cu toate acestea, acesta va fi disponibil numai atunci când această temă WordPress specifică este activă.

În acest tutorial, vom crea un widget simplu care va saluta pur și simplu vizitatorii. Uitați-vă la acest cod, apoi lipiți-l în pluginul dvs. specific pentru a-l vedea în acțiune.

// Înregistrați și încărcați funcția widget wpb_load_widget () {register_widget ('wpb_widget'); } add_action ('widgets_init', 'wpb_load_widget'); // Crearea clasei de widgeturi wpb_widget extinde funcția WP_Widget {funcția __construct () {părinte :: __ construct (// ID-ul de bază al widgetului dvs. „wpb_widget”, // Numele widgetului va apărea în UI __ („BPC Widget”, „wpb_widget_domain”) , // Matrice de descriere widget ('description' => __ ('Widget WordPress simplu', 'wpb_widget_domain'),)); } // Crearea widgetului funcției widget-uri publice front-end ($ args, $ instance) {$ title = apply_filters ('widget_title', $ instance ['title']); // argumentele widget înainte și după sunt definite de teme echo $ args ['before_widget']; if (! goal ($ title)) echo $ args ['before_title']. $ titlu. $ args ['after_title']; // Aici executați codul și afișați ecoul de ieșire __ („Simple Widget”, „wpb_widget_domain”); echo $ args ['after_widget']; } // Formular de funcție publică Widget Backend ($ instance) {if (isset ($ instance ['title'])) {$ title = $ instance ['title']; } else {$ title = __ ('New title', 'wpb_widget_domain'); } // Widget formular de administrare?> get_field_id( 'title' ); ?>" name="get_field_name( 'title' ); ?>" type="text" value="" />

După adăugarea codului, trebuie să accesați „ Aspect> Widgeturi “. Veți observa noul widget " Widget BPC În lista de widget-uri disponibile. Trebuie să trageți și să plasați acest widget într-o bară laterală.

Widget personalizat Wordpress

Vizitând acum blogul dvs., veți vedea un widget în bara laterală unde ați adăugat widgetul în cauză.

Acum să aruncăm o privire la acest cod.

În primul rând, am înregistrat „ wpb_widget Și am încărcat widget-ul personalizat. Apoi, am definit ce face acest widget și cum să-l afișeze pe tabloul de bord.

În cele din urmă, am definit modul de gestionare a modificărilor aduse widget-ului.

Acum, puteți dori să știți câteva lucruri. De exemplu, care este obiectivul " wpb_text_domain "?

WordPress folosește „gettext” pentru a gestiona traducerea și localizarea. Deci " wpb_text_domain „și __e spune gettext cum să regăsească un șir de traducere dacă există.

Dacă creați un widget personalizat pentru tema dvs. WordPress, puteți înlocui „wpb_text_domain” cu textul domeniului temei.

Descoperiți și câteva plugin-uri premium WordPress  

Puteți utiliza alte plugin-uri WordPress pentru a da un aspect modern și a optimiza aderența blogului sau a site-ului dvs. web.

Vă oferim aici câteva plugin-uri WordPress premium care vă vor ajuta să faceți asta.

1. Galaxy Funder

Galaxy Funder este un sistem de crowdfunding cu multe funcții, conceput pentru orice site web WooCommerce. Utilizând pluginul premium Galaxy Funder WordPress, veți putea să vă gestionați propriul site de crowdfunding sau să adăugați campanii de strângere de fonduri în antetul magazinului dvs. online WooCommerce.

Galaxy funder woocommerce crowdfunding system plugin plugin wordpress

Puteți utiliza, de asemenea, orice gateway de plată suportat de WooCommerce. Vă rugăm să rețineți că „Galaxy Funder” funcționează direct pe pagina magazinului online, ceea ce facilitează procesul de contribuție a utilizatorului.

Descarca | Demoweb hosting

2. Faceți clic pe chatul WhatsApp

Pluginul premium WordPress Faceți clic pe WhatsApp Chat permite clienților WordPress să se conecteze ușor cu proprietarul site-ului sau asistența clienților utilizând contul WhatsApp. 

Faceți clic pe chatul WhatsApp pentru pluginul wordpress

Doar faceți clic pe contul WhatsApp și va fi direcționat direct către contul WhatsApp mobil cu un mesaj implicit. Și dacă clientul este pe desktop sau laptop, va fi redirecționat către WhatsApp Web.

Acest plugin necesită numărul WhatsApp, ora și ziua, pe care proprietarul site-ului web sau echipa de asistență le va folosi pentru a discuta. Butonul Chat poate fi adăugat la pagina de detalii a produsului WooCommerce, care este direct legat de acest produs.

Descarca | Demo | web hosting

3. Descărcați Image Watermark

Acest plugin premium WordPress vă permite să adăugați cu ușurință filigrane la imaginile dvs. Descărcări ușoare digitale.filigran ușor digital-fișier-imagine-descărcare

Ces filigrane poate fi o imagine simbol a dreptului de autor, a logoul companieisau o parte a marcării ca imagine PNG transparentă.

Descarca | Demo | web hosting

Alte resurse recomandate

De asemenea, vă invităm să consultați resursele de mai jos pentru a merge mai departe în controlul și controlul site-ului și blogului dvs.

Concluzie

Voila! Asta este totul pentru acest tutorial, sper că vă va permite să creați widget-uri personalizate pe blogul dvs. WordPress. Dacă ai comentarii sau sugestii, nu ezitați să ne informați în secțiunea rezervată.

Cu toate acestea, veți putea, de asemenea, să ne consultați Resurse, dacă aveți nevoie de mai multe elemente pentru a vă derula proiectele de creare a site-urilor de internet, consultați ghidul nostru cu privire la Creare blog WordPress sau cea de pe Divi: cea mai bună temă WordPress din toate timpurile.

Dar între timp, împărtășește acest articol pe diferitele rețele de socializare

...  

Acest articol conține comentarii 0

Lasă un comentariu

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate *

Acest site folosește Akismet pentru a reduce nedorite. Aflați mai multe despre modul în care sunt utilizate datele dvs. de comentarii.

Inapoi in top
10 acțiuni
acțiune8
tweet1
Registru1