Motorul de căutare WordPress este nașpa
Nu cunosc pe nimeni care să folosească WordPress care să vorbească de bine despre motorul de căutare și încă nu înțeleg că acesta abia a evoluat de la primele versiuni.
Nu numai că este primitiv din punct de vedere al modului în care funcționează, dar nu oferă nici un fel de configurare. Chiar și aspectul paginii sale de rezultate lasă mult de dorit. În funcție de șablonul pe care îl folosiți, poate avea un design ceva mai bun, dar în general este încă preistoric
Aspectul rezultatelor poate fi îmbunătățit puțin cu CSS și capacitatea de răspuns cu un plugin gratuit (cu o versiune cu plată) precum Relevanssi (deși va tripla greutatea bazei de date) sau acest alt plugin care se conectează cu serviciul extern Algolia (gratuit până la 10.000 de cereri de căutare pe lună).
Dar voi lăsa problema performanțelor pentru altă zi, deoarece încă mă lupt cu ea și mă voi ocupa de reformele pur estetice folosind GeneratePress (GP) și GenerateBlocks (GB).
GeneratePress și GenerateBlocks
GP și GB sunt încă două instrumente ale unui proiect tânăr, cu multă utilitate de îmbunătățit, GB nu oferă aceeași curbă de învățare la care v-ați putea aștepta dacă veniți de la utilizarea unor constructori precum Elementor sau similar.
După cum vom vedea în acest exemplu, unele procese pentru a construi anumite lucruri cu GenerateBlocks sunt mult mai lungi și mai laborioase și pot fi un pic disperate la primele încercări. Pe măsură ce adăugați din ce în ce mai multe blocuri, lucrurile devin mai complicate.
Pe de altă parte, odată ce înțelegeți cum funcționează și vă familiarizați cu ele, aveți mult mai mult control asupra aspectului și senzației fiecărui element.
dificultatea este echilibrată de documentația sa și de un suport impecabil în care creatorii săi chiar ajută cu probleme specifice de design care nu sunt de competența lor, astfel că este totuși o alternativă excelentă de luat în considerare, deoarece rămân fideli filozofiei lor; cod corect, curat și ușor.
Elemente de bloc
Blocks Elements, denumit în continuare Elements, a fost adăugat în iulie 2020 în GeneratePress Premium versiunea 1.11.0. Acesta poate fi folosit ca un cârlig normal pentru a insera conținut aproape oriunde pe blogul dvs. fără a fi nevoie să vă jucați cu codul.
Atunci când este combinat cu GenerateBlocks, vă permite să utilizați editorul de blocuri WordPress pentru a crea cârlige, anteturi, subsoluri, bare laterale, o pagină "Hero", șabloane de conținut etc.
Să trecem la treabă.
Șablon de structură
Primul lucru pe care îl vom face este să creăm ceea ce vom numi un "șablon de structură". Acest pas este opțional, dar nu strică să creăm unul în cazul în care într-o zi vrem să schimbăm ceva cu câteva click-uri.
Îi dau acest nume pentru că va defini doar aspectele structurale și nu și conținutul său. Adică, dacă vrem să arătăm sau nu antetul, footer-ul sau widgeturile sale, o bară laterală sau să definim lățimea etc., și pentru a nu ne încurca cu numele blocurilor din restul pașilor.
Din meniul principal Appearance/Elements sau din partea de sus, putem accesa crearea și gestionarea elementelor.
Pentru utilizarea specifică care ne interesează, la adăugarea unui nou element alegem Design și apăsăm butonul de creare.
Apoi îi spunem elementului pe ce pagină dorim să fie aplicat. Pentru a face acest lucru, ne deplasăm la fila "Reguli de afișat" și în poziție selectăm "rezultate de căutare" din lista derulantă.
Elementele oferă o mulțime de posibilități de personalizare. După cum veți vedea, în acea listă derulantă puteți selecta majoritatea pozițiilor din blogul dumneavoastră pentru a aplica aceste setări acolo.
De asemenea, putem decide ce elemente dorim să ascundem. În cazul meu, voi folosi doar o singură opțiune pentru a renunța labara laterală, așa că selectez"Content (No sidebars)".
Există și alte modalități de a ascunde bara laterală, dar aceasta, pe lângă faptul că este cea mai simplă și mai rapidă, ne permite să revenim asupra oricărei modificări prin simpla revenire aici sau direct "unpublishing" a acestui element/șablon la starea "Draft", readucând astfel pagina pe care este aplicat la aspectul inițial.
În plus, în fila"Deactivate Elements" puteți lăsa pagina practic curată. S-ar putea spune că este echivalentul șablonului de pagină "Canvas" de la Elementor, chiar și ușor îmbunătățit și mai simplu de utilizat.
O bună practică, care este recomandată și în una dintre filele de configurare, este să documentăm ce face fiecare Element cu note interne, în cazul în care titlul nu este suficient de descriptiv sau nu vrem să fie prea lung.
Eu m-am obișnuit să adaug note și comentarii la orice lucru, deoarece atunci când faci multe modificări și în timp este inevitabil să ajungi să uiți unde și/sau cum au fost făcute. Astfel, în notele interne veți avea întotdeauna toate informațiile de care aveți nevoie pentru a vă reface pașii dacă ceva nu merge bine sau dacă doriți să faceți noi modificări.
Prin publicarea acestui șablon, am avea deja pagina de rezultate configurată după bunul nostru plac, dar, desigur, acum ar fi goală atunci când se face o căutare, deoarece trebuie să creăm și să publicăm un nou element care va determina aspectul acestor căutări.
Puteți lăsa acest șablon în draft pentru moment în timp ce facem acest lucru și îl puteți publica atunci când totul este gata.
Șablon de aspect
Deși acesta este doar un alt element, l-am numit "șablon de aspect" pentru acest mic ghid, deoarece la momentul respectiv am fost puțin confuz de nomenclatura lucrurilor și de diferitele lor utilizări posibile.
Aici începe adevărata muncă de personalizare.
Creăm un nou element, de data aceasta un Bloc și îi dăm un nume descriptiv.
Adăugăm un container GenerateBlocks și în interiorul acestuia punem un bloc Query Loop.
Și asta este ceea ce vom vedea.
Eu am ales"Start blank" pentru a reproduce structura nativă a rezultatelor, dar puteți alege oricare dintre șabloanele pe care le oferă acest bloc.
Cel mai bine este să le încercați înainte de a vă decide, deoarece odată ce ați început să lucrați cu unul dintre ele nu veți mai putea aplica altul și va trebui să începeți întregul proces de la zero dacă doriți să îl schimbați (lucru care ar trebui să rezolve GB).
După ce ați ales șablonul, selectați blocul de buclă de interogare (1) și veți vedea fila "Block" din dreapta (2). Faceți clic pe el și bifați opțiunea"Inherit query from template" (3 ) la "Query parameters" (Parametrii de interogare). În cele din urmă, în partea de jos, la "Reguli de afișare"/"Poziție" (4), căutăm și setăm "Rezultate căutare" și salvăm ca proiect.
Când desfășurăm bucla de interogare, vom vedea acest lucru:
Adăugăm un alt bloc de grilă în interiorul "Query Template" și selectăm structura pe care o dorim.
Pentru exemplu, vom folosi unul dintre cele două containere care vor acționa ca coloane. Coloana din stânga va fi locul pentru imaginea prezentată, iar coloana din dreapta va afișa extrasul intrării.
De asemenea, vă puteți juca și cu trei containere și configurați-l pe cel central ca spațiu. Insist, posibilitățile sunt multe și cel mai bine este să vă jucați cu ele.
După cum probabil ați observat, construim aproape de la zero un container cu toate piesele care vor compune aspectul final a ceea ce dorim să arătăm. În acest caz, rezultatele căutării, dar puteți face acest lucru cu orice alt conținut.
Acum să golim aceste două containere.
Selectăm primul container și îi setăm lățimea la 33 (care este de fapt setată la 33,33), după cum veți vedea dacă veți derula în jos la opțiunile de redimensionare.
Facem același lucru cu cel de-al doilea container și selectăm 66 (care va fi setat automat la 66,66). Evident, ideea este ca toate containerele pe care le folosiți să se adune la 100, astfel încât să nu iasă din spațiul orizontal al paginii și să fie afișate pe aceeași linie.
Acum, cu primul container selectat, adăugăm un bloc de imagine GenerateBlocks în interiorul acestuia.
Ceea ce se va întâmpla atunci este că vor apărea spații de imagine diferite. Nu intrați în panică, acest lucru se datorează faptului că blocul detectează bucla și îi recreează comportamentul. Dacă motorul de căutare afișează zece rezultate, acestea sunt spațiile care vor apărea. Continuați să lucrați doar la containerul de imagini, trecând mare parte din restul, care nu este altceva decât previzualizarea paginii de rezultate.
Selectăm din nou containerul care conține imaginea (1). În meniul blocului din dreapta coborâm la "Enable dynamic data" și îl activăm (2). Selectăm "Featured image" în Background image source (3) și imaginile vor apărea în editor.
În sursa de link alegem "Link individual" (4), astfel încât fiecare imagine să se lege la postarea corespunzătoare și salvăm din nou ca proiect.
Acum mergem la al doilea container, îl selectăm și adăugăm un bloc "Headline" din GenerateBlocks.
Selectăm blocul "Headline" (1) cu datele dinamice activate (2 ) și repetăm procesul anterior (3), dar de data aceasta selectând "Title" ca sursă a conținutului (4) și intrarea individuală în sursa linkului (5)
În cele din urmă, vom adăuga un alt bloc "Titlu" mai jos, pe care îl vom folosi pentru a afișa extrasul intrării în urma acestor pași.
Odată adăugat, vom repeta din nou același proces. Cu acest nou bloc selectat (1), activăm datele dinamice (2 ) și ca sursă a datelor (3) intrarea curentă și sursa de conținut "Extract" (4). Acum se poate seta și lungimea extrasului în cuvinte (5).
În cele din urmă vom adăuga paginarea, care va apărea sub rezultate. Pentru a face acest lucru, selectați blocul de buclă de interogare (1) și faceți clic pe micul simbol + cu puncte pe care îl veți găsi în bara de editare (2).
Paginarea este construită cu un bloc de butoane cărora va trebui să le dați formatul, culoarea și forma care se potrivește aspectului pe care îl căutați. Toate configurațiile posibile, care nu sunt puține, se află în meniul blocului în care veți avea mereu opțiunile de a ajusta fin fiecare bloc pentru mobil, tabletă și desktop.
Mă voi opri aici pentru a nu extinde prea mult această postare.
Vă sfătuiesc să faceți toate acestea mai întâi într-un mediu de test pentru a vedea cum funcționează cu adevărat dincolo de previzualizarea oferită de editor și să le publicați atunci când sunteți siguri că arată așa cum trebuie.
Nu uitați de asemenea că dacă ați făcut acel bloc de design propus la început și pe care îl numim Șablon de structură pe care l-am lăsat în draft, va trebui să îl publicați.
Acesta ar fi punctul de plecare pentru a personaliza în continuare aspectul paginii de rezultate în funcție de preferințele dvs. estetice.
O mulțime de posibilități de personalizare
Puteți continua să editați sau să adăugați orice doriți, cum ar fi un bloc grilă cu două containere între titlu și extras și să adăugați acolo data publicării, numărul autorului articolului sau orice altceva doriți.
Dacă aveți chef, puteți chiar să creați un alt șablon pentru acea pagină implicită și fadă atunci când WordPress nu găsește rezultate la căutare și să adăugați butoane de ajutor sau orice alt element care ajută vizitatorul.
Puteți schimba tipul și dimensiunea fontului, îl puteți justifica într-o parte sau alta, puteți ajusta spațierea și dimensiunile elementelor, vă puteți juca cu culoarea de fundal prin adăugarea de imagini și forme, puteți adăuga pictograme, margini, efecte de hover pe link-uri, umbre pe containere etc.
Toate acestea fără a părăsi editorul și fără a fi nevoit să vă jucați cu CSS sau să atingeți fișierele șablon.
Aici puteți încerca aspectul de bază al rezultatelor căutării mele, pe care mai am de șlefuit câteva lucruri, cum ar fi adăugarea timpului de citire și a numărului de vizite, scrierea extraselor goale și adăugarea imaginilor recomandate care lipsesc.
Extra ball: Dacă aveți nevoie să adăugați la rezultate tipicul "Afișează (număr) rezultate pentru: (cuvânt căutat)", aici puteți găsi codul necesar codul și instrucțiunile pentru a-l face să funcționeze cu blocul Query Loop, mulțumită lui David de la asistența GB
