Comentariile joacă un rol crucial în construirea unei comunități pe internet. Comentariile oferă o platformă de interacțiune pentru cititorii dvs., unde își pot împărtăși gândurile, ceea ce îi face foarte des să își dorească să revină.

Există mai multe modalități de a încuraja utilizatorii să lase un comentariu pe blogul dvs. Una dintre aceste modalități este de a crea un formular de comentarii frumos, utilizabil și accesibil.

În acest tutorial, vă vom arăta cum să stilizați formularul implicit de comentarii WordPress, vă vom arăta, de asemenea, cum să adăugați funcționalitatea comentariilor prin ID-uri de social media și cum să creați funcționalitatea de abonare la comentarii și multe altele. Mai Mult.

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.

Cum de a schimba stilul de comentarii WordPress

Când vorbim despre stil, ne referim la Partea CSS a lucrului. Mai jos, vă voi arăta cum să personalizați aspectul formularului de comentarii în WordPress. Fiecare element implicit pe WordPress are un cod CSS, acesta este cazul listei de comentarii, meniuri de navigare, formularul de comentarii, widget-uri și altele.

Printre dosarele de Teme WordPress, avem un fișier numit comments.php care este folosit pentru a afișa comentarii și formularul de comentarii pe postări și pagini de blog. Pentru a afișa formularul de comentarii WordPress, „ comment_form () Este folosit.

Descopera Cum de a găsi link-ul la pagina de conectare WordPress

În mod implicit, această funcție generează formularul de comentariu cu trei câmpuri de text (nume, e-mail și site-ul web), o casetă de text mare, pentru conținutul comentariului și butonul de trimitere.

Puteți modifica cu ușurință fiecare dintre aceste elemente doar manipulând clasele și identificatorii CSS impliciți. Iată o listă a claselor CSS implicite pe care WordPress le adaugă la fiecare formular de comentarii.

#comment {# # #} {# # # # comentariu # răspuns-link {} #comment # .Cum-form-autor {} .comment-form-mail} permis-.form-tag-uri {} {{.Cum-form-cum {.Cum-form-url}} .form-submit

Prin simpla ajustare a acestor clase CSS, puteți schimba complet aspectul formularului de comentarii. Să încercăm să schimbăm ceva pentru a vă face o idee despre ce putem face.

Descopera Cum să înlocuiți legăturile de imagine după instalarea SSL pe WordPress

În primul rând, vom începe prin a evidenția câmpul activ din formular. Prin evidențierea câmpurilor active, utilizatorii pot vedea cu ușurință ce modifică și oferă o parte dinamică puțin site-ului dvs. web.

#respond {background: #ececec; umplutură: 0 5px 0 5px; } / * Sublinierea câmpul text activ * / intrare #respond [type = text] textarea {-webkit-tranziție: toate 0.30s ușurința in-out; -moz-tranziție: toate 0.30-urile ușurează-out-out; -ms-transition: toate dispozitivele 0.30 easy-in-out; -o-tranziție: toate 0.30-uri ușurează-out-out; contur: nici unul; umplutură: 3px 0px 3px 3px; margine: 5px 1px 3px 0px; frontieră: 1px solid #DDDDDD; } #respond input [type = text]: focus, textarea: focus {box-umbra: 0 0 5px RGBA (81, 203, 238, 1); margine: 5px 1px 3px 0px; frontieră: 1px solid rgba (81, 203, 238, 1); }

Iată cum va arăta formularul dvs. de comentariu cu Twenty Twelve.

Cu ajutorul acestor clase, puteți schimba modul în care textul apare în câmpuri. Aceasta este ceea ce vom face în exemplul următor.

#author {font-family: Lobster, "Lobster 1.4", "Droid Sans", Arial; font-size: 16px; Culoare: #1d1d1d; literă Spațiere: .1em; } #url {culoare: #21759b; font-family: "Luicida Console", "Courier New", "Curier", minivan; } 

Iată rezultatul pe care îl va produce codul anterior.

De asemenea, puteți schimba stilul butonului formular de comentarii. În exemplul următor, îi vom oferi un fundal de gradient.

#submit {font-family: Arial; culoare: #ffffff; font-size: 20px; padding: 10px; text-decoration: nici unul; box-shadow: 0px 1px 3px #666666; -webkit-box-shadow: 0px 1px 3px #666666; -moz-box-shadow: 0px 1px 3px #666666; text-umbra: 1px 1px 3px #666666; fundal: -webkit gradient (liniar, 0 0, 0 100%, de la (#006ad4) la (#003366)); fundal: -moz-linear-gradient (top, #006ad4, #003366); } #submit: hover {background: -webkit gradient (liniar, 0 0, 0 100%, de la (#003366) la (#006ad4)); fundal: -moz-linear-gradient (sus, #003366, #006ad4)}

