Widget χάρτη για Shopify

Γιατί μια ενότητα θέματος είναι καλύτερη από εφαρμογή Shopify

Οι περισσότερες καταχωρίσεις «εφαρμογής χάρτη» ζητούν εγκατάσταση, δικαιώματα στα δεδομένα του καταστήματός σας και μηνιαία συνδρομή — για κάτι που τελικά είναι ένα iframe. Αυτή είναι η ειλικρινής εναλλακτική: ένα μόνο αρχείο Liquid που ζει μέσα στο δικό σας θέμα. Δεν ζητά δικαιώματα στο κατάστημα, δεν προσθέτει σκριπτ στις σελίδες σας, δεν στέλνει δεδομένα πουθενά και δεν κοστίζει τίποτα. Τα μόνα εξωτερικά αιτήματα που κάνουν οι επισκέπτες σας είναι το iframe χάρτη σε sandbox από το whatismylocation.ai και τα πλακίδια OpenStreetMap του — χωρίς cookies της Google, χωρίς βάρος από banner συγκατάθεσης. Κι αν κάποτε η υπηρεσία δεν είναι προσβάσιμη, το iframe αποτυγχάνει σιωπηλά χωρίς να χαλάσει τη σελίδα σας. Διαγράψτε το αρχείο της ενότητας και κάθε ίχνος εξαφανίζεται.

Κατεβάστε το whatismylocation-shopify-sections.zip — και οι δύο ενότητες μαζί με ένα README, λίγα κιλομπάιτ. Μετά ακολουθήστε τα βήματα εγκατάστασης παρακάτω.

Εγκατάσταση σε περίπου δύο λεπτά

Δύο μέρη: επικολλάτε το αρχείο μία φορά και μετά το χρησιμοποιείτε όπως κάθε ενσωματωμένη ενότητα.

Επικόλληση του αρχείου: διαχειριστικό Shopify ▸ Online Store ▸ Themes ▸ ⋯ ▸ Edit code. Στην αριστερή στήλη, κάτω από το Sections, πατήστε Add a new section, ονομάστε το whatismylocation-map, διαγράψτε το προσωρινό περιεχόμενο και επικολλήστε ολόκληρο το περιεχόμενο του whatismylocation-map.liquid — το μπλοκ {% schema %} στο τέλος είναι αυτό που φτιάχνει το πάνελ ρυθμίσεων, οπότε πρέπει να συμπεριληφθεί. Αποθηκεύστε.

Χρήση: ανοίξτε τον επεξεργαστή θέματος (Customize), πηγαίνετε στη σελίδα επικοινωνίας (ή σε οποιαδήποτε σελίδα), πατήστε Add section και επιλέξτε WhatIsMyLocation Map. Το πάνελ ρυθμίσεων εμφανίζεται στα αριστερά. Μέχρι να εισαγάγετε συντεταγμένες, η ενότητα δείχνει ένα φιλικό μήνυμα που σας λέει ακριβώς τι χρειάζεται.

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

Τα υποκαταστήματα είναι μπλοκ

Τα καταστήματα με πολλά σημεία κερδίζουν το καλύτερο κομμάτι: στον επεξεργαστή θέματος, κάθε υποκατάστημα είναι ένα μπλοκ — πατήστε Add branch, συμπληρώστε γεωγραφικό πλάτος, μήκος, μια ετικέτα και μια διεύθυνση, και αλλάξτε τη σειρά τους σύροντας (έως 10). Ο χάρτης προσαρμόζεται αυτόματα σε όλα τα υποκαταστήματα, οι πινέζες είναι αριθμημένες ώστε να ταιριάζουν με τη λίστα και οι επισκέπτες βλέπουν το πάνελ τοποθεσιών — ένα ακορντεόν δίπλα στον χάρτη σε υπολογιστή, μια λωρίδα καρτών με σάρωση στα κινητά, με οδηγίες πλοήγησης για κάθε υποκατάστημα και προαιρετικά εικονίδια «Άνοιγμα σε Google Maps / Apple Maps». Η διάταξη του πάνελ (auto, πλάι, κάτω, καμία) και το εφέ εναλλαγής (ομαλό, σβήσιμο, ζωηρό, κανένα — οι επισκέπτες με μειωμένη κίνηση παίρνουν πάντα την άμεση εκδοχή) είναι αναπτυσσόμενες λίστες στο ίδιο πάνελ.

Όλες οι ρυθμίσεις με μια ματιά

Το ίδιο zip περιλαμβάνει το whatismylocation-widget.liquid — το widget εύρεσης τοποθεσίας ως δεύτερη ενότητα (θέμα, συμπτυγμένη/πλήρης λειτουργία, ύψος), για σελίδες παράδοσης και εντοπισμού καταστημάτων.

Επίλυση προβλημάτων

Η ενότητα δεν εμφανίζεται στο Add section. Το αρχείο πρέπει να βρίσκεται στο Sections (όχι στα Snippets ή στα Assets) και η επικόλληση πρέπει να περιλαμβάνει όλο το αρχείο. Αν κόπηκε το μπλοκ {% schema %}, το Shopify απορρίπτει ή κρύβει την ενότητα. Επικολλήστε ξανά ολόκληρο το αρχείο και αποθηκεύστε.

Σφάλμα «Invalid schema» κατά την αποθήκευση. Μερική επικόλληση — συνήθως λείπει ένα άγκιστρο κλεισίματος, επειδή η επιλογή σταμάτησε μια γραμμή πριν το τέλος. Επικολλήστε πάλι το πλήρες αρχείο· μην επεξεργάζεστε το schema με το χέρι αν δεν γνωρίζετε Liquid.

Ο χάρτης είναι γκρι. Τα πλακίδια του χάρτη έρχονται από το tile.openstreetmap.org· ένας επιθετικός ad-blocker ή ένα εταιρικό δίκτυο μπορεί να τα μπλοκάρει. Δοκιμάστε σε κινητό με δεδομένα — οι πελάτες σας σχεδόν σίγουρα τον βλέπουν κανονικά.

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

Οι αλλαγές δεν φαίνονται στο ζωντανό κατάστημα. Επεξεργαστήκατε πρόχειρο ή μη δημοσιευμένο θέμα — κάντε την αλλαγή στο δημοσιευμένο θέμα ή δημοσιεύστε αυτό που επεξεργαστήκατε. Το widget το ίδιο δεν έχει τίποτα σε cache.