Hur man Customize WooCommerce Product Search Results Page

Gillar du att customize din WooCommerce produkt sökresultat page?

Som standard har WordPress och WooCommerce begränsade capabilities för search. Genom att customize dina produktsökresultat kommer du att kunna öka försäljningen och få ditt företag att växa.

I den här artikeln visar vi några enkla sätt du kan customize din WooCommerce produktsökresultat page för att ge en bättre användarupplevelse.

Varför Customize WooCommerce Product Search Results Page?

Som standard kommer WooCommerce med en utvald funktion för produkt search. Den har dock allvarliga limiter. Detta kan innebära att dina kunder inte kommer att kunna hitta de produkter de letar efter.

Som ett resultat kan du förlora potentiell försäljning. Om dina kunder inte kan hitta det de letar efter kanske de ej kommer tillbaka till din butik.

Hur kan detta hända? Standard WooCommerce search indexerar endast rubriken, content och excerpt av posts och pages. Den tar inte hänsyn till något content inom custom fields när den utför en search.

Det är ett problem eftersom en stor del av dina WooCommerce-produktdata lagras i customize-fält. Som ett resultat kommer inga av dina WooCommerce-produktkategorier, tags, reviews och andra speciella attribut att indexeras.

Lyckligtvis kan du lösa detta problem med hjälp av ett WooCommerce plugin för produkt search.

Med detta sagt, låt oss ta en titt på några exempel på hur du kan förbättra din WooCommerce produkt search results page.

Här är vad du kommer att lära dig av den här guiden. Du kan clicka på linken för att hoppa vidare till den section du är intresserad av.

Video Tutorial

Subscribe to WPBeginner

Om du föredrar skriftliga instruktioner kan du fortsätta Läsa.

Gör WooCommerce produktdata sökbara

Det första du behöver göra är att installera och aktivera SearchWP plugin. För mer detaljer, se vår steg-för-steg guide om hur du installerar ett WordPress plugin.

SearchWP är det bästa pluginet för custom search för WordPress, och används av över 30 000 websites. Det är också ett av de bästa tilläggen för WooCommerce eftersom det ger mer relevanta produktresultat till dina kunder.

Du kan se vår kompletta SearchWP-review för mer detaljer.

Vid aktivering måste du besöka SearchWP ” Settings page och växla till fliken ’Support’ för att enter din license key. You can find it in your account area on the SearchWP site.

Därefter måste du installera och aktivera WooCommerce Integration-utökningen.

You can download it from your account area on the SearchWP website and install it as you would install any other WordPress plugin.

Nu är du redo att ställa in din SearchWP custom search engine.

Gå bara till sidan SearchWP ” Settings och se till att du är på tabben ”Engines”. Väl där måste du klicka på knappen ”Sources & Settings”.

Detta kommer att ge en popup där du bör se till att checkboxen bredvid ’Produkter’ är markerad. Detta kommer att tillåta SearchWP att indexera dina WooCommerce-produkter.

WooCommerce produkt reviewer är lagrade som comments. Om du vill göra reviews sökbara, bör du också kontrollera boxen ”Comments”.

När du har gjort det klickar du på knappen ”Done” för att stänga popupen.

Nu måste du rulla ner till ”Products” section. Notice that by default, the plugin will only look at the product title, content (description), slug, and excerpt (short description).

Du kan utöka SearchWP:s räckvidd genom att clicka på knappen ”Add/Remove Attributes”.

Detta kommer att visa en popup där you kan inkludera specifika custom fields och taxonomies i search. För den här tutorialen har vi lagt till de anpassade fälten ”color” och ”size” och taxonomierna ”product categories” och ”product tags”.

You can now click the ’Done’ button, and you should notice that those custom fields and taxonomies have been added to the products section of SearchWP.

Efter det kan du justera vikten för varje attribut. Om du gillar att göra ett visst attribut mer viktigt i sökresultaten flyttar du helt enkelt slidern till höger.

När du är klar kan du klicka på knappen ”Save Engines” högst upp på vyn för att save your settings.

SearchWP kommer sedan att börja bygga om ditt search-index i bakgrunden. Efter det är pluginet redo att börja leverera mer relevanta sökresultat till din WooCommerce store.

