Sådan skjules/fjernes knappen Tilføj til kurv i WooCommerce (trin-for-trin)

Sådan skjuler og fjerner du knappen Tilføj til kurv i WooCommerce

Lad os begynde med at finde ud af, hvorfor du måske ønsker at skjule knappen Tilføj til kurv. En af de mest effektive måder at deaktivere købsprocessen for et specifikt produkt eller en butik på er at fjerne knappen Tilføj til indkøbskurv. Selvom det kan virke underligt, kan det i nogle tilfælde være yderst nyttigt at fjerne knappen Tilføj til kurv.

Der er mange grunde til, at du måske ønsker at fjerne Tilføj til indkøbskurv-knappen fra nogle sider i din butik, bortset fra at give dig flere tilpasningsmuligheder:

  1. Når et produkt er udsolgt eller ikke længere er tilgængeligt
  2. For at deaktivere knappen baseret på logik (dvs. for specifikke brugerroller eller produkter, ikke-loggede brugere osv.)
  3. Produktet er endnu ikke tilgængeligt til køb.
  4. Når du ønsker, at kunderne skal bruge den knap i stedet for den almindelige WooCommerce-købsproces til at sende en besked eller arrangere et interview.

Dette er blot nogle få eksempler på, hvornår du måske ønsker at skjule eller fjerne knappen Tilføj til kurv fra din butik. Lad os komme i gang med at fjerne WooCommerce-tilføj-til-vogn-knappen fra din butik.

 

Sådan fjerner du Tilføj til kurv-knappen i WooCommerce

I denne artikel lærer du, hvordan du skjuler knappen Tilføj til indkøbskurv på forskellige måder. Vi viser dig, hvordan du gør følgende for at give dig flere muligheder:

  1. Fjern eller skjul knappen Tilføj til kurv på tværs af hele webstedet.
  2. Skjul knappen Tilføj til kurv for brugere, der ikke er logget ind.
  3. Fjern knappen Tilføj til kurv på basis af brugerroller.
  4. Skjul Tilføj til kurv-knap på visse produkter.
  5. Deaktiver knappen Tilføj til kurv kun for nogle kategorier
  6. Fjern knappen midlertidigt, og den vil dukke op igen efter en dato.
  7. Lad os tage et kig på hver af dem i forskellige sektioner.

Bemærk: Da vi skal redigere WordPress-kernefiler, anbefaler vi at lave en komplet sikkerhedskopi af dit websted, hvis noget går galt. Du kan også bruge et børnetema. Hvis du ikke allerede har et, kan du enten lave et selv eller bruge et plugin for børnetema.

1. Fjern eller skjul knappen Tilføj til kurv på tværs af hele webstedet

Der er flere muligheder for at fjerne Tilføj til kurv-knappen helt fra din butik. En af de enkleste er at placere følgende script i din børnetemaer functions.php fil:

remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart');

remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30);

Vi fjerner knappen Tilføj til indkøbskurv på produktsiden med den første remove action()-hook, og vi gør det samme på indkøbskurvsiden med den anden. At deaktivere muligheden for at købe produkter er derimod en pænere og mere pålidelig løsning. Du vil være i stand til at gøre produkterne utilgængelige for køb og forhindre brugere i at tilføje dem til deres indkøbskurv på denne måde.

Med følgende script kan du gøre det og gøre alle dine produkter utilgængelige for køb i din butik:

add_filter( 'woocommerce_is_purchasable', '__return_false');

Dette vil deaktivere WooCommerce Add to Cart-knappen, men ikke selve knappen. Den vil blot blive erstattet med en Læs mere-knap, som omdirigerer brugerne til produktsiden, som vil være fri for knapper.

Hvis du vil skjule knappen Læs mere ud over knappen Tilføj til kurv, skal du bruge en CSS-regel. Kunder vil på den anden side ikke kunne købe noget, fordi de ikke vil være i stand til at tilføje produkter til indkøbskurven, selvom de lærer at bruge browserudviklerværktøjet til at vise det. Brug add filter() hook i stedet for remove action() hook, når det er muligt.

Læs mere: Sådan ændres tekst på knappen Tilføj til kurv

2. Skjul knappen Tilføj til kurv for brugere, der ikke er logget ind

Antag, at du kører en tidsbegrænset kampagne for dine registrerede brugere. Du kan oprette en unik landingsside og kun sende en e-mail til dine registrerede brugere med linket, men hvad nu hvis de deler det med andre? Du kan kun fjerne knappen Tilføj til kurv fra din WooCommerce-butik for ikke-loggede brugere for at undgå, at dette sker og sikre, at du kun giver rabatter til den målrettede forbruger. For at gøre det skal du indsætte følgende script i dit underetemas functions.php-fil:

if (!er_bruger_logget_på()) {
// på produktsiden
add_filter('woocommerce_is_purchasable', '__return_false');

}

Vi deaktiverer kun knappen Tilføj til indkøbskurv for ikke-loggede brugere ved at anvende den oprindelige WordPress-funktion er bruger logget på().

3. Fjern knappen Tilføj til kurv på basis af brugerroller

En anden genial mulighed er at deaktivere knappen Tilføj til kurv afhængigt af brugerens rolle. Lad os tage et kig på, hvordan man gør knappen usynlig for enhver administratorbruger:

add_action('wp_loaded','get_user_role');

function get_user_role(){

$current_user = wp_get_current_user();

  if(count($current_user->rolles)!==0){

  if($current_user->rolles[0]=='administrator'){

add_filter('woocommerce_is_purchasable', '__return_false');

}

}

}

WordPress-brugerobjektet hentes, og to betingelser anvendes på det af scriptet. Den første er at bestemme, om en bruger har en rolle, og den anden er kun at gøre produkter utilgængelige for køb, hvis brugerrollen matcher den, vi angiver (administrator i dette tilfælde). Du kan helt sikkert bruge denne kode og ændre den rolle, som du ikke ønsker at se knappen Tilføj til kurv ved at redigere rollen i if($current_user->roles[0]=='din_rolle'){.

4. Skjul Tilføj til kurv-knap på visse produkter

Lad os sige, at du ikke er på lager for nogle varer og midlertidigt ønsker at skjule knappen Tilføj i kurv for disse varer.

Kopiér og indsæt følgende script i functions.php-filen for undertemaet for at fjerne knappen for specifikke produkter:

add_filter('woocommerce_is_purchasable', 'filter_is_purchasable', 10, 2);

function filter_is_purchasable($er_purchasable, $product ) {

globalt $ produkt;

if( in_array( $product->get_id(), not_purchasable_ids() )) {

return false;

}

returnere $er_kan købes;

}

function not_purchasable_ids() {

retur array( 624,625);

}

Knappen Tilføj til kurv er deaktiveret for produkter med ID'er 624 og 625 i dette eksempelscript. Overvej at erstatte disse id'er med dine WooCommerce produkt-id'er for at tilpasse det til din butik. Som du kan se, kan du tillade ubegrænsede produkter ved blot at bruge et komma til at adskille ID'erne.

Gå til dit WordPress-dashboard > WooCommerce > Produkter, og hold musen over et produkt på listen for at se dets ID.

5. Deaktiver kun knappen Tilføj til kurv for nogle kategorier

Du kan også deaktivere knappen Tilføj til kurv for bestemte kategorier. For eksempel, hvis du ville skjule knappen fra kategorien "Bærbare", kunne du bruge følgende kode:

add_action('wp', 'QL_remove_add_to_cart_from_category');   

funktion QL_remove_add_to_cart_from_category(){ 

  if( is_product_category( 'laptops' ) ) { 

    remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart'); 

  } 

}

Du skal blot kopiere denne kode og erstatte "laptops" i linje 3 med titlen på den kategori, hvor knappen Tilføj til kurv skal være skjult.

6. Fjern knappen midlertidigt, og den vil dukke op igen efter en dato

Lad os tage tingene til et andet niveau og samle noget af det, vi har læst. Antag, at du er ved at lancere et produkt, og at du allerede har oprettet en produktside med alle dens funktioner. Hvis du vil bruge denne side til at gøre dine kunder opmærksomme på lanceringen og promovere produktet, før det går live, kan du skjule knappen Tilføj til kurv indtil den officielle lancering og derefter få det vist automatisk på lanceringsdagen.

Lad os sige, at du planlægger at introducere dit produkt den 15. december 2020, og du vil skjule knappen Tilføj til indkøbskurv indtil da, og så afsløre den igen den 15. december. For at gøre det skal du blot kopiere og indsætte scriptet nedenfor:

add_filter( 'woocommerce_er_purchasable', 'hide_add_to_cart_button_until_date', 10, 2 );

funktion hide_add_to_cart_button_until_date( $kan købes = sand, $produkt) {

$current_date = dato('Ym-d');

$release_date = dato( 'Ym-d', strtotime('2020-12-15') );

if( strtotime($current_date) < strtotime($release_date) && $product->get_id() == 624 ) {

$is_purchasable = falsk;

}

returnere $er_kan købes;

}

Tilføj til kurv-knappen vil blive erstattet med en Læs mere-knap, der fører brugerne til produktsiden indtil lanceringsdatoen. Lad os se nærmere på, hvordan scriptet fungerer nu. Koden sammenligner den aktuelle dato med lanceringsdatoen, og hvis den aktuelle dato er tidligere, er produktet ikke tilgængeligt til køb.

Produktet vil være tilgængeligt til køb, når den aktuelle dato er lig med eller overstiger lanceringsdatoen, og knappen Tilføj til indkøbskurv vises automatisk. Husk at inkludere dato samt produkt-id (624 i vores eksempel).

Du har lært flere metoder til at fjerne knappen Tilføj til kurv i denne vejledning. Vi har set, hvordan man skjuler det på tværs af hele butikken, for specifikke produkter, brugere og brugerroller, og endda hvordan man skjuler det for en bestemt dag og derefter automatisk viser det igen. Dette giver dig lidt mere spillerum, når det kommer til at tilpasse din butik til forskellige scenarier.

Du skal blot bruge disse scripts som udgangspunkt og ændre dem, så de passer til din butiks behov.

 

Om forfatteren
Daniel Luke
Daniel er webdesigner og udvikler. Han har været udvikler i de sidste 10 år og arbejdet med forskellige WordPress-temaer, der giver ham mulighed for at sammenligne og kontrastere forskellige temaer, forstå styrkerne og svaghederne for at udvikle faktuelle anmeldelser fra den virkelige verden. Han er også mobilappudvikler og teknologianmelder. Gennem flere år har han udviklet sine egne mobilapps, både på Android og iPhone. Denne praktiske specialisering i mobil- og webudvikling giver ham mulighed for at være en autoritativ stemme, når det kommer til teknologirapportering.

En ting mere... Vidste du, at folk, der deler nyttige ting som dette indlæg, også ser FANTASTISKE ud? ;-)
Vær venlig at forlade a nyttigt kommenter med dine tanker, så del dette på din Facebook-gruppe (r), der ville finde det nyttigt, og lad os høste fordelene sammen. Tak fordi du delte og var god!

Afsløring: Denne side kan indeholde links til eksterne websteder for produkter, som vi elsker og helhjertet anbefaler. Hvis du køber produkter, vi foreslår, tjener vi muligvis et henvisningsgebyr. Sådanne gebyrer påvirker ikke vores anbefalinger, og vi accepterer ikke betalinger for positive anmeldelser.

Forfatter (e) Fremhævet den:  Inc Magazine-logo   Sitepoint-logo   CSS Tricks-logo    webdesignerdepot logo   WPMU DEV-logo   og mange flere ...