WooCommerce dodatak prilagođenom dugmetu za dodavanje u korpu

Opis

Pluggin woocommerce prilagođena gumb za dodavanje proizvoda u košaricu

1. Opći cilj

Omogućuje grafičko i funkcionalno prilagođavanje dva ključna gumba WooCommerce na stranici proizvoda:

1. Gumb “Dodaj u košaricu”

2. Gumb “Pogledaj moju košaricu” (dodaje se desno od gumba “Dodaj u košaricu”)

Sve opcije su dostupne izravno preko Customizer-a WordPress-a, bez potrebe za izmjenom koda vaše teme.

2. Prilagodba gumba “Dodaj u košaricu”

Integriran u zaglavlje svake stranice proizvoda, ova funkcionalnost ubrizgava inline CSS za trenutnu prilagodbu prikaza:

• Tekst gumba
  – Promjena zadanog teksta “Dodaj u košaricu”

• Boje
  – Boja pozadine
  – Boja teksta

• Ivice
  – Stil (none, solid, dotted, dashed)
  – Debljina (px)
  – Boja

• Zaobljeni kutovi
  – Radijus svakog kuta (gore-lijevo, gore-desno, dolje-desno, dolje-lijevo)

• Sjena
  – Pomak X / Y (px)
  – Zamagljenost (px)
  – Boja sjene

• CSS animacije (izbor u Customizer-u)
  – shake : blagi horizontalni potres
  – zoom : efekt zumiranja/pulsiranja
  – cartoon : ciklična promjena pozadinske boje
  – random : nasumični odabir među tri navedene

Sve ove stilove se primjenjuju putem jedne <style> ubrizgane u wp_head, osiguravajući minimalan utjecaj na performanse.

3. Dodavanje gumba “Pogledaj moju košaricu”

Postavljen neposredno nakon gumba “Dodaj u košaricu” zahvaljujući hook-u woocommerce_after_add_to_cart_button, ovaj drugi gumb:

• Preusmijerava na stranicu košarice (wc_get_cart_url())

• Tekst koji se može mijenjati (zadano “Pogledaj moju košaricu”)

• Boje
  – Pozadina
  – Tekst

• Okvir
  – Stil, debljina, boja

• Zaobljeni uglovi (pojedinačni)

• Sjena (offset X/Y, blur, boja)

• Lijevi razmak unaprijed definiran za udaljavanje od glavnog dugmeta

4. Sučelje za konfiguraciju (Customizer)

Jedinstveni odjeljak “Personalizacija Dugmadi WC” okuplja sve postavke :

1. Postavke “Dodaj u košaricu”

2. Postavke “Pogledaj moju košaricu”

Za svaku grupu :

• add_setting() + add_control() (tekst, boja, izbor, broj)

• Validacija putem sanitize_text_field, sanitize_hex_color, absint

5. Kompatibilnost i dobre prakse

• Minimalna verzija potrebna : WooCommerce 3.0+

• Teme : kompatibilno s većinom tema (Storefront, Astra, OceanWP, …)

• Performanse :

  • Lagani PHP kod, nema vanjskih zavisnosti

  • CSS inline ograničen samo na stranice proizvoda

• Održavanje :

  • Trenutna verzija : 1.5

  • Prevedivo putem text-domain killerdev98-wc-custom-button

6. Tipični slučajevi korištenja

• Snažno brendiranje : prilagodite boje dugmeta vizualima vaše trgovine.

• Efekt poziva na akciju : dodati animaciju “shake” kako biste istaknuli gumb.

• Brza korisnička putanja : omogućiti izravni pristup košarici s stranice proizvoda.

• Grafička dosljednost : definirati dosljedan oblik i sjenu za sve gumbe.

Ovaj plugin pruža potpunu kontrolu, na jednostavan način, nad izgledom i ponašanjem glavnih gumba vašeg WooCommerce proizvoda.

WooCommerce dodatak prilagođenom dugmetu za dodavanje u korpu decostickerstore