Om ditt sökfält är undanskymt i en sidopanel eller sidfot kan dina besökare ha svårt att hitta ditt innehåll eller navigera på din webbplats.
Enligt vår erfarenhet av att hantera många WordPress-webbplatser kan en välplacerad sökfält göra stor skillnad för användarnas engagemang och webbplatsnavigering.
Vi har testat detta på dussintals webbplatser, och resultaten är alltid desamma: när användare kan söka direkt från huvudmenyn, interagerar de mer och stannar längre. Det är en liten justering som leder till stora förbättringar.
Redo att göra din WordPress-webbplats mer användarvänlig? I den här steg-för-steg-guiden visar vi dig exakt hur du lägger till en sökfält i din WordPress-meny, utan kodning.
Varför lägga till ett sökfält i WordPress navigeringsmeny?
En sökfält hjälper användare att hitta det de letar efter utan att lämna din WordPress-webbplats. Detta kan förbättra användarupplevelsen, hålla besökare på din webbplats längre och öka engagemanget.
Därför rekommenderar de flesta webbdesigners och experter att lägga till en sökfält i navigeringsmenyn, där användarna enkelt kan hitta den.
Beroende på vilket tema du använder kommer hur du lägger till en sökfält i din meny att skilja sig åt. Om du använder ett klassiskt tema, då behöver du ett WordPress-sökplugin.
För användare av blockteman kan du helt enkelt använda Full Site Editor (FSE).
Med det i åtanke går vi igenom de två metoderna en efter en. Du kan använda snabblänkarna nedan för att hoppa till önskad sektion:
- Metod 1: Lägga till ett sökfält i en klassisk WordPress-temas meny
- Metod 2: Lägga till ett sökfält i en blockbaserad WordPress-temas meny
- Bonustips: Använd SearchWP för att förbättra din WordPress-sökning
Låt oss börja.
Metod 1: Lägga till ett sökfält i en klassisk WordPress-temas meny
Denna första metod är för dem som använder ett klassiskt WordPress-tema. Det innebär att du ser menyn Utseende » Anpassa i din WordPress-instrumentpanel och kan komma åt Temaanpassaren.
Om du använder ett klassiskt tema kan du bara lägga till WordPress sökwidget i widget-klara områden som sidofältet, inte i WordPress-menyn.
För att lösa detta problem behöver du ett plugin som låter dig lägga till ett sökfält i andra delar av din webbplats, inklusive navigeringsmenyer.
SearchWP Modal Search Form är vår bästa rekommendation. Detta gratis plugin är lätt att använda, ser bra ut med alla teman och påverkar inte negativt webbplatsens prestanda. Dessutom kräver det inte premiumpluginet SearchWP.
Det första du behöver göra är att installera och aktivera pluginet SearchWP Modal Search Form. För mer information, se vår steg-för-steg-guide om hur man installerar ett WordPress-plugin.
Efter aktivering måste du lägga till sökfältet i din WordPress-meny. Gå helt enkelt till Utseende » Menyer och se till att du väljer Primär meny i rullgardinsmenyn 'Välj meny att redigera'.
Därefter klickar du på knappen 'Välj'.
Klicka sedan på rutan SearchWP Modal Search Forms till vänster på skärmen.
Du kan se att pluginet automatiskt har lagt till en 'Native WordPress'-sökmall. Fortsätt och kryssa i rutan 'Native WordPress'.
Klicka sedan på knappen 'Lägg till i menyn'.
WordPress kommer nu att lägga till ett nytt objekt av typen ‘Native WordPress’ i menyn.
För att konfigurera detta objekt, klicka på det. Till att börja med är det en bra idé att ändra navigeringsetiketten till 'Sök' så att besökarna vet att detta är ett sökfält.
För att göra denna ändring, skriv helt enkelt in 'Sök' i fältet 'Navigeringsetikett'.
Klicka sedan på knappen ‘Spara meny’ för att spara dina ändringar. Nu, om du besöker din WordPress-blogg, kommer du att se en ny sökfält i navigeringsmenyn.
SearchWP kommer automatiskt att anpassa sökningen för att passa ditt WordPress-tema, som du kan se på följande bilder.
Metod 2: Lägga till ett sökfält i en block-WordPress-temameny
Om du använder ett blockbaserat WordPress-tema kan du använda Full Site Editor för att lägga till ett sökfält i din navigeringsmeny.
För att göra det, gå helt enkelt till Utseende » Redigerare i WordPress-administrationsområdet.
Du kommer nu att se en lista med alternativ för att anpassa ditt tema.
Klicka här på 'Navigering'.
Klicka sedan på pennikonen 'Redigera'.
Detta kommer att leda dig till blockredigeraren.
I det här skedet kan du klicka på knappen '+ Lägg till block' var som helst på skärmen.
Välj sedan sökblocket.
Din navigeringsmeny bör nu ha ett sökfält.
Dessutom kan du redigera platshållartexten och ändra den till något som 'Vad letar du efter?'. I sidofältet för blockinställningar kan du gärna anpassa hur sökfältet ser ut.
När du är nöjd med sökblocket, klicka bara på ‘Spara.’
Bonustips: Använd SearchWP för att förbättra din WordPress-sökning
Förutom att lägga till en sökfält i din navigeringsmeny finns det många fler sätt att förbättra din WordPress-sökupplevelse.
En är att använda SearchWP. Det är bästa WordPress-sökpluginet för att anpassa din sökalgoritm utan att röra någon kod.
Läs mer om pluginet i vår detaljerade SearchWP-recension.
Du kan till exempel göra ditt sökformulär ännu mer användarvänligt genom att lägga till live-sökningsresultat med Ajax-teknik. Detta visar automatiskt besökaren relevanta sökningsresultat medan de skriver in sökfrågan, precis som Google.
För mer information kan du läsa vår artikel om hur du lägger till live Ajax-sökning på din WordPress-webbplats.
Att lägga till ett SearchWP-sökfält är också enkelt. Om du använder SearchWP Search Modal Form i Metod 1, kan du även använda SearchWP-pluginet med det.
Om du använder ett blocktema, så kommer SearchWP med en inbyggd sökformsblock som du kan lägga till var som helst på din webbplats, inklusive navigeringsmenyn.
Här är andra tips och tricks för att förbättra WordPress-sökningen:
- Hur man anpassar sidan med sökresultat i WordPress
- Hur man söker efter kategori i WordPress
- Hur man använder flera sökformulär i WordPress
- Hur man lägger till flerspråkig sökning i WordPress
- Hur man exkluderar sidor från WordPress-sökresultat
- Hur man lägger till röstsökningsfunktion till din WordPress-webbplats
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till ett sökfält i en WordPress-meny. Du kanske också vill se våra guider om hur du stilar navigationsmenyer och hur du låter användare filtrera inlägg och sidor i WordPress.
Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Angel Rodriguez
Tack för detta, det här pluginet fungerade utmärkt och räddade mig från att behöva byta ut eller redigera mitt tema igen.
WPBeginner Support
Kul att vår rekommendation var till hjälp!
Admin
Maricel
Tack! Mycket hjälpsamt och mycket enkelt.
WPBeginner Support
Kul att höra att vår artikel var till hjälp!
Admin
Rawan
Dessa plugins är otvåade för WP version 5.8.1
Är det fortfarande okej att installera dem eller finns det andra plugins som är testade för den versionen?
jafrin
hej
Den här videon är till stor hjälp för mig. Men jag vill att menyraden ska vara som på Amazons sida. Snälla hjälp mig. Hur skapar jag en stor sökfält som på Amazons sida
WPBeginner Support
Det skulle bero på de specifika detaljer du letar efter, men som en startpunkt skulle vi rekommendera att du tittar på vår artikel nedan:
https://www.wpbeginner.com/plugins/how-to-let-users-filter-posts-and-pages-in-wordpress/
Admin
Erin
Finns det ett sätt att visa resultaten som genereras av pluginet på ett annat sätt? Jag får en lista med bilder och beskrivningar men bilderna visas i olika storlekar. Jag skulle vilja att de visas på samma sätt som mina produktsidor med 24 resultat per sida och 4 kolumner.
tack
WPBeginner Support
För att anpassa resultatsidan bör du kontakta pluginets support så bör de kunna hjälpa dig.
Admin
Okereke Divine
Som vanligt har wpbeginner alltid varit hjälpsam. Tack så mycket
WPBeginner Support
You’re welcome, glad our guide could be helpful
Admin
Parwez
Herr, hur skapade du logotypen, sökfältet och menyn i sidhuvudet sida vid sida
WPBeginner Support
Our theme is custom created so we manually set that up with the creation of the theme
Admin
Angelica
Verkligen hjälpsamt! Jag tycker att standardstilen inte är visuellt tilltalande, men skjutalternativet fungerar utmärkt. Tack för detta.
WPBeginner Support
You’re welcome, glad our article could be helpful
Admin
Rochelle
Jag skulle vilja att sökobjektet visas som det första objektet i menyn, inte det sista. Är detta möjligt?
WPBeginner Support
It would depend on your specific theme but if you reach out to the plugin’s support they will be able to help you change the placement
Admin
Anupam Kumar
Hej,
Hur man stylar sociala ikoner som du gjorde på din webbplats för, med de där mellanrummen och linjerna, jag kan inte CSS,
Tack
WPBeginner Support
För att förstå CSS och hur vi ställer in våra ikoner, vill du titta på vår artikel här: https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Admin
Rubb
De förklarar det inte rätt, skärmbilderna är fel och jag tror att det är fel plugin
WPBeginner Support
Det verkar som att pluginet har uppdaterats sedan den här artikeln senast uppdaterades, vi kommer att titta på att uppdatera det här inlägget.
Admin
James King
Det här fungerar inte, gott folk. Det finns ingen sådan plugin till att börja med.
WPBeginner Support
Thank you for letting us know, it appears the plugin has been renamed since we created this article. We’ll look into updating this
Admin
Raymond
Varför är varje lösning på den här webbplatsen ett plugin? Plugins sväller upp webbplatser och saktar ner dem; man skulle förvänta sig att du visste det. Det finns bättre lösningar än att installera ett plugin för allt!
WPBeginner Support
Vi strävar efter att göra lösningarna så enkla som möjligt för våra användare, vilket är anledningen till att våra artiklar tenderar att fokusera på plugins. På så sätt, om en användare inte är bekväm med att redigera sin webbplats filer, har de ett plugin-alternativ som enkelt kan tas bort från deras webbplats om det inte fungerar för dem.
Dessutom är det inte så enkelt som att alla plugins saktar ner din webbplats. Dåligt kodade plugins saktar ner din webbplats. https://www.wpbeginner.com/opinion/how-many-wordpress-plugins-should-you-install-on-your-site/
Admin
Ann
varför har mina inställningar inte ADD TO SEARCH MENU
Dan Conway
Inte säker på om det beror på en uppdatering, men jag märkte samma sak. Men det verkar som att alternativet kan hittas under ‘Ivory Search > Inställningar’ och sedan bör du presenteras med de första inställningarna som är ‘Menysökning’ och det första utdragbara alternativet för att välja en meny att lägga till det i.
Aditi Bisen
Hej,
Kan vi välja om sökningen bara ska visas för mobil/surfplatta och inte för dator?
Ihsan
Tyvärr visas det inte korrekt eftersom det ställer till det med navigeringsmenyn. Jag har provat olika plugins och alla är likadana. För nybörjare verkar det inte finnas något annat sätt än att fråga temautvecklaren eller professionell hjälp för att koda det manuellt.
Damith
Nej, du behöver inte bli utvecklare eller professionell för att göra lite anpassad CSS.