Elementet Search Bar

När du sätter upp din butik är huvudmålet att sälja dina produkter. Om din webbplats är krånglig att navigera eller om kunderna inte kan hitta den produkt de vill ha kan de dock bli avskräckta från att genomföra ett köp. 

Eftersom mer försäljning är ditt mål vill du göra shoppingupplevelsen så enkel och trevlig som möjligt. Därför bör du lägga till en sökfält i din e-handelsbutik. Det minskar friktion, säkerställer att dina kunder hittar det de behöver och hjälper din produktrotation.

📌Obs: Innan du går in i den här guiden, se till att din Website är inställd som en store. Annars ser du inte elementet. Om det inte redan är aktiverat, gör det. Du kan läsa vår artikel “Setting Up An E-commerce Store” för instruktioner om hur du gör det.

Så lägger du till elementet Search Bar

Det finns två sätt att integrera det här elementet i din butik: antingen som ett fristående element eller genom att lägga till det i din befintliga navigationsmeny. Genom att lägga till det i navigationsmenyn håller du allt strömlinjeformat, medan du med Search Bar ensamt får mer kontroll över dess egenskaper — och du kan naturligtvis alltid lägga till båda.

Tillägg till Navigation Bar

För det här behöver du först lägga till/välja ett Navigation Bar-element.

När det är tillagt, scrolla ner i General settings och slå på Show Searchbar. Det lägger till det i det högra hörnet av elementet.

Ändra Icon Color för att göra förstoringsglaset lite mer personligt.

Elementet Search Bar

Klicka på plustecknet för att lägga till ett element och scrolla ner till sektionen Store. Dra och släpp Search Bar dit du vill ha den.

Konfigurera utseendet på Search Bar genom att ändra dess egenskaper. Det inkluderar:

General Settings

1. Element name: Det här hjälper dig om du behöver identifiera olika sökfält.
2. Color Options: Anpassa färgerna på ditt Search Bar — allt från bakgrund till text- och ikonfärger kan ändras här.
3. Font Options: Här kan du leka med storlek och vikt eller byta typsnitt helt.
4. Text Options: Det här låter dig ändra platshållartexten inuti sökfältet.

• Text Customization: Text över olika butikskomponenter, såsom Product List, Product Detail och Upsell, kan anpassas fullt ut för bättre lokalisering och varumärkes­konsistens. Dessa är samlade under Text Customization i General settings. Redigera text för olika undersektioner, till exempel;
• • Contact Details Section.
  • Shipping Details Section
  • Payment Section.
  • Cart Summary Section.

Advanced Settings

1. Borders & Corner: Det här låter dig ändra utseendet på rutan — du kan välja om du vill redigera sökrutan eller resultaten genom att byta  
2. Custom Class: Här kan du lägga till produktklasser.
3. Visibility: Du kan inaktivera det för telefon-/webbläsarformat här.

Ett välanpassat sökfält förbättrar användarupplevelsen och gör det enklare för kunder att hitta produkter och genomföra köp. Tillsammans med textanpassning kan butiksägare förfina sitt varumärke och säkerställa en sömlös och professionell shoppingupplevelse.

✍️Viktiga anmärkningar

• Sökförslagen visar resultat relaterade till produktens namn.
• När användaren klickar på sök navigeras hen till produktlistans sida med sökresultat, som söker baserat på titel och beskrivning.
•  Om du inte kan se elementet, se till att webbplatsen är inställd som en store. Om den inte redan är aktiverad, gör det — du kan läsa vår artikel “Setting Up An E-commerce Store” för instruktioner om hur du gör det.
• Vissa textelement, som felmeddelanden, kanske inte syns i byggarens förhandsvisning men kan ändå anpassas.
• Textrelaterade inställningar (t.ex. Buttons och Form Options) ingår i sektionen Text Customization.
• Befintliga butiker fortsätter att fungera även utan textuppdateringar.