WordPress' søkemotor er elendig
Jeg kjenner ingen som bruker WordPress som snakker godt om søkemotoren, og jeg forstår fortsatt ikke at den knapt har utviklet seg siden de første versjonene.
Ikke bare er den primitiv i bruk, den tilbyr heller ingen konfigurasjon overhodet. Til og med utseendet på resultatsiden overlater mye å ønske. Avhengig av hvilken mal du bruker, kan den ha et litt bedre design, men generelt sett er den fortsatt forhistorisk.
Utseendet på resultatene kan forbedres litt med CSS og responsen med en gratis plugin (med en betalt versjon) som Relevanssi (selv om det vil tredoble vekten av databasen din) eller denne som kobler seg til Algolias eksterne tjeneste (gratis opptil 10 000 søkeforespørsler per måned).
Men jeg lar ytelsesproblemet ligge til en annen dag, ettersom jeg fortsatt sliter med det, og tar meg av de rent estetiske reformene ved hjelp av GeneratePress (GP) og GenerateBlocks (GB).
GeneratePress og GenerateBlocks
GP og GB er fortsatt to verktøy fra et ungt prosjekt med mye brukervennlighet å forbedre, GB tilbyr ikke den samme læringskurven som du kanskje forventer hvis du kommer fra å bruke byggere som Elementor eller lignende.
Som vi vil se i dette eksemplet, er noen prosesser for å bygge visse ting med GenerateBlocks mye lengre og mer arbeidskrevende og kan være litt desperate i de første forsøkene. Etter hvert som vi legger til flere og flere blokker, blir ting mer kompliserte.
Til gjengjeld, når du forstår hvordan de fungerer og får tak i dem, har du mye mer kontroll over hvordan hvert enkelt element ser ut.
Vanskelighetsgraden balanseres av dokumentasjonen og den upåklagelige supporten, der skaperne til og med gir en hånd for spesifikke designproblemer som ikke er innenfor deres kompetanse, så det er fortsatt et flott alternativ å ta i betraktning ettersom de forblir trofaste mot sin filosofi; rettferdig, ren og lett kode.
Blokker elementer
Blocks Elements, heretter kalt Elements, ble lagt til i juli 2020 i GeneratePress Premium versjon 1.11.0. Den kan brukes som en vanlig krok for å sette inn innhold nesten hvor som helst på bloggen din uten å måtte flikke med kode.
I kombinasjon med GenerateBlocks kan du bruke WordPress-blokkeredigereren til å lage kroker, topptekster, bunntekster, sidefelt, en "Hero"-side, innholdsmaler osv.
Til poenget.
Mal for struktur
Det første vi skal gjøre, er å opprette det vi kaller en "strukturmal". Dette trinnet er valgfritt, men det er lurt å opprette en i tilfelle vi ønsker å endre noe med et par klikk.
Jeg gir det dette navnet fordi det bare vil definere strukturelle aspekter og ikke innholdet. Det vil si om vi vil vise eller ikke vise toppteksten, bunnteksten eller widgetene, et sidefelt eller definere bredden osv., og slik at vi ikke roter med navnene på blokkene i resten av trinnene.
Fra hovedmenyen Utseende/Elementer eller fra den øvre delen har vi tilgang til oppretting og administrasjon av elementene.
Når vi legger til et nytt element, velger vi Design og trykker på opprett.
Deretter forteller vi Element hvilken side vi vil at det skal brukes på. For å gjøre dette går vi til fanen "Regler som skal vises" og velger "søkeresultater" i rullegardinmenyen.
Elementene gir mange tilpasningsmuligheter. Som du vil se, kan du i denne rullegardinmenyen velge de fleste posisjonene på bloggen din, slik at disse innstillingene kan brukes der.
Vi kan også bestemme hvilke elementer vi vil skjule. I mitt tilfelle skal jeg bare bruke ett alternativ for å unngå sidefeltet, så jeg velger"Content (No sidebars)".
Det finnes andre måter å skjule sidefeltet på, men denne er ikke bare den enkleste og raskeste, den gjør det også mulig å gå tilbake til det opprinnelige utseendet ved å gå tilbake hit eller direkte "avpublisere" dette elementet/denne malen til "Utkast"-status.
I tillegg kan du bruke"Deaktiver elementer"-fanen til å la siden være praktisk talt ren. Du kan si at den tilsvarer Elementors "Canvas"-sidemal, bare litt forbedret og enklere å bruke.
En god praksis, som også anbefales i en av konfigurasjonsfanene, er å dokumentere hva hvert element gjør med interne notater i tilfelle tittelen ikke er beskrivende nok, eller vi ikke ønsker at den skal være for lang.
Jeg har blitt vant til å legge til notater og kommentarer til alt, for når man gjør mange endringer over tid, er det uunngåelig at man til slutt glemmer hvor og/eller hvordan de ble gjort. I interne notater har du alltid all informasjonen du trenger for å finne tilbake til trinnene dine hvis noe går galt, eller hvis du vil gjøre nye endringer.
Ved å publisere denne malen vil vi allerede ha konfigurert resultatsiden slik vi ønsker, men den vil selvfølgelig være tom når det gjøres et søk, fordi vi må opprette og publisere et nytt element som bestemmer hvordan disse søkene skal se ut.
Du kan la denne malen ligge som utkast mens vi gjør dette, og publisere den når alt er klart.
Mal for utseende
Selv om det bare er et annet element, kaller jeg det en "utseendemal" i denne lille guiden fordi jeg på den tiden var litt forvirret over nomenklaturen for hver ting og de ulike bruksmulighetene.
Det er her det virkelige arbeidet med personalisering begynner.
Vi oppretter et nytt element, denne gangen en Block, og gir det et beskrivende navn.
Vi legger til en GenerateBlocks-container, og inni denne containeren plasserer vi en "Query Loop"-blokk.
Og det er dette vi vil se.
Jeg har valgt"Start blank" for å gjenskape den opprinnelige strukturen i resultatene, men du kan velge hvilken som helst av malene som tilbys i denne blokken.
Det beste du kan gjøre er å prøve dem ut før du bestemmer deg, for når du først har begynt å jobbe med en av dem, kan du ikke bruke en annen, og du må starte hele prosessen fra bunnen av hvis du vil endre den (noe som GB bør løse).
Når du har valgt mal, velger du spørringsløyfeblokken (1), og du vil se fanen "Block" til høyre (2). Klikk på den og merk av for alternativet"Arv spørring framal" (3) under "Spørringsparametere". Til slutt, nederst, under "Visningsregler" / "Posisjon" (4), søker vi og angir "Søkeresultater" og lagrer som et utkast.
Når vi bretter ut spørringsløyfen, vil vi se dette:
Legg til en ny rutenettblokk under "Query template", og velg strukturen du vil ha.
I eksemplet bruker vi en av to containere som fungerer som kolonner. Den venstre kolonnen vil være stedet for det uthevede bildet, og den høyre kolonnen vil vise utdraget av oppføringen (utdrag).
Du kan også leke med tre containere og konfigurere den midterste som et rom. Jeg insisterer, mulighetene er mange, og det beste du kan gjøre er å leke med dem.
Som du kanskje har lagt merke til, bygger vi nesten fra bunnen av en container med alle delene som skal utgjøre det endelige utseendet til det vi ønsker å vise. I dette tilfellet søkeresultatene, men det kan gjøres med hvilket som helst annet innhold.
Nå angriper vi de to containerne.
Vi velger den første beholderen og setter bredden til 33 (som faktisk er satt til 33,33), som du vil se hvis du blar ned til størrelsesalternativene.
Vi gjør det samme med den andre beholderen og velger 66 (som automatisk blir satt som 66,66). Poenget er selvsagt at alle beholderne som brukes, summerer seg til 100, slik at de ikke går utenfor det horisontale området på siden og vises på samme linje.
Når den første containeren er valgt, legger vi til en GenerateBlocks-bildeblokk i den.
Det som skjer da, er at forskjellige bildeområder vises. Ikke få panikk, det er fordi blokken oppdager sløyfen og gjenskaper oppførselen. Hvis søkemotoren din viser ti resultater, er det disse mellomrommene som vises. Bare fortsett å jobbe med bildecontaineren, og hopp over mye av resten, som ikke er noe annet enn forhåndsvisningen av resultatsiden.
Velg beholderen som inneholder bildet igjen (1). I menyen i blokken til høyre går vi ned til "Aktiver dynamiske data og aktiverer den (2). Velg "Utvalgt bilde" i Bakgrunnskilde (3), og bildene vises i redigeringsprogrammet.
I lenkekilde velger vi "Individuell lenke" (4), slik at hvert bilde lenker til det tilhørende innlegget, og vi lagrer igjen som en kladd.
Nå går vi til den andre containeren, velger den og legger til en "Headline"-blokk fra GenerateBlocks.
Velg blokken "Overskrift" (1) med de dynamiske dataene aktivert (2), og gjenta forrige prosess (3), men denne gangen velger du "Tittel" som kilde til innholdet (4) og en individuell oppføring i lenkekilden (5).
Til slutt legger vi til en ny "Title"-blokk nedenfor, som vil bli brukt til å vise utdraget av oppføringen ved å følge disse trinnene.
Når den er lagt til, gjentar vi den samme prosessen igjen. Med denne nye blokken valgt (1) aktiverer vi de dynamiske dataene (2) og som datakilde (3) den aktuelle oppføringen og innholdskilden "Extract" (4). Nå kan du også angi lengden på utdraget i ord (5).
Til slutt legger vi til pagineringen, som vil vises under resultatene. Dette gjør du ved å velge spørringsblokken (1) og klikke på det lille +-symbolet med prikkene som du finner i redigeringsfeltet (2).
Pagineringen er bygget med en blokk med knapper som du må gi det formatet, fargen og formen som passer til utseendet du er ute etter. Alle de mulige konfigurasjonene, som ikke er få, finnes i blokkens meny, der du alltid har muligheten til å finjustere hver blokk for mobil, nettbrett og desktop.
Jeg skal la det stå her for ikke å forlenge dette innlegget for mye.
Jeg anbefaler deg å gjøre alt dette først i et testmiljø for å se hvordan det virkelig fungerer utover forhåndsvisningen som tilbys av redigeringsprogrammet, og publiser det når du er sikker på at det vises slik det skal.
Husk også at hvis du har laget den designblokken som ble foreslått i begynnelsen, og som vi kalte strukturmalen som vi hadde liggende i utkast, må du publisere den.
Dette er utgangspunktet for å tilpasse utseendet på resultatsiden ytterligere, avhengig av dine estetiske preferanser.
Mange muligheter for personlig tilpasning
Du kan fortsette å legge til eller redigere hva du vil, for eksempel en rutenettblokk med to containere mellom tittelen og utdraget, og legge til publiseringsdatoen, navnet på forfatteren av oppføringen eller hva du måtte ønske.
Hvis du er klar for det, kan du til og med lage en ny mal for den kjedelige standardsiden når WordPress ikke finner resultater når du søker, og legge til informasjonsbokser eller andre elementer som hjelper den besøkende med å finne det han eller hun leter etter.
Du kan endre skrifttype og -størrelse, justere den til den ene eller andre siden, justere avstanden og dimensjonene på elementene, leke med bakgrunnsfargen ved å legge til bilder og figurer, legge til ikoner, rammer, sveveeffekter på lenkene, skygger på beholderne osv.
Alt dette uten å forlate redigeringsprogrammet, og uten å måtte fikle med CSS eller røre malfilene dine.
Her kan du prøve den grunnleggende utformingen av søkeresultatene mine, som jeg fortsatt må finpusse på noen få ting, som å legge til lesetid og antall besøk, skrive de tomme utdragene og legge til de manglende bildene.
Bonusball: Hvis du trenger å legge til den typiske"Viser (antall) resultater for: ( søkeord)"-frasen i resultatene , finner du her den nødvendige koden og instruksjonene for å få det til å fungere med Query Loop-blokken din, takket være David fra GB-support.
