Κάθε widget του panelladikes.edu.gr υποστηρίζει πληθώρα attributes που επιτρέπουν τον πλήρη έλεγχο της εμφάνισης και της συμπεριφοράς του. Τα πιο σημαντικά είναι τα εξής:
| Attribute | Περιγραφή | Επιτρεπόμενες Τιμές / Παράδειγμα | Προεπιλογή |
| data-panelladikes-widget | Τύπος widget | katefthinsi, themata, sxoli, istoriko | – |
| data-year | Έτος (χρησιμοποιείται με themata) | π.χ. "2025" | – |
| data-id | Μοναδικός κωδικός (για sxoli ή istoriko) | π.χ. "123" | – |
| data-theme | Θέμα εμφάνισης | "light", "dark", "auto" | auto |
| data-width | Πλάτος iframe | π.χ. "800px", "50%" | Εξαρτάται από το widget |
| data-height | Ύψος iframe | π.χ. "600px" | Εξαρτάται από το widget |
| data-border | CSS border | π.χ. "1px solid #ccc" | 1px solid #ddd |
| data-radius | Border radius | π.χ. "8px" | 12px |
| data-shadow | Box shadow | π.χ. "0 4px 6px rgba(0,0,0,0.1)" | 0 4px 10px rgba(0,0,0,0.1) |
| data-align | Ευθυγράμμιση | "left", "center", "right" | center |
| data-responsive | Responsive behavior | "true", "false" | true |
| data-color | Background χρώμα | π.χ. "#f9f9f9" | – |
| data-lazy | Lazy loading | "true", "false" | true |
💡 Σημειώσεις:
- Μπορείτε να συνδυάσετε πολλά attributes σε ένα
<div>για να προσαρμόσετε το widget ακριβώς στις ανάγκες σας.- Το
data-responsive="true"επιτρέπει στο widget να προσαρμόζει το πλάτος του αυτόματα ανάλογα με τον περιέκτη.- Το
data-lazy="true"καθυστερεί τη φόρτωση του iframe μέχρι να εμφανιστεί στην οθόνη, βελτιώνοντας την ταχύτητα της σελίδας.