Tema flatesome
Flatsome è un potente tema WordPress progettato per i siti Web di eCommerce e viene fornito con l'integrazione con WooCommerce.
È uno dei temi WooCommerce più popolari su ThemeForest. Al momento della stesura di questo tutorial, erano oltre 174.500 le vendite e una fantastica valutazione di 4,8 stelle proveniente da oltre 6.600 recensioni.
Flatsome è progettato principalmente per i principianti e per gli utenti non esperti di tecnologia.
Questo è ottimo per le persone che vogliono iniziare con un'attività online ma non sanno come programmare o non hanno il budget per assumere un programmatore professionista. Con Flatsome potrai creare un sito web dall'aspetto professionale utilizzando strumenti semplici e intuitivi.
Ora, Flatsome è ricco di tonnellate di fantastiche caratteristiche e funzionalità. Per mostrare cosa è disponibile e come funziona, abbiamo un breve tutorial che mostra come creare una pagina di prodotto WooCommerce utilizzando Flatsome.
Quindi, senza ulteriori indugi, iniziamo:
Tabella dei contenuti:
- Tema flatesome
- Differenza tra Flatsome, WooCommerce e WordPress
- Crea una pagina del prodotto WooCommerce utilizzando il tema Flatsome
- Passaggio 1: selezionare un layout per la pagina del prodotto
- (Facoltativo) Passaggio 2: creare manualmente la pagina del prodotto
- Passaggio 3: personalizza la pagina del prodotto
- Avvolgendo
Differenza tra Flatsome, WooCommerce e WordPress
Quando diamo il benvenuto ai nostri nuovi lettori, dobbiamo inserire alcune informazioni necessarie per garantire che tutti i nostri lettori siano sulla stessa pagina. Qui discuteremo la differenza in tutte e tre le terminologie che useremo in questo articolo.
Cominciamo con WordPress. È una piattaforma in cui installi diversi temi e plugin per creare il tuo sito web. Sono disponibili migliaia di plugin e temi per svolgere altre attività secondo le tue esigenze.
WooCommerce è un plugin che installiamo su WordPress che ti consente di aggiungere diverse funzionalità al nostro sito web. Con l'installazione di questo plugin -in, possiamo rendere il nostro sito Web e il negozio online con funzionalità aggiuntive come il carrello, l'elaborazione dei pagamenti, la gestione dei prodotti, ecc.
Infine, ma certamente, uno degli elementi più critici è l'aspetto del nostro sito web. Flatsome è un tema che ci permette di personalizzare la prospettiva del nostro sito web secondo i nostri desideri. Ad esempio, se il logo della tua azienda è arancione, dovresti riflettere sul colore del tuo sito web. È quello che ti può offrire Flatsome.
Crea una pagina del prodotto WooCommerce utilizzando il tema Flatsome
Poiché tutti i nostri lettori hanno conoscenze su WordPress, WoCommerce e Flatsome, è tempo per noi di passare alla personalizzazione della nostra pagina del prodotto con il fantastico UX builder fornito con il tema Flatsome. È una funzionalità di trascinamento che rende la vita del designer estremamente facile.
Quasi tutti hanno fatto acquisti online, probabilmente a causa dei tempi difficili che abbiamo affrontato negli ultimi mesi. Restare a casa è stata la soluzione più sicura per tutti noi. Questo è il motivo per cui tutti i nostri lettori saranno d'accordo sul fatto che un negozio online è molto più complicato rispetto a un sito web standard.
Tuttavia, con l'aiuto di WooCommerce e Flatsome, questo compito è diventato estremamente facile. Devi sederti e pianificare come sarà il tuo sito web, e basta. WooCommerce sarà lì per aiutarti con le sue opzioni di creazione. Puoi creare un negozio online funzionante a tutti gli effetti in pochi minuti con il trascinamento della selezione.
Con WooCommerce e Flatsome potrai dare una nuova vita alle tue idee di avere un negozio online. Il tuo sito web deve avere un aspetto moderno e bello in modo da poter attirare i clienti. Pertanto, Flatsome è la soluzione migliore per tutti i tuoi problemi, quindi scaricalo da qui e iniziamo.
Flatsome ha alcune caratteristiche fantastiche, ma una delle parti è che è diventato la prima scelta di oltre 300.000 utenti. Uno strumento definitivo aiuta a creare alcuni siti Web estremamente reattivi senza dover codificare una singola riga. Inoltre, la sua capacità di creare alcuni negozi online altamente creativi e unici lo rende ancora più degno.
Quindi, senza perdere altro tempo, passiamo al tutorial. Questo tutorial ti guida attraverso il processo completo di progettazione della pagina dei prodotti. Le immagini ti aiuteranno a farti un'idea migliore di come l'attività andrà attraverso il processo.
Passaggio 1: selezionare un layout per la pagina del prodotto
Innanzitutto, inizieremo selezionando un layout della pagina dei prodotti. Questa selezione creerà una pagina di base per il nostro negozio online, che personalizzeremo in base ai nostri desideri in seguito. Questa guida passo passo ti guiderà attraverso il processo di personalizzazione della pagina.
Per questo ex amp le, noi continueremo con l'opzione classica Shop. Tuttavia, non ci sono restrizioni per te. Il processo di personalizzazione sarà simile per ogni layout selezionato. L'unica differenza sarebbe che la struttura di base della pagina sarà diversa dall'altra.
Passando alla personalizzazione del prodotto, abbiamo dato il nome a Full height left sidebar.
Sono disponibili due opzioni per personalizzare la pagina dei prodotti. Il primo deve essere fatto con l'UX builder, mentre l'altro è creare la pagina manualmente. Se selezioni la seconda opzione, dovrai andare alla documentazione ufficiale e individuare gli shortcode. Se sei un principiante e questa è la tua prima esperienza nella costruzione di un negozio online, ti consiglio di scegliere questa prima opzione.
(Facoltativo) Passaggio 2: creare manualmente la pagina del prodotto
Ecco uno screenshot della pagina della documentazione ufficiale di Flatsome. Puoi digitare la parola shortcode e cercarli.
Dopo aver premuto la ricerca, sullo schermo verrà visualizzato un elenco di codici brevi. Puoi scegliere gli shortcode importanti per la pagina del prodotto. L'utilizzo di shortcode richiede meno sforzo, ma è essenziale che tu abbia una piccola esperienza pratica con WordPress e l'utilizzo di shortcode.
Ecco l'elenco degli shortcode che puoi utilizzare sul sito web per creare pagine.
In questo ex amp le, saremo personalizzare l'altezza lasciato il layout della barra laterale; quindi, copieremo il codice per il design. Di seguito una foto dell'applicazione applicata, ma puoi facilmente copiarla dalla struttura.
Inizia creando un blocco con un titolo. Se vuoi sviluppare head, devi fare clic su "Aggiungi nuovo" disponibile sotto i blocchi UX posizionati nella dashboard.
Puoi nominare il blocco secondo i tuoi desideri. Qui, in questo ex amp le, abbiamo chiamato il sindacato come il 'layout di tutta l'altezza della barra laterale sinistra.' Successivamente, puoi vedere gli shortcode all'interno dell'editor di blocchi. Una volta completata la copia degli shortcode desiderati, puoi premere Pubblica.
Saremo alla pari dopo questo piccolo passaggio in cui potremo personalizzare la nostra pagina secondo i nostri desideri. Ora vai all'opzione del tema della pagina del prodotto e premi l'icona del layout personalizzato.
Una volta completato, sarai ora in grado di creare blocchi dal menu a discesa Layout prodotto personalizzato.
Scegli il blocco che abbiamo appena creato. Il nostro obiettivo principale per la creazione di quel blocco era creare una pagina del prodotto da esso. Secondo questo ex amp le, l'altezza completa ha lasciato il layout della barra laterale è il blocco, mentre a vostra fine, sarà come avete chiamato.
Una volta completato, premi il pulsante Pubblica; salverà le impostazioni.
Passaggio 3: personalizza la pagina del prodotto
È ora che iniziamo la personalizzazione. Innanzitutto, navigheremo nella pagina dei prodotti esistenti dal front-end che abbiamo impostato in precedenza nei passaggi.
È importante selezionare un particolare prodotto che dobbiamo configurare. Dovresti avere dettagli completi, immagini del lavoro che dobbiamo personalizzare. In questo modo, il processo diventa più comodo per visualizzare la sezione della pagina che creerai.
L'opzione UX builder è visibile. Basta premere il pulsante per avviare la personalizzazione.
Dopo aver aperto UX builder, puoi vedere dall'immagine che gli elementi della pagina del prodotto sono disponibili nel pannello laterale sinistro della tua pagina dei prodotti.
Il pannello laterale sinistro è il blocco che abbiamo inizialmente creato. Lo abbiamo creato con l'aiuto degli shortcode presi dalla documentazione.
Sono disponibili opzioni per riordinare gli elementi dal pannello di sinistra e modificare le impostazioni dall'opzione dell'elemento. In questo ex amp le, saremo riordino del prezzo è disponibile nel menu a sinistra.
Inoltre, ti consente anche di riorganizzare gli elementi dall'anteprima del builder e inserire componenti aggiuntivi nella pagina del prodotto del builder. In questa demo, la sezione Schede dei prodotti e il Prodotto correlato sono stati riorganizzati con un semplice trascinamento della selezione.
Con la significativa funzionalità di trascinamento della selezione, Flatsome è pronto a fornirti ciò che stai cercando sul tuo sito web. Con moduli altamente personalizzabili, puoi creare pagine fantastiche con facilità. La funzione drag and drop rende la vita ancora più comoda.
Avvolgendo
È fondamentale avere un'attività online in questa era moderna perché le persone preferiscono restare a casa per rimanere al sicuro. Quindi inizia a costruire il tuo primo negozio online con Flatsome e ipnotizza i tuoi clienti con la sua unicità e creatività. Inoltre, non c'è nessun pasticcio di codice nell'editor dei contenuti, solo poche righe di shortcode. Flatsome è senza dubbio il miglior tema in cui mi sono imbattuto. Quindi non è necessario cercare altri temi, basta premere il pulsante di download e iniziare subito a costruire il tuo negozio online personalizzato.