Iată rezultatul care va fi afișat.

Cum se adaugă interacțiunea socială în comentarii

Să începem cu adăugarea de conectări sociale la formularul de comentarii WordPress. Primul lucru pe care trebuie să-l faceți este să instalați și să activați pluginul Intrare

Descopera Cum se instalează un plug-in WordPress Pentru a activa acest plugin, trebuie să creați un cont gratuit accesând următoarea adresă: https://app.oneall.com

După ce ați făcut acest lucru, nu va trebui să configurați un API pentru fiecare rețea pe care doriți să o utilizați pentru a permite utilizatorilor să se conecteze prin intermediul acestora.

Deși API-urile diferitelor rețele sociale se schimbă constant, nu va trebui să faceți nimic, dezvoltatorii acestui plugin își vor actualiza API-urile pentru dvs. Tot ce trebuie să faceți este să vă conectați la API-ul OneAll.

Așa se vor afișa formularele dvs.

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

Puteți folosi altele WordPress plugin-uri pentru a oferi un aspect modern și pentru a optimiza gestionarea blogului sau site-ului dvs.

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

1. Căutare instantanee WP și sugestie automată

Pluginul „WP Instant Search & Auto Suggest” vă permite să obțineți instantaneu sugestii pentru articole, pagini și tipuri de postări personalizate atunci când căutați pe blogul dvs. WordPress. Funcționează cu WPBakery et Cornerstone.

Caracteristicile sale includ: rcăutare în modul ecran complet, rCăutare instantanee pentru tipuri de publicații personalizate, compatibilitate cu Compozitor Visual, Ttrei stiluri de design integrate, scheme de culori 5 din care să alegeți, pagsuport pentru mouse și tastatură, de excomplet personalizabil prin parametri etc ...

Descarca | Demo | web hosting

2. Pagină de eroare 404 Redirecționați către pagina de pornire sau pagina personalizată

Iată una dintre cele mai bune modalități de a adăuga cu ușurință o pagină de eroare 404 care va redirecționa vizitatorul către pagina de pornire sau pagina personalizată, după activarea acestei WordPress plug-in.

Toate paginile de eroare 404 vor fi redirecționate către pagina de pornire sau către o adresă URL personalizată. Folosind aceasta WordPress plug-in, veți permite Google să reducă pagerank-ul site-ului dvs. dacă are multe pagini de eroare 404.

Ce WordPress plug-in nu face doar redirecționare, ci poate fi și o soluție potrivită pentru a îmbunătăți clasarea site-ului dvs. în rezultatele motoarelor de căutare.

Descarca | Demo | web hosting

3. Legate de posturi Pro 

Related Posts Pro oferă o soluție simplă, dar puternică, pentru tot felul de conținut similar de pe WordPress. Acceptă tipuri de postări personalizate, multisite, categorii, conținut mixt, conținut personalizat și multe altele ...

Ca caracteristici pe care le oferă printre altele: 3 diferite tipuri de machete, Șabloane predefinite 65 pentru fiecare aspect, anu va fi necesară o codificare, suportul lui tnavigare și redare automată, compatibilitate cu tipurile de post personalizate utilizate de pluginuri WooCommerce, Comerț electronic WP, bbPress etc ..., a bara de căutare cu filtru, a ddocumentație foarte descriptivă și multe altele.

Descarca | Demo | web hosting

Resurse recomandate

Aflați despre alte resurse recomandate pentru a vă ajuta să construiți și să gestionați site-ul dvs. web.

• Cum de a afișa descrierea categoriilor pe WordPress
• Cum să optimizați fișierul dvs. Robots.txt WordPress pentru un SEO perfect
• Cum se creează o piață cu WordPress
• Cum de a adăuga un widget la antetul de blog-ul dvs. WordPress

Concluzie

Aici ! Gata pentru acest tutorial. Sperăm că acest articol v-a ajutat să faceți formularele de feedback mai atractive. Nu ezitați să ne oferiți și sfaturi despre personalizarea WordPress și, mai ales împărtășește acest articol cu ​​prietenii de pe rețelele de socializare preferate. 

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.

Dacă aveți sugestii sau observații, lăsați-le în secțiunea noastră comentarii.

...