Elxis CMS Forum

Ελληνικό Forum => Γενικά Θέματα για το Elxis CMS => Topic started by: iraklis on November 27, 2014, 19:30:10

Title: Image gallery (gallery)
Post by: iraklis on November 27, 2014, 19:30:10
Στο πρόσθετο περιεχομένου gallery/παραμετροι
δινω υψος και πλατος μικρογραφίας 120 και δεν βλεπω καμια αλλαγη στο gallery δηλ. συνεχιζει και μου εμφανιζει τις εικονες με 80px
καμια γνωμη γιατι μπορει να συμβαινει αυτο?
Ευχαριστω....
Title: Re: Image gallery (gallery)
Post by: datahell on November 27, 2014, 20:18:03
Το plugin έχει μία γενική ρύθμιση για το πλάτος/ύψος των εικόνων στις παραμέτρους του. Αυτό εξ ορισμού είναι 80. Μπορείς να το αλλάξεις σε ότι θες.

Αν σε μία ενσωμάτωση του plugin δεν οριστεί το πλάτος/ύψος θα χρησιμοποιηθούν στη θέση τους οι τιμές από τις γενικές παραμέτρους του plugin.

Εισαγωγή plugin χωρίς πλάτος/ύψος. Θα χρησιμοποιηθούν οι γενικές τιμές από τις παραμέτρους του plugin.
{gallery}media/images/sample/{/gallery}

Εισαγωγή plugin με πλάτος/ύψος. Θα χρησιμοποιηθούν αυτές που δηλώνονται.
{gallery width="120" height="120"}media/images/sample/{/gallery}
Title: Re: Image gallery (gallery)
Post by: iraklis on November 27, 2014, 21:46:54
Το δοκίμασα και αυτο <code>{gallery width="120" height="120"}media/images/products_gallery/zebex_z_3151hs/{/gallery}</code> αλλα δεν εμφανιζει το σωστο μεγεθος...
καμια αλλη λυση ... τι παει στραβα ?
Title: Re: Image gallery (gallery)
Post by: datahell on November 27, 2014, 22:36:59
Το width και το height εφαρμόζονται από το plugin ως html attributes:

<img src="...." width="XXX" height="YYY" alt="image" />

Αυτό μπορεί να υπερκαλυφθεί από το css του template* σου (ή αλλού). Κάνε προβολή πηγαίου κώδικα και δες την html. Αν στην html είναι σωστά το width/height όπως τα έχεις βάλει τοτε το css στα χαλάει. Με το firebug ή άλλο παρόμοιο εργαλείο μπορείς εύκολα να βρεις ποιος κανόνας του css στο κάνει αυτό.

Μπορείς και εσύ μέσω css να τα πειράξεις έτσι:
.plug_gallery_box img { width:120px; height:120px; }

Δώσε ink προς την σελίδα για περισσότερα.

* Το template Flex του 4.2 βάζει width/height 80px στο a tag που περιέχει τις εικόνες για να κάνει ένα zoom εφέ. Οπότε ακόμα και αν μεγαλώσεις την εικόνα ο περιέκτης της (το a tag) θα παραμείνει το ίδιο. Γι αυτό πρέπει να πειράξεις και το a tag σε αυτή την περίπτωση.
.plug_gallery_box a { width:80px; height:80px; }
Title: Re: Image gallery (gallery)
Post by: iraklis on November 27, 2014, 22:57:54
Τελικά το CSS το χαλαει, ποιος ειναι ο σωστός τρόπος για να το διορθώσω? Αν βαλω height: 120px; width: 120px; τοτε θα ειναι παντα ετσι και δεν θα εχει νοημα το {gallery width="120" height="120"}{/gallery}

.plug_gallery_box a {
    border: 1px solid #c0c0c0;
    display: block;
    float: left;
    height: 80px;
    margin: 0 3px 3px 0;
    outline: medium none;
    overflow: hidden;
    padding: 2px;
    text-decoration: none;
    width: 80px;
}
Title: Re: Image gallery (gallery)
Post by: datahell on November 27, 2014, 23:01:38
Μπορείς να σβήσεις τα width/height στο css ή να βάλεις τις τιμές τους σε auto .

Πάντως αν δουλεύεις στο Flex θα πρέπει να λάβεις υπόψιν σου και το εφέ που είπα πριν. Αν δεν θες το zoom σβήσε τα width/height από το .plug_gallery_box a, σβήσε και αυτό εδώ:
.plug_gallery_box img:hover { transform: scale(2,2); }
και αυτά - τα κόκκινα:
.plug_gallery_box img {
   margin:0; padding:0; border:none; width:100%; height:auto; min-height:80px; background:none;
   -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -o-transition: all 0.5s ease;
   -ms-transition: all 0.5s ease;
   transition: all 0.5s ease;
}