Tutte le regolazioni del codice possono essere aggiunte al tag head nel file theme.liquid oppure è possibile contattare il nostro supporto e saremo lieti di assistervi per qualsiasi problema o richiesta di personalizzazione.
Il team di assistenza clienti ha la possibilità di aggiungere queste regolazioni a un file config.js designato nel nostro sistema di amministrazione, per cui non è necessario accedere al negozio.
Selettori personalizzati del pulsante Aggiungi al carrello
Candy Rack supporta per impostazione predefinita una serie di selettori per attivare con successo il pulsante Aggiungi al carrello, ma potrebbe accadere che un tema utilizzi selettori che la nostra applicazione non riconosce. In questo caso, è possibile specificare selettori personalizzati che vengono aggiunti all'array di selettori supportati.
// window.CANDYRACK_CUSTOM_BUTTON_SELECTORS: string[]window.CANDYRACK_CUSTOM_BUTTON_SELECTORS = ['.atc-class-1','#atc-id']
Impedire la visualizzazione di Candy Rack in base a una condizione
Nel caso in cui il negozio utilizzi alcuni campi personalizzati che devono essere compilati prima di fare clic sul pulsante Aggiungi al carrello e la nostra convalida non li catturi, esiste un modo per impedire manualmente la visualizzazione del popup in base al valore di ritorno del metodo seguente.
// window.CANDYRACK_CAN_ATC: (button: HTMLElement) => booleanwindow.CANDYRACK_CAN_ATC = (_button) => { const input = document.querySelector('.custom-text-input') if(input.value.trim().length === 0) { return false } return true}La variante non è stata trovata
Per attivare con successo l'apertura del popup, abbiamo bisogno della variante giusta del genitore per determinare le offerte; potrebbe accadere che i nostri selettori predefiniti falliscano o non cambino quando viene selezionata una variante diversa. La funzione non sovrascrive i selettori predefiniti e nel caso in cui restituisca undefined, viene gestito il caso predefinito. Nel caso in cui la variante possa essere ottenuta solo tramite una richiesta asincrona, la risposta può essere attesa.
// window.CANDYRACK_VARIANT_SELECTOR_FUNCTION: (button: HTMLElement) => Promise<number>;window.CANDYRACK_VARIANT_SELECTOR_FUNCTION = (button) => { const selectedVariant = button.closest('.variant-select')?.value if(value) { return Number(value) }}Formattazione del denaro
Candy Rack supporta le applicazioni multivaluta più diffuse e formatta il denaro in base alle API disponibili o alle impostazioni del tema. Tuttavia, nel caso in cui la formattazione non sia ideale, esiste un modo per sovrascriverla.
// window.CANDYRACK_CUSTOM_FORMAT_MONEY: (amount?: number, currency: string) => string;window.CANDYRACK_CUSTOM_FORMAT_MONEY = (amount, currency) => { return `${currency} ${amount}`}Rimuovere la convalida del modulo
Per impostazione predefinita, Candy Rack gestisce la convalida del modulo attivando form.checkValidity(). A volte questo può causare problemi, quindi la convalida può essere disattivata completamente.
// window.CANDYRACK_DISABLE_FORM_VALIDATION : booleanwindow.CANDYRACK_DISABLE_FORM_VALIDATION = true
Eventi personalizzati
Candy Rack offre una serie di eventi personalizzati, che possono essere utilizzati per eseguire effetti collaterali, come l'apertura di un carrello.
// Si attiva quando viene cliccato il pulsante Aggiungi al carrellodocument.addEventListener('addToCartButtonClicked', (e) => { // Some code})// Si attiva quando viene aggiunta un'offertadocument.addEventListener('candyrack-offer-added', (e) => { // Some code})// Attivazione quando un'offerta viene rimossadocument.addEventListener('candyrack-offer-removed', (e) => { // Some code})// Attivazione quando il popup si chiudedocument.addEventListener('candyrack-closed', (e) => { // Some code})Se siete interessati anche a personalizzazioni visive del pop-up, potete saperne di più nell'articolo Come personalizzare il pop-up con i CSS.
Avete domande? Cliccate sull'icona della chat in basso a destra di questa pagina o inviateci un'e-mail a [email protected].