Πώς να προσθέσετε ένα Shopify Favicon στο δικό σας Shopify κατάστημα

Μάθετε τα βασικά του τι είναι Shopify Favicon και πώς να το τοποθετήσετε στο ηλεκτρονικό σας κατάστημα.

Εάν εγγραφείτε σε μια υπηρεσία από έναν σύνδεσμο σε αυτήν τη σελίδα, η Reeves and Sons Limited ενδέχεται να κερδίσει μια προμήθεια. Δείτε το δικό μας δήλωση ηθικής.

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

Αν και μικρό σε μέγεθος, το Favicon συνδέεται επίσης με αυτήν τη στρατηγική επωνυμίας. Σε αυτό το σεμινάριο, θα σας δείξουμε πώς να δημιουργείτε και να προσθέτετε ένα favicon στο δικό σας Shopify κατάστημα, ολοκληρώνοντας την εμφάνισή σας στο διαδίκτυο και διευκολύνοντας την αναγνώριση του καταστήματός σας όταν επισκέπτονται οι πελάτες.

Τι είναι ένα Shopify Favicon;

A Shopify Το Favicon, ή οποιοδήποτε Favicon για αυτό το θέμα, είναι ένα μικρό εικονίδιο για τον ιστότοπό σας που εμφανίζεται στην καρτέλα του προγράμματος περιήγησης δίπλα στο όνομα του ιστότοπού σας.

Η γραμμή διευθύνσεων του προγράμματος περιήγησης είναι η πιο κοινή περιοχή για την προβολή του ιστότοπου Favicon, αλλά εμφανίζεται επίσης στις ακόλουθες τοποθεσίες:

  • Εφαρμογές γραμμής εργαλείων
  • Αποθηκευμένα
  • Αποτελέσματα ιστορικού
  • Γραμμές αναζήτησης
  • Μερικές φορές όταν κοινοποιείται στα κοινωνικά μέσα

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

Shopify Παραδείγματα Favicon

Από προεπιλογή, Shopify προσθέτει το Shopify λογότυπο για το Favicon σας, οπότε πρέπει να το αλλάξουμε αυτό.

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

Από προεπιλογή, όλα τα προγράμματα περιήγησης υποστηρίζουν Favicons μεγέθους 32 × 32 pixel. Αυτή είναι μια μάλλον μικροσκοπική εικόνα, αλλά με τη βοήθεια ορισμένων διαδικτυακών γεννητριών μπορείτε να φτιάξετε τη δική σας Shopify Favicon για τον ιστότοπό σας. Επίσης, οι μεγαλύτερες εικόνες μειώνονται ούτως ή άλλως, οπότε δεν χρειάζεται απαραίτητα να φτάσετε ακριβώς στα 32 × 32.

Ένα Favicon έχει νόημα για τα διαδικτυακά καταστήματα Shopify δεδομένου ότι είναι εύκολο να προσθέσετε και είναι σημαντικό να ενισχύσετε την ταυτότητα της επωνυμίας σας ως διαδικτυακός πωλητής. Ορισμένοι υποστηρίζουν επίσης ότι βοηθά με το SEO.

Συνεχίστε να διαβάζετε για να μάθετε περισσότερα σχετικά με τον τρόπο προσθήκης του Favicon στο δικό σας Shopify κατάστημα.

Πώς να προσθέσετε ένα Favicon στο δικό σας Shopify Store – Quick Step Guide

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

Βήμα 1: Μεταβείτε στο δικό σας Shopify Ταμπλό

Επομένως, πηγαίνετε στο δικό σας Shopify ταμπλό και κάντε κλικ στο Διαδικτυακό κατάστημα κάτω από τα κανάλια πωλήσεων.

Βήμα 2: Μεταβείτε στις Ρυθμίσεις θέματος

Μεταβείτε στα Θέματά σας και κάντε κλικ στο κουμπί Προσαρμογή δίπλα στο τρέχον θέμα σας. Αν και οι ρυθμίσεις αλλάζουν από θέμα σε θέμα, όλα τα πιο πρόσφατα Shopify θέματα έχουν μια ενότητα για να αλλάξετε το Favicon.

ηλεκτρονικό κατάστημα

Στο Shopify customizer, μεταβείτε στο κάτω μέρος της λίστας στα αριστερά και κάντε κλικ στο Theme Settings.

ρυθμίσεις θεμάτων

Βήμα 3: Επιλέξτε το κουμπί Favicon

Στη νέα ενότητα, βρείτε και επιλέξτε το κουμπί Favicon.

favicon Shopify Favicon

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

επιλέξτε εικόνα

Βήμα 4: Ανεβάστε το Favicon σας

Επιλέξτε το αρχείο Favicon και ανεβάστε το Shopify.

Μετά από αυτό, θα δείτε μια προεπισκόπηση του εικονιδίου Favicon. Για να κάνετε τις αλλαγές μόνιμες, επιλέξτε το κουμπί Αποθήκευση στο Shopify.

αποθήκευση

Για να δείτε το δικό σας Shopify favicon σε δράση, μεταβείτε στο frontend του ιστότοπού σας και δείτε την τρέχουσα καρτέλα του προγράμματος περιήγησης Θα πρέπει να δείτε το Favicon δίπλα στον τίτλο του ιστότοπού σας.

παράδειγμα Shopify Favicon

Συμβουλές για τη δημιουργία του Favicon σας

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

Για να επιλύσετε τυχόν προβλήματα, ακολουθούν ορισμένες συμβουλές για τη δημιουργία των δικών σας Shopify Favicon:

  • Ξεκινήστε το σχέδιό σας μεγαλύτερο από 32 × 32 και μειώστε το εάν χρειάζεται. Είστε υποχρεωμένοι να έχετε μια εικόνα θόλωσης εάν προσπαθείτε να τεντώσετε μια μικρότερη εικόνα στο χώρο. Για παράδειγμα, η λήψη μιας εικόνας 32 × 32 από το Hatchful και η προσπάθειά της να την απλώσετε για να απαλλαγείτε από το γραπτό μέρος του λογότυπου μπορεί να προκαλέσει προβλήματα.
  • Συνήθως δεν μπορείτε απλά να πάρετε το τρέχον λογότυπό σας και να περιμένετε να λειτουργεί τέλεια ως Favicon.
  • Η εμφάνιση του Favicon είναι εξαιρετική όταν καλύπτετε κάθε pixel του παρεχόμενου χώρου. Δεν έχετε πολύ χώρο, οπότε πρέπει να επωφεληθείτε από κάθε square pixel στο χώρο 32 × 32.
  • Καταργήστε όλο το κείμενο, καθώς είναι δύσκολο να το διαβάσετε σε ένα Favicon. Η εξαίρεση είναι εάν το κύριο στοιχείο λογότυπου είναι ένα μεγάλο γράμμα.
  • Τραβήξτε για συμπαγή, φωτεινότερα χρώματα. Τα απλά, γελοιογραφικά λογότυπα λειτουργούν καλύτερα.
  • Κοιτάξτε το Favicons από τις αγαπημένες σας μάρκες. Τι έχουν κάνει για να διασφαλίσουν ότι η διαδικτυακή τους εικόνα θα περάσει με favicon;
  • Εξετάστε το ενδεχόμενο να γεμίσετε ολόκληρο το χώρο με ένα συμπαγές έγχρωμο φόντο ή να κάνετε ένα διαφανές φόντο με το στοιχείο προσκηνίου τεντωμένο έτσι ώστε να αγγίζει τις άκρες. Θα παρατηρήσετε ότι πολλές μεγαλύτερες μάρκες έχουν διαφανές υπόβαθρο για τα Favicons τους.
  • Το αρχείο ICO format λειτουργεί καλά για μικρότερες εικόνες. Εάν δεν είστε εξοικειωμένοι, χρησιμοποιήστε ένα PNG για διαφανή φόντο ή ένα JPG για Favicons υψηλής ανάλυσης με συμπαγές φόντο.

Πώς να δημιουργήσετε ένα Favicon για εσάς Shopify κατάστημα

Έχετε την επιλογή να σχεδιάσετε ένα Favicon σε οποιοδήποτε λογισμικό σχεδιασμού της επιλογής σας. Εάν προτιμάτε το Photoshop, συνεχίστε με αυτό. Εάν προτιμάτε ένα δωρεάν λογισμικό όπως το GIMP ή το Pixlr, όλα λειτουργούν αρκεί να τηρείτε τις απαιτούμενες διαστάσεις 32 × 32.

Έχετε επίσης την επιλογή να δημιουργήσετε ένα Favicon με ShopifyHatchful λογότυπο και δωρεάν Favicon Generator. Δείτε ολόκληρο τον οδηγό μας κατά τη χρήση Εκκεντρικός για να δημιουργήσετε ένα λογότυπο.

λήψη λογότυπου

Μόλις ο δημιουργός του λογότυπου κάνει τη δουλειά του, σας παρέχει ένα αρχείο γεμάτο με πολλαπλά λογότυπα formats, ένα από τα οποία είναι ένα Favicon.

Shopify Αρχείο Favicon

Λάβετε υπόψη ότι πολλά από τα λογότυπα με τα οποία δημιουργείτε Εκκεντρικός (διαβάστε το δικό μας Εκπληκτική κριτική) Χρησιμοποιήστε κενό διάστημα γύρω από το λογότυπο, οπότε ίσως χρειαστεί να το προσαρμόσετε ώστε το γραφικό να καλύπτει το μεγαλύτερο μέρος του χώρου. Σε γενικές γραμμές, έχω διαπιστώσει ότι θα πρέπει να χρησιμοποιείτε το παρεχόμενο Hatchful favicon μόνο εάν φαίνεται ήδη καλό (γεμίζει το μεγαλύτερο μέρος του χώρου και δεν έχει μικρά στοιχεία όπως το κείμενο).

Εάν αυτό δεν συμβαίνει, χρησιμοποιήστε ένα λογισμικό επεξεργασίας τρίτου μέρους όπως το Photoshop ή το Pixlr για να αποκόψετε ορισμένα από τα περιττά στοιχεία.

σημαντικό: Πρέπει να χρησιμοποιήσετε μια μεγαλύτερη έκδοση της εικόνας, εάν σκοπεύετε να την τεντώσετε πάνω από έναν καμβά για να κόψετε το κείμενο και το κενό διάστημα. Για αυτό, χρησιμοποίησα το Hatchful για να δημιουργήσω λογότυπα, αλλά στην πραγματικότητα πήρα ένα από τα μεγάλα λογότυπα (όχι το αρχείο Favicon που παρέχεται) αφού δεν θέλω να θολώσει όταν το τεντώσω πάνω από τον καμβά 32 × 32.

Μέσα στο λογισμικό επεξεργασίας, επιλέξτε έναν νέο καμβά με το πλάτος και το ύψος και τα δύο να είναι 32.

32 από 32

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

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

μεγάλη έκδοση

Όπως μπορείτε να δείτε, η σμίκρυνση του Favicon στον σχεδιαστή Pixlr φαίνεται καλή. Έχω καλύψει το μεγαλύτερο μέρος του παραχωρούμενου χώρου, επέλεξα ένα φωτεινό και συμπαγές εικονίδιο χρώματος και έχω αφαιρέσει όλα τα σημάδια μικρότερου κειμένου.

μικρότερη έκδοση

Το τελευταίο βήμα είναι να κατεβάσετε το αρχείο. Μπορείτε να επιλέξετε να το κάνετε ένα διαφανές PNG σε αυτό το σημείο. Αλλά για αυτό το σεμινάριο κολλώ με ένα JPG υψηλής ανάλυσης έτσι ώστε να φαίνεται όσο το δυνατόν πιο ευκρινές. Και δεν με πειράζει να έχω φόντο με συμπαγές χρώμα.

Κατεβάστε - Shopify Favicon

Επιστροφή στην σας Shopify ταμπλό. Κάντε κλικ στο Διαδικτυακό κατάστημα> Θέματα> Προσαρμογή.

Στη συνέχεια, μεταβείτε στις Ρυθμίσεις θέματος> Favicon.

Ανεβάστε το νέο Favicon και κάντε κλικ στο κουμπί Αποθήκευση στο Shopify συντάκτης.

προεπισκόπηση εικόνας

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

το τελικό προϊόν - Shopify Favicon

Συμπέρασμα

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

Λάβετε υπόψη ότι δεν πρέπει να είστε σίγουροι για μια θολή ή δυσανάγνωστη Shopify Favicon εικόνα. Εάν διαπιστώσετε ότι το πρώτο Favicon δεν φαίνεται σωστό ή θέλετε να κόψετε κάποιο κείμενο ή να προσθέσετε ένα διαφανές φόντο, επιστρέψτε στην αρχή και πάρτε το σωστό. Αν και δεν είναι καλή ιδέα να μην έχετε καθόλου Favicon, ένα θολό ή δυσδιάκριτο Favicon κάνει την επωνυμία σας να φαίνεται μη επαγγελματική και κάπως ανόητη.

Αν έχετε απορίες σχετικά με την προσθήκη του Favicons στο Shopify, ή να φτιάξετε το δικό σας Shopify Favicon, ενημερώστε μας στην παρακάτω ενότητα σχολίων.

Joe Warnimont

Ο Joe Warnimont είναι συγγραφέας από το Σικάγο που επικεντρώνεται στα εργαλεία ηλεκτρονικού εμπορίου, το WordPress και τα κοινωνικά μέσα. Όταν δεν ψαρεύει ή δεν κάνει γιόγκα, συλλέγει γραμματόσημα σε εθνικά πάρκα (αν και αυτό είναι κυρίως για παιδιά). Δείτε το χαρτοφυλάκιο του Joe για να επικοινωνήσετε μαζί του και να δείτε προηγούμενες δουλειές.

Σχόλια απαντήσεις 0

Αφήστε μια απάντηση

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

Βαθμολογία *

Αυτός ο ιστότοπος χρησιμοποιεί το Akismet για να μειώσει το spam. Μάθετε πώς επεξεργάζονται τα δεδομένα των σχολίων σας.