Δημιουργήστε μια προσαρμοσμένη σελίδα προϊόντος WooCommerce με θέμα Flatsome

Εντυπωσιακό θέμα

Το Flatsome είναι ένα ισχυρό θέμα WordPress σχεδιασμένο για ιστότοπους ηλεκτρονικού εμπορίου και συνοδεύεται από ενσωμάτωση WooCommerce.

Είναι ένα από τα πιο δημοφιλή θέματα WooCommerce στο ThemeForest. Από τη στιγμή που γράφτηκε αυτό το σεμινάριο, ήταν πάνω από 174.500 πωλήσεις και μια φοβερή βαθμολογία 4,8 αστέρων που προέρχονται από πάνω από 6.600+ κριτικές.

Το Flatsome έχει σχεδιαστεί κυρίως με γνώμονα τους αρχάριους και τους χρήστες που δεν γνωρίζουν την τεχνολογία.

Αυτό είναι υπέροχο για άτομα που θέλουν να ξεκινήσουν με μια διαδικτυακή επιχείρηση, αλλά δεν ξέρουν πώς να κωδικοποιήσουν ή έχουν τον προϋπολογισμό για να προσλάβουν έναν επαγγελματία κωδικοποιητή. Με το Flatsome, θα μπορείτε να δημιουργήσετε έναν ιστότοπο με επαγγελματική εμφάνιση χρησιμοποιώντας απλά και διαισθητικά εργαλεία.

Τώρα, το Flatsome έρχεται γεμάτο με τόνους εκπληκτικών χαρακτηριστικών και λειτουργιών. Για να αναδείξετε τι είναι διαθέσιμο και πώς λειτουργεί, έχουμε ένα γρήγορο σεμινάριο που σας δείχνει πώς να δημιουργήσετε μια σελίδα προϊόντων WooCommerce χρησιμοποιώντας το Flatsome.

Λοιπόν, χωρίς περαιτέρω καθυστέρηση, ας ξεκινήσουμε:

Πίνακας Περιεχομένων:

Διαφορά μεταξύ Flatsome, WooCommerce και WordPress

Καθώς καλωσορίζουμε τους νέους αναγνώστες μας, πρέπει να βάλουμε μερικές απαραίτητες πληροφορίες για να διασφαλίσουμε ότι όλοι οι αναγνώστες μας βρίσκονται στην ίδια σελίδα. Εδώ θα συζητήσουμε τη διαφορά και στις τρεις ορολογίες που θα χρησιμοποιούμε σε όλο αυτό το άρθρο.

Ας ξεκινήσουμε με το WordPress. Είναι μια πλατφόρμα όπου εγκαθιστάτε διαφορετικά θέματα και plugin να δημιουργήσετε τον ιστότοπό σας. Υπάρχουν χιλιάδες plugin και θέματα διαθέσιμα για την εκπλήρωση άλλων εργασιών σύμφωνα με τις απαιτήσεις σας.

Το WooCommerce είναι ένα plugin που εγκαθιστούμε στο WordPress και σας επιτρέπει να προσθέσετε διαφορετικές δυνατότητες στον ιστότοπό μας. Με την εγκατάσταση αυτής της plugin , μπορούμε να κάνουμε τον ιστότοπό μας και το ηλεκτρονικό μας κατάστημα με επιπλέον λειτουργίες όπως καλάθι αγορών, επεξεργασία πληρωμών, διαχείριση προϊόντων κ.λπ.

Τέλος, αλλά σίγουρα, ένα από τα πιο κρίσιμα στοιχεία είναι οι προοπτικές της ιστοσελίδας μας. Το Flatsome είναι ένα θέμα που μας επιτρέπει να προσαρμόσουμε την προοπτική της ιστοσελίδας μας σύμφωνα με τις επιθυμίες μας. Για παράδειγμα, εάν το λογότυπο της εταιρείας σας είναι πορτοκαλί, θα θέλατε να σκεφτείτε το χρώμα του ιστότοπού σας. Είναι αυτό που μπορεί να σας προσφέρει το Flatsome.

Δημιουργήστε μια σελίδα προϊόντων WooCommerce χρησιμοποιώντας το θέμα Flatsome

