Εισαγάγετε ένα πλαίσιο Figma στο WordPress με το Page Builder Sandwich

Το Page Builder Sandwich Pro μετατρέπει ένα πλαίσιο Figma σε μια επεξεργάσιμη σελίδα WordPress. Ο ιστότοπος επικοινωνεί με το Figma μέσω του δικού σας λογαριασμού Figma, χρησιμοποιώντας ένα προσωπικό διακριτικό πρόσβασης που δημιουργείτε εσείς· κανένα σχέδιο ή διακριτικό δεν διέρχεται από το Zinn Digital®.

Σύνδεση του Figma (μία φορά, ως διαχειριστής)

1. Στο Figma, ανοίξτε το Settings → Security → Personal access tokens και δημιουργήστε ένα διακριτικό με το εύρος File content: read.
2. Στο wp-admin μεταβείτε στο Page Builder Sandwich → Import from other builders and Figma → Import from Figma, επικολλήστε το διακριτικό και πατήστε Connect Figma.

Το διακριτικό ελέγχεται με το Figma, αποθηκεύεται κρυπτογραφημένο και δεν εμφανίζεται ποτέ ξανά (μόνο οι τελευταίοι τέσσερις χαρακτήρες του). Η επιλογή Disconnect το καταργεί. Από τη γραμμή εντολών: echo <token> | wp pbs importers figma-token set (το διακριτικό διαβάζεται από την τυπική είσοδο, επομένως δεν αποθηκεύεται στο ιστορικό του κελύφους σας).

Εισαγωγή πλαισίου

1. Στο Figma, κάντε κλικ σε ένα πλαίσιο, κάντε δεξί κλικ πάνω του και επιλέξτε Copy/Paste as → Copy link to selection.
2. Επικολλήστε τον σύνδεσμο στο πεδίο Figma frame link και πατήστε Import the frame. Δημιουργείται μια νέα πρόχειρη σελίδα, η οποία ονομάζεται σύμφωνα με το πλαίσιο.

Πώς μετατρέπεται το σχέδιο

• Η λειτουργία Auto layout μετατρέπεται σε γραμμές και στήλες flex (και πλέγματα για αυτόματη διάταξη πλέγματος) με το ίδιο κενό, εσωτερικό περιθώριο και στοίχιση· ένα πλαίσιο με ελεύθερη διάταξη στοιβάζεται κατά τη σειρά ανάγνωσης, και η αναφορά το επισημαίνει όταν υπήρξε επικάλυψη επιπέδων.
• Ένα πλαίσιο σελίδας που αποτελείται από ζώνες πλήρους πλάτους γίνεται μία ενότητα πλήρους πλάτους ανά ζώνη.
• Το Κείμενο διατηρεί τη γραμματοσειρά, το μέγεθος, το βάρος, το ύψος γραμμής, το διάκενο γραμμάτων, τα πεζά/κεφαλαία, τη στοίχιση και το χρώμα του· τα μεγάλα κείμενα γίνονται επικεφαλίδες, ενώ τα τμήματα με έντονη και πλάγια γραφή καθώς και οι σύνδεσμοι διατηρούνται.
• Τα Γεμίσματα, τα περιγράμματα, η ακτίνα γωνιών και οι σκιές μεταφέρονται, συμπεριλαμβανομένων των διαβαθμίσεων.
• Οι Εικόνες αντιγράφονται στη βιβλιοθήκη πολυμέσων σας, και τα διανυσματικά γραφικά (εικονίδια, εικονογραφήσεις) αποδίδονται από το Figma και αντιγράφονται ως εικόνα (έως και 200 σχέδια ανά εισαγωγή). Η εκ νέου εισαγωγή του ίδιου πλαισίου επαναχρησιμοποιεί τα αντίγραφα.
• Ένα μικρό πλαίσιο με γέμισμα, στρογγυλεμένες γωνίες και μία σύντομη ετικέτα (ή ένα επίπεδο με την ονομασία «button») μετατρέπεται σε μπλοκ Button.

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

Από τη γραμμή εντολών: wp pbs importers figma <frame link>.