SearchWP kommer automatiskt att använda alla sökformulär i din store. Men om du behöver add to ett sökformulär, se vår Step-by-Step guide om hur man skapar ett customize WordPress sökformulär. Detta kommer också att lära dig hur du stylar resultatsidan med hjälp av custom CSS.

Nu kan du gå till din WooCommerce store för att prova den utvalda funktionen search. Vi söker efter produktkategorin ”hoodies”, och alla produkter i den kategorin kommer att visas.

För att lära dig mer, se vår guide om hur du gör en smart WooCommerce produkt search.

Customize vilka produkter som ska visas på Search Results Pages

Som standard kommer SearchWP att inkludera alla produkter i din online store i sökresultaten. Men du kanske vill ange vilka produkter som ska eller ej ska visas.

Du kan till exempel automatiskt utesluta produkter om de uppfyller vissa villkor, som att de gillar att sluta säljas eller är slut i lager. Eller så kanske du bara vill displayed produkter som är på rea eller som levereras med gratis frakt.

I AeroPress WooCommerce store kan du till exempel söka efter produkter med gratis frakt. Detta är ett bra incitament för kunder att göra ett köp.

För att komma igång bör du klicka på knappen ”Edit Rules” i SearchWP: s Products section.

Just nu finns det inga regler. Du kan skapa så många regler som du behöver.

För att skapa din första regel måste du clicka på knappen ”Add Rule”.

Nu kan du ange villkoren för vilka produkter som ska visas eller uteslutas från sökresultaten. För denna tutorial kommer vi att utesluta all out of stock-produkter.

Först ska du selecta ’Exkludera poster om’ från den första rullgardinsmenyn. Välj sedan taxonomin ”Product visibility” och skriv ”outofstock” i fältet bredvid.

Om du gillar det kan du lägga till ytterligare villkor som ska uteslutas genom att klicka på knappen ”OR”. När du är slutförd med att lägga till regler klickar du på knappen ”Done”.

Nu behöver du bara trycka på knappen ”Save Engines” högst upp för att lagra dina ändringar.

För att lära dig mer om hur du kan använda SearchWPs regler, se vår guide om hur du utesluter specifika pages, auktoriseringar och mer från WordPress search.

Displaying Product Search Results in Live Mode (Resultat av produktsökningar i Live-läge)

Live search kommer att förbättra sökupplevelsen i din WooCommerce store genom att automatiskt visa sökresultat när dina customers skriver sina sökningar.

Good Dye Young erbjuder till exempel live search på sina hår- och sminkprodukter.

Relevanta produkter och artiklar visas omedelbart när kunden skriver in sin sökning, vilket ger en bättre användarupplevelse.

För att add to detta till din egen store, all you need to do is install and activate the free SearchWP Live Ajax Lite Search plugin. För mer detaljer, se vår steg-för-steg guide om hur du installerar ett plugin för WordPress.

Efter aktivering kommer dina WooCommerce-sökformulär automatiskt att tillhandahålla live search.

För mer detaljer, se vår guide om hur du lägger till live search på din WordPress site.

Hitta partiella matchningar och andra avancerade funktioner

Partiell matchning hjälper dina customers att hitta det de söker efter, även om de inte skriver hela ordet eller använder korrekt stavning.

Till exempel har Magna-Tiles online store aktiverat partiell matchning. Customize behöver bara skriva in en del av ett produktnamn för att hitta det i sökresultaten.

För att aktivera partiell matchning i SearchWP, bör du navigera till SearchWP ” Settings och klicka på fliken Advanced.

På den här page kan du aktivera några settings som gör det lättare för dina användare att hitta det de söker.

Kontrollera vilket av dessa alternativ som du gillar:

• Delvisa matchningar visar också resultat som inte riktigt matchar den term som söks.
• Automatiska ”Menade du?”-korrektioner föreslår en något annorlunda search term som matchar fler produkter i din store.
• Support för ”quoted/phrase searches” gör det möjligt för dina användare att använda citattecken när de söker efter exakta fraser.
• Genom att markera termer i resultaten blir det lättare för dina customers att hitta det de söker i sökresultaten.

Vi hoppas att denna tutorial hjälpte dig att lära dig hur du customize WooCommerce produkt search results page. Du kanske också vill lära dig hur du lägger till grossistpriser i WooCommerce, eller kontrollera vår lista över de bästa e-postmarknadsföringstjänsterna.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.