Δεδομένου ότι όλοι οι αναγνώστες μας έχουν γνώσεις σχετικά με το WordPress, το WoCommerce και το Flatsome, ήρθε η ώρα να προχωρήσουμε στην προσαρμογή της σελίδας των προϊόντων μας με το φανταστικό πρόγραμμα δημιουργίας UX που συνοδεύει το θέμα Flatsome. Είναι ένα χαρακτηριστικό drag and drop που κάνει τη ζωή του σχεδιαστή εξαιρετικά εύκολη.

Σχεδόν όλοι έχουν κάνει αγορές στο διαδίκτυο, πιθανώς λόγω των δύσκολων καιρών που έχουμε αντιμετωπίσει τους τελευταίους μήνες. Η διαμονή στο σπίτι ήταν η ασφαλέστερη λύση για όλους μας. Είναι ο λόγος που όλοι οι αναγνώστες μας θα συμφωνήσουν στο γεγονός ότι ένα ηλεκτρονικό κατάστημα είναι πολύ πιο περίπλοκο σε σύγκριση με έναν τυπικό ιστότοπο.

Ωστόσο, με τη βοήθεια των WooCommerce και Flatsome, αυτή η εργασία έγινε εξαιρετικά εύκολη. Πρέπει να καθίσετε και να σχεδιάσετε πώς θα μοιάζει ο ιστότοπός σας, και αυτό είναι. Το WooCommerce θα είναι εκεί για να σας βοηθήσει με τις επιλογές κατασκευής. Μπορείτε να δημιουργήσετε ένα ολοκληρωμένο ηλεκτρονικό κατάστημα που λειτουργεί σε λίγα μόνο λεπτά με μεταφορά και απόθεση.

Με το WooCommerce και το Flatsome , θα μπορείτε να δώσετε μια εντελώς νέα ζωή στις ιδέες σας για ένα ηλεκτρονικό κατάστημα. Ο ιστότοπός σας πρέπει να έχει μοντέρνα και όμορφη εμφάνιση για να μπορεί να προσελκύει πελάτες. Επομένως, Flatsome είναι η καλύτερη λύση για όλα τα προβλήματά σας, επομένως κατεβάστε το από εδώ και ας ξεκινήσουμε.

Το Flatsome έχει μερικά φανταστικά χαρακτηριστικά, αλλά ένα από τα μέρη είναι ότι έχει γίνει κορυφαία επιλογή περισσότερων από 300.000 χρηστών. Ένα απόλυτο εργαλείο βοηθά στη δημιουργία μερικών τρομερών αποκριτικών ιστότοπων χωρίς να χρειάζεται να κωδικοποιήσετε μια γραμμή. Επιπλέον, η ικανότητά του να δημιουργεί εξαιρετικά δημιουργικά και μοναδικά διαδικτυακά καταστήματα το καθιστά ακόμη πιο άξιο.

Έτσι, χωρίς να χάνουμε άλλο χρόνο, ας συνεχίσουμε στο σεμινάριο. Αυτό το σεμινάριο σας καθοδηγεί στην πλήρη διαδικασία σχεδιασμού της σελίδας προϊόντων. Οι εικόνες θα σας βοηθήσουν να πάρετε μια καλύτερη ιδέα για το πώς η εργασία θα περάσει από τη διαδικασία.

Βήμα 1: Επιλέξτε μια διάταξη για τη σελίδα προϊόντος

Αρχικά, θα ξεκινήσουμε επιλέγοντας μια διάταξη της σελίδας προϊόντων. Αυτή η επιλογή θα δημιουργήσει μια βασική σελίδα για το ηλεκτρονικό μας κατάστημα, την οποία θα προσαρμόσουμε σύμφωνα με τις επιθυμίες μας αργότερα. Αυτός ο οδηγός βήμα προς βήμα θα σας καθοδηγήσει στη διαδικασία προσαρμογής της σελίδας.

Για αυτό το ex amp , θα συνεχίσουμε με την επιλογή Classic Shop. Ωστόσο, δεν υπάρχει περιορισμός για εσάς. Η διαδικασία προσαρμογής θα είναι παρόμοια για κάθε διάταξη που επιλέγετε. Η μόνη διαφορά θα ήταν η βασική δομή της σελίδας θα είναι διαφορετική από την άλλη.

Προχωρώντας στο εργαλείο προσαρμογής προϊόντων, του δώσαμε το όνομα στην αριστερή πλευρική γραμμή πλήρους ύψους.

Υπάρχουν δύο διαθέσιμες επιλογές για την προσαρμογή της σελίδας προϊόντων. Το πρώτο πρέπει να γίνει με το UX builder, ενώ το άλλο είναι να δημιουργήσετε τη σελίδα χειροκίνητα. Εάν ορίσετε τη δεύτερη επιλογή, θα πρέπει να μεταβείτε στην επίσημη τεκμηρίωση και να εντοπίσετε συντομεύσεις. Εάν είστε αρχάριος και αυτή είναι η πρώτη σας εμπειρία στην κατασκευή ενός διαδικτυακού καταστήματος, σας συνιστώ να πάρετε αυτήν την πρώτη επιλογή.

(Προαιρετικό) Βήμα 2: Δημιουργία σελίδας προϊόντος με μη αυτόματο τρόπο

Ακολουθεί ένα στιγμιότυπο οθόνης της επίσημης σελίδας τεκμηρίωσης του Flatsome. Μπορείτε να πληκτρολογήσετε τη λέξη συντομεύσεις και να τις αναζητήσετε.

Μόλις πατήσετε την αναζήτηση, θα εμφανιστεί μια λίστα σύντομων κωδικών στην οθόνη. Μπορείτε να επιλέξετε τους σύντομους κωδικούς που είναι σημαντικοί για τη σελίδα του προϊόντος. Η χρήση συντομεύσεων απαιτεί λιγότερη προσπάθεια, αλλά είναι σημαντικό να έχετε λίγη πρακτική εμπειρία με το WordPress και τη χρήση σύντομων κωδικών.

Εδώ είναι η λίστα των συντομεύσεων που μπορείτε να χρησιμοποιήσετε στον ιστότοπο για τη δημιουργία σελίδων.

Σε αυτό το ex amp le, θα προσαρμόζουμε την πλήρη αριστερή διάταξη πλευρικής γραμμής. Έτσι, θα αντιγράψουμε τον κωδικό για το σχέδιο. Ακολουθεί μια εικόνα της εφαρμογής, αλλά μπορείτε εύκολα να την αντιγράψετε από τη δομή.

Ξεκινήστε να δημιουργείτε ένα μπλοκ με έναν τίτλο. Εάν θέλετε να αναπτύξετε το κεφάλι, πρέπει να κάνετε κλικ στην επιλογή "Προσθήκη νέου" που διατίθεται κάτω από μπλοκ UX που είναι τοποθετημένα στον πίνακα ελέγχου.

Μπορείτε να ονομάσετε το μπλοκ σύμφωνα με τις επιθυμίες σας. Εδώ σε αυτό το ex amp le, ονομάσαμε την ένωση ως «διάταξη αριστερής πλευρικής γραμμής πλήρους ύψους». Στη συνέχεια, μπορείτε να δείτε τους σύντομους κωδικούς μέσα στο πρόγραμμα επεξεργασίας μπλοκ. Μόλις ολοκληρώσετε την αντιγραφή των επιθυμητών σύντομων κωδικών, μπορείτε να πατήσετε δημοσίευση.

Θα είμαστε στο ίδιο επίπεδο μετά από αυτό το μικρό βήμα όπου μπορούμε να προσαρμόσουμε τη σελίδα μας σύμφωνα με τις επιθυμίες μας. Τώρα μεταβείτε στην επιλογή θέματος σελίδας προϊόντος και πατήστε το εικονίδιο προσαρμοσμένης διάταξης.

Μόλις ολοκληρωθεί, θα μπορείτε πλέον να δημιουργείτε αποκλεισμούς από το αναπτυσσόμενο μενού Προσαρμοσμένη διάταξη προϊόντων.

Επιλέξτε το μπλοκ που μόλις δημιουργήσαμε. Ο κύριος στόχος μας για τη δημιουργία αυτού του μπλοκ ήταν να δημιουργήσουμε μια σελίδα προϊόντος από αυτήν. Σύμφωνα με αυτήν την πρώην amp le, η πλήρης ύψος αριστερά πλευρική γραμμή είναι το μπλοκ, ενώ από την πλευρά σας, θα είναι όπως έχετε το όνομα.

Μόλις ολοκληρωθεί, απλώς πατήστε το κουμπί Δημοσίευση. θα αποθηκεύσει τις ρυθμίσεις.

Βήμα 3: Προσαρμόστε τη σελίδα προϊόντος

Ήρθε η ώρα να ξεκινήσουμε την προσαρμογή. Αρχικά, θα περιηγηθούμε στη σελίδα προϊόντων που υπάρχουν από τη διεπαφή που ορίσαμε νωρίτερα στα βήματα.

Είναι σημαντικό να επιλέξετε ένα συγκεκριμένο προϊόν που πρέπει να ρυθμίσουμε. Θα πρέπει να έχετε πλήρη στοιχεία, εικόνες της εργασίας που πρέπει να προσαρμόσουμε. Με αυτόν τον τρόπο, η διαδικασία γίνεται πιο άνετη για να οπτικοποιήσετε την ενότητα σελίδων που θα δημιουργήσετε.

Η επιλογή UX builder είναι ορατή. Απλώς πατήστε το κουμπί για να ξεκινήσετε την προσαρμογή.

Αφού το UX builder είναι ανοιχτό, μπορείτε να δείτε από την εικόνα ότι τα στοιχεία σελίδας προϊόντος είναι διαθέσιμα στο αριστερό πλαίσιο της σελίδας προϊόντων σας.

Το αριστερό πλαίσιο είναι το μπλοκ που δημιουργήσαμε αρχικά. Το δημιουργήσαμε με τη βοήθεια των σύντομων κωδικών που λαμβάνονται από την τεκμηρίωση.

Έχετε επιλογές για να αναδιατάξετε τα στοιχεία από το αριστερό πλαίσιο και να αλλάξετε τις ρυθμίσεις από την επιλογή στοιχείου. Σε αυτό το ex amp , θα αναδιατάξουμε την τιμή που είναι διαθέσιμη στο αριστερό μενού.

Επιπλέον, σας επιτρέπει επίσης να αναδιατάξετε στοιχεία από την προεπισκόπηση του κατασκευαστή και να τοποθετήσετε επιπλέον εξαρτήματα στη σελίδα του προϊόντος του δημιουργού. Σε αυτήν την επίδειξη, η ενότητα Καρτέλες προϊόντων και το σχετικό προϊόν αναδιατάχθηκαν με μια απλή μεταφορά και απόθεση.

Με τη σημαντική λειτουργία μεταφοράς και απόθεσης, το Flatsome είναι έτοιμο να σας προσφέρει αυτό που ψάχνετε στον ιστότοπό σας. Με εξαιρετικά προσαρμόσιμες ενότητες, μπορείτε να δημιουργήσετε μερικές φανταστικές σελίδες με ευκολία. Η λειτουργία μεταφοράς και απόθεσης καθιστά τη ζωή ακόμα πιο άνετη.

Τυλίγοντας

Είναι επιτακτική ανάγκη να έχετε μια διαδικτυακή επιχείρηση σε αυτήν τη σύγχρονη εποχή, επειδή οι άνθρωποι προτιμούν να μένουν σπίτι για να παραμείνουν ασφαλείς. Ξεκινήστε λοιπόν να χτίζετε την επιχείρησή σας στο πρώτο διαδικτυακό κατάστημα με το Flatsome και να γοητεύετε τους πελάτες σας με τη μοναδικότητα και τη δημιουργικότητά του. Επιπλέον, δεν υπάρχει χάος κώδικα στον επεξεργαστή περιεχομένου, μόνο μερικές σύντομες γραμμές. Το Flatsome είναι αναμφίβολα το καλύτερο θέμα που έχω συναντήσει. Επομένως, δεν χρειάζεται να ψάξετε για οποιοδήποτε άλλο θέμα, απλώς πατήστε το κουμπί λήψης και ξεκινήστε αμέσως να δημιουργείτε το προσαρμοσμένο ηλεκτρονικό σας κατάστημα.

Αφήστε ένα σχόλιο

Η διεύθυνση email σας δεν θα δημοσιευθεί. Τα υποχρεωτικά πεδία επισημαίνονται με *