Growish Widget: Lista Nozze

< Torna indietro

 
 
 
 
 
 

ecom demo
open demo

Step 1. Caricare il widget

Sono necessari i seguenti file oltre jQuery:

Si carica il widget:

growish.load({
    key: 'quimammedev',
    logo: {
        url: 'http://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150',
        width: 240, //MAX 240PX
        height: 45 //MAX 45PX
    },
    userWalletsAccessClass: 'growish-user',
    emptyWalletClass: 'growish-empty-wallet'
});

key: Codice che identifica al partner per usare chiamate API di Growish

logo: Array che contiene informazione sul logo del partner, si consiglia usare un'immagine rettangolare wide.

weddingWalletClass: Il nome della classe che il partner vuole venga usata per il bottone "Crea nuova lista nozze"

userListWalletsAccessClass: Il nome della classe che il partner vuole venga usata per il bottone "Le tue liste nozze"

Il parametro buttonTxt può essere fornito per cambiare la frase del bottone, default: "Fattelo regalare!"



Step2. Caricare il bottone Growish nella pagina prodotto

Questo viene piazzato nelle pagine prodotto, il codice del widget renderizza il bottone in un div scelto dal partner.


        <div style="width: 250px" class="growish-button-demo-class"></div>
    

Viene inizializzato con il seguente codice:

        growish.setWeddingButton({
            className: 'growish-button-demo-class',
            code: '123ss123',
            name: "BUDDY - SDRAIETTA DA BAGNO",
            price: 21165,
            description: 'BUDDY sdraietta per bagnetto ...',
            image: 'http://media.quimammeshop.it/ca...',
            link: 'http://www.quimammeshop.it/bu...',
        });
    

className: Classe del div dove verrà piazzato il bottone

code: Il codice interno del prodotto con il quale può essere identificato univocamente

name: Il nome del prodotto come mostrato in pagina prodotto

price: Il prezzo del prodotto in eurocents

description: La meta descrizione del prodotto (no html)

image: La url della imagine principale del prodotto

link: Il link della pagina prodotto


Questo genera il bottone:


I dati del bottone si possono aggiornare dopo che la pagine è stata caricata usando il comando updateButton, se ad esempio cambia il prezzo del prodotto:


        growish.updateButton({
           price: 20000 //NEW PRICE
        });
    

Bottoni complementari

Finalmente per permettere al utente di controllare le sue liste nozze o di creare una nuova basta fare cosi:


        <a href="#" class="growish-wedding-wallet">Nuova Lista Nozze</a>
        <a href="#" class="growish-wedding-list-wallet">Le tue Liste Nozze</a>
        <a href="#" class="growish-wedding-login">Login</a>
        <a href="#" class="growish-wedding-logout">Logout!</a>
    

Che risulta in:

Nuova Lista Nozze
Le tue Liste Nozze



Logout!