Inaktivera och ta bort relaterade produkter i WooCommerce – 5 sätt att dölja dem snabbt

WooCommerce-relaterade produkter skapas med det tydliga målet att presentera butiksbesökare för ett bredare utbud av produkter.

Det är ett effektivt sätt att öka det genomsnittliga ordervärdet eller produktköpen och nästan varje butik använder konceptet.

Men om du inte vill att de ska visas, hur tar du bort WooCommerce-relaterade produkter eller inaktiverar dem från att visas?

Du kan bombardera kunder med andra produkter innan de ens ville göra sitt första köp från din butik vid en given tidpunkt och det är inte bra för konvertering.

Du kanske undrar hur WooCommerce väljer vilka relaterade produkter som ska visas på produktsidan.

WooCommerce relaterade produkter, till skillnad från WooCommerce korsförsäljning och WooCommerce merförsäljning, kan inte anpassas.

Det kan påverkas genom att gruppera liknande produkter tillsammans i samma produktkategori eller använda samma produkttaggar.

Du kanske tror att din webbplats bara organiserar WooCommerce-relaterade produkter efter kategori, men den tar också hänsyn till produkttaggar.

Det är därför ingen överraskning att många handlare inaktiverar WooCommerce-relaterade produkter på produktsidan.

Innehåll[Show]

 

När det gäller att dölja WooCommerce-relaterade produkter har du flera alternativ.

Välj den som är lättast för dig att utföra.

  1. Du kan lägga till kod till functions.php.
  2. Använd ett plugin och lägg till lite kod till huvudfilen functions.php så att temauppdateringar inte åsidosätter ändringar.
  3. Använd CSS för att förhindra att relaterade produkter visas på produktsidan.

Den första lösningen kräver att du har ett barntema installerat på din webbplats.

Vi rekommenderar att du använder ett barntema så att dina ändringar inte skrivs över när WordPress-temat uppdateras.

Om du inte har ett barntema inställt och fortfarande vill använda den här metoden måste du skapa ett.

Här är hur man skapar ett barntema, hänsynless av vilket tema du har installerat.

Få åtkomst till temaredigeraren via din WordPress-instrumentpanel (Utseende > Temaredigerare). Välj sedan ditt barntema.

Hitta functions.php-filen och klistra in följande kod i den för att permanent inaktivera WooCommerce-relaterade produkter.

remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20);
Men i vissa fall kanske du undrar, "Varför är inte WordPress Theme Editor synlig för mig?" 

Om du inte har behörighet att ändra functions.php, här är lösningen:

Du kan göra en enkel ändring i filen wp-config.php genom att hitta raden ('DISALLOW FILE EDIT', true) och ersätta ordet 'true' med 'false', som visas nedan:

(false, 'TILLÅK INTE FILREDIGERING')

Det är om du har behörighet att redigera den filen.

Detta kommer att återställa alternativet WordPress Theme Editor, så att du kan infoga koden i functions.php-filen för undertemat som planerat.

Ur ett tekniskt perspektiv tror jag att det är en bra lösning att använda ett plugin om du inte vill bråka med kod

Du kan undvika problemet med temauppdateringar som åsidosätter koden genom att använda en plugin för att infoga kod i functions.php-filen, och du behöver inte använda ett underordnat tema om du inte redan har ett.

Ett plugin för kodavsnitt krävs först. Några av dessa är helt gratis, starka och stödda plugins som kan hittas på WordPress.org-förrådet.

Några plugins som kan vara till hjälp är: My Custom Functions av Space X-Chimp och Code Snippets av Code Snippets Pro.

Mina anpassade funktioner

När du har installerat ett av dessa plugins kan du gå vidare och klistra in koden från den tidigare metoden.

Här är den igen:

remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20);

Följ bara instruktionerna från plugin-utvecklaren (som vanligtvis är så enkelt som att kopiera och klistra in koden i en ruta) för att dölja WooCommerce-relaterade produkter från produktsidan.

Detta är en relativt enkel fix. Men det är en "CSS-fix" snarare än en "kodfix", vilket betyder att funktionen fortfarande körs i bakgrunden, men du säger åt den att inte använda en stil.

Detta kanske inte stör dig det minsta. I så fall kan du enkelt inaktivera relaterade produkter på WooCommerce-produktsidan genom att klistra in denna CSS i din WooCommerce-tema Anpassarens avsnitt "Anpassad CSS".

Klistra in följande CSS i Utseende > Anpassa > Anpassad CSS:

.Relaterade produkter {
display: none;
}

Det är allt; WooCommerce-relaterade produkter har tagits bort från din webbplats.

Dessa tre exempel är fokuserade på att förhindra WooCommerce från att visa relaterade produkter på produktsidor.

Hur man blir av med relaterade produkter på WooCommerce produktsidor med hjälp av en sidbyggare

Med hjälp av en sidbyggare som Divi eller Elementor kan du ta bort WooCommerce-relaterade produkter från en produktsida.

Faktum är att utseendet på WooCommerce-produktsidan kan anpassas helt.

Du behöver dock inte vidta några drastiska åtgärder!

Du kan bygga en ny WooCommerce-produktsida så att den ser nästan identisk ut med standardproduktsidamallen, men med några viktiga skillnader.

Vill du stänga av WooCommerce-relaterade produkter? Inga problem; bara lämna dem utanför din nya produktsida design.

Vill du ändra texten på WooCommerce produktsidor som hänvisar till relaterade produkter?

Inga problem – använd bara en sidbyggare som Divi för att ändra titeln till vad du vill.

Vill du visa en enda kolumn med WooCommerce-relaterade produkter på mobilen?

Det är inte heller ett problem. Ange det helt enkelt i din sidbyggare!

Vill du ändra bildstorleken på WooCommerce-relaterade produkter?

Inga problem – använd bara sidbyggaren för att justera bildstorlekarna efter dina önskemål.

Vill du utesluta WooCommerce-relaterade produkter från en underkategori?

Inga problem; lämna bara den relaterade produktsektionen tom för vissa sidor!

Vill du skapa en lista över WooCommerce-relaterade produkter?

På WooCommerce produktsida kan du visa relaterade produkter precis hur och var du vill.

Istället för att visa WooCommerce-relaterade produkter, varför inte visa bästsäljare?

Använd en sidbyggare för att designa din WooCommerce-produktsida utan någon kod är en bra idé – och det är enkelt att göra!

Så om du är nyfiken på att veta hur man kontrollerar relaterade produkter i WooCommerce, är det möjligt att du måste närma dig problemet från ett annat perspektiv.

Ja, du kan redigera den relaterade produktsektionen på WooCommerce-produktsidan om det är allt du vill göra.

Detta kommer dock nästan säkert att kräva användning av kod.

Tänk på möjligheterna.

Du kan kontrollera allt på WooCommerce-produktsidans design om du använder en sidbyggare för att redigera WooCommerce-produktsidan.

Det betyder inte att du måste vidta några drastiska åtgärder!

Du kan helt enkelt kopiera den befintliga designen och göra mindre ändringar för att matcha dina krav.

Kolla in Divi-temat och Divi Builder, som båda är fantastiska, kraftfulla och billiga.

Ja, du kan inaktivera WooCommerce-relaterade produkter bland alla produktsidor, eller så kan du stänga av relaterade produkter på specifika produkter i WooCommerce.

Vissa lösningar kräver kodning i temafilerna, medan andra förlitar sig på CSS i den anpassade CSS-delen av temaanpassaren.

Vi tror dock att det bättre alternativet är att ta full kontroll över din produktsidas design och att inte förlita oss på produktsidemallen från ditt tema för att arbeta med WooCommerce.

På WooCommerce-produktsidan kan du börja ersätta WooCommerce-relaterade produkter med bästsäljare, merförsäljningsprodukter eller korsförsäljningsprodukter.

Som vi har sett med Divi-temat och Divi Builder metod för att ersätta WooCommerce-relaterade produkter är det fullt möjligt att anpassa produktsidan utan att behöva röra en bit kod.

Även om WooCommerce-relaterade produkter inte kan detaljeras som WooCommerce-merförsäljning och korsförsäljning, kan du påverka relaterade produkter.

I WooCommerce-databasens ögon gör att kategorisera produkter i samma produktkategori eller använda samma produkttaggar på dina WooCommerce-produkter gör dem "relaterade".

Du kanske tror att din webbplats bara organiserade WooCommerce-relaterade produkter efter kategori, men WooCommerce associerar också produkter med taggar.

Om du har ställt in olika kategorier och taggar som de flesta WooCommerce-företagare, kommer du sannolikt att se en stor del av din produktkatalog visas som "relaterade produkter" på WooCommerce produktsidor.

1. Göm dem med CSS 2. Använd kodavsnitt för att modifiera PHP för att inaktivera relaterade produkter 3. Återskapa WooCommerce-produktsidan med hjälp av en sidbyggare som Divi, förutom avsnittet Relaterade produkter från designen.

WooCommerce använder produktkategorier och produkttaggar för att gruppera produkter. För att ändra vilka produkter som är relaterade måste du först ändra produktkategorier och taggar.

Att anpassa WooCommerce-produktsidan är ett bättre sätt att hantera de "relaterade produkterna" som visas på WooCommerce-produktsidan. Du kan välja att visa användarspecificerade "korsförsäljning" och "merförsäljning" snarare än de WooCommerce-definierade relaterade produkterna.

Om författaren
Shahzad Saeed
Författare: Shahzad Saeedwebbplats: http://shahzadsaeed.com/e-post: shahzad@collectiveray.com
Shahzaad Saaed har visats på ett stort antal myndighetswebbplatser, som en WordPress-expert. Han specialiserar sig på innehållsmarknadsföring för att hjälpa företag att öka sin trafik.

En sak till... Visste du att människor som delar användbara saker som det här inlägget ser fantastiska ut också? ;-)
Tveka inte, lämna en användbara kommentera med dina tankar, dela sedan detta på din Facebook-grupp (er) som skulle tycka att det var användbart och låt oss skörda fördelarna tillsammans. Tack för att du delade och var trevlig!

Upplysningar: Denna sida kan innehålla länkar till externa webbplatser för produkter som vi älskar och rekommenderar helhjärtat. Om du köper produkter vi föreslår kan vi tjäna en remissavgift. Sådana avgifter påverkar inte våra rekommendationer och vi accepterar inte betalningar för positiva recensioner.

Författare Utvalda på:  Inc Magazine-logotyp   Sitepoint-logotyp   CSS Tricks-logotyp    webbdesignerdepot-logotyp   WPMU DEV-logotyp   och många fler ...