Un utente ha chiesto informazioni su WooCommerce di Wordpress

Scorciatoie di prodotto personalizzate: come modificare quelle esistenti?

Un utente ha chiesto 👇

Ho una pagina personalizzata in cui vorrei elencare alcuni prodotti.

Ci sono riuscito con la scorciatoia [product_page id=”99″] per tre prodotti separati e funziona bene.

RIEPILOGO, vorrei rimuovere le “schede prodotto”, “prodotti correlati”, “aggiungi al carrello e quantità”, “sku”, “tag” e altri elementi che lasciano solo le immagini, il prezzo, l’intestazione e la descrizione per tutti loro.

Dove trovo il file [product_page id=”99″] una scorciatoia definita così posso cambiarla e creare una nuova scorciatoia? È questo il modo più semplice per farlo? Ho pensato di utilizzare CSS in questa pagina per rimuovere gli elementi indesiderati, ma funzionerebbe?

Grazie

Supporto per plugin

(@riaanknoetze)

2 anni, 10 mesi fa

Ciao,

Il codice di alimentazione di quella scorciatoia può essere visualizzato su https://github.com/woocommerce/woocommerce/blob/dc7aa3069466f1b7e23fd7ef468760a6a9ddd241/includes/class-wc-shortcodes.php#L460-L580.

Tra la scrittura di una scorciatoia personalizzata e l’utilizzo di CSS personalizzati, quest’ultimo sarà molto più facile da fare 🙂

Se hai solo bisogno di adattare il tuo CSS a pagine specifiche, ricorda che la classe body dovrebbe contenere un ID pagina che puoi usare per limitare il tuo CSS a pagine / prodotti / post specifici.

Lanciatore di thread

(@tibby)

2 anni, 10 mesi fa

Grazie.

Ho trovato tutti i CSS funzionanti e fanno quello che volevo


.page-id-3180 .site-header .widget_product_search {
  display: none;
}

.page-id-3180 .storefront-primary-navigation {
display: none;
}

.page-id-3180 .woocommerce-breadcrumb {
display: none;
}

.page-id-3180 .summary h2 {
display:none;   
}

.page-id-3180 .product_meta {
   display: none;
}

.page-id-3180 .woocommerce-tabs {
   display: none;
}

.page-id-3180 .related.products {
    display: none;
}

.page-id-3180 p.stock.in-stock {
    display: none !important;
}

.page-id-3180 .quantity input[type="number"] {
    display: none !important;
}

.page-id-3180 .sharedaddy {
    display: none;
}

.page-id-3180 button.single_add_to_cart_button.button,
.page-id-3180 a.button.add_to_cart_button.product_type_simple  {
    display: none !important;
}

.page-id-3180 p.stock.out-of-stock {
    display: none;
}

Al momento l’ho inserito nella casella CSS nella personalizzazione, ma immagino che verrà caricato con ogni pagina e rallenterà (ho 8 pagine che vorrei aggiungere il codice sopra). C’è un modo semplice per chiamare questo CSS personalizzato per la pagina a cui appartiene?

Grazie

Supporto per plugin

(@riaanknoetze)

2 anni, 10 mesi fa

Sono contento di sentire che stai facendo progressi su questo 🙂

Hai il diritto di dire che verrà caricato per ogni pagina. Detto questo, verrà caricato nella sezione “Head” del file HTML, che è comunque richiesto da ogni pagina.

In pratica questo significa no altro File CSS caricato.

Ciò significa che il CSS verrà caricato per ogni pagina, ma non aggiungerà più overhead e si applicherà solo alla pagina con ID 3180 grazie ai selettori CSS 🙂

Se hai assolutamente bisogno di caricare CSS in modo condizionale su tutte le pagine, potresti dover cercare plug-in di terze parti aggiuntivi che ti consentiranno di aggiungere CSS alla sezione dell’editor di pagine in WordPress 🙂

Supporto per plugin

(@fernashes)

Ingegnere automatizzato della felicità

2 anni, 10 mesi fa

Non ti rispondiamo da un po ‘, quindi lo contrassegnerò come una soluzione: se hai altre domande, puoi iniziare una nuova discussione.

Was this helpful?

0 / 0

Lascia un commento 0

Your email address will not be published. Required fields are marked *