• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

ΠΩΣ ΝΑ ΕΜΦΑΝΙΖΩΝΤΑΙ ΟΙ ΑΝΑΡΤΗΣΕΙΣ ΤΟΥ BLOGGER ΣΕ GALLERY STYLE

GRID VIEW STYLE
ΠΩΣ ΝΑ ΕΜΦΑΝΙΖΟΝΤΑΙ ΟΙ ΑΝΑΡΤΗΣΕΙΣ ΤΟΥ BLOGGER ΣΕ GALLERY STYLE
Με την προσθήκη του παρακάτω κώδικα μπορείτε να αλλάξετε το στυλ εμφάνισης των αναρτήσεων του blogger από list view σε grid view ή αλλιώς σε gallery style. Ο κώδικας αυτός μπαίνει μέσα στο πρότυπο πρίν την ετικέτα </head> Ρυθμίστε το πλάτος width:230px; ανάλογα με το πόσο είναι το συνολικό πλάτος ανάρτησης που διαθέτετε και το πόσες αναρτήσεις θέλετε να εμφανίζονται ανα σειρά.

Μπορούν να εμφανίζονται από 2 μέχρι 5 ανάλογα πάντα με το πλάτος που διαθέτετε. Ρυθμίστε το ύψος height:430px; (υπάρχει 2 φορές). Ρυθμίστε το πλατος και το ύψος της εικόνας ανάρτησης στη γραμμή .post img {max-width:210px;max-height:140px; min-width:210px;min-height:140px;} Αν θέλετε να εμφανίζεται η ημερομηνία αφαιρέστε τη γραμμή h2.date-header {display: none;} Μετά την προσθήκη του παρακάτω κώδικα θα έρθουν τέρμα δεξια τα link Νεότερες και Παλαιότερες αναρτήσεις για να διορθωθεί αυτό εντοπίστε μέσα στο πρότυπο την γραμμή <b:includable id='nextprev'> και ακριβώς από κάτω της επικολλήσε την παρακάτω γραμμή. <div style='clear:both;'/> Σώστε το πρότυπο και δέστε το αποτέλεσμα. Οι αναρτήσεις θα εμφανίζονται όπως εμφανίζονται στην αρχική σελίδα αυτού του blog.

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style>
.post {width:230px;height:430px;background:#transparent;border-radius:5px;border:1px solid #00FF00;overflow:hidden;}
h3.post-title{background:#661111;height:70px;padding:5px;font:16px Arial;}
.post img {max-width:210px;max-height:140px;min-width:210px;min-height:140px;}
.post-body {padding:5px;height:430px;font-family:Arial; font-size: 13px; margin:5px;}
.post-footer {display:none;}
.date-outer {float:left;background:none;border:none;}
.post-labels {display:none;}
.jump-link {display:none;}
h2.date-header {display: none;}
.mobile .post {width:auto;height:auto;}
.mobile .post-body {height:auto;}
</style>
</b:if></b:if>

4 σχόλια:

  1. καλησπερα. θελω να αλλαξω το πως θα φαινονται οι αναρτησεις μου .. δηλαδη κατι σαν το παραπανω ..σε κουτια αλλα δεν θελω να μου αλλαξει η γενικη μορφοποιηση . δηλαδη θελω να μεινει το υπολοιπο ως εχει και να βαλω απλα σε κουτια αναρτησεις ανα δυο... γινεται αυτο ; ευχαριστω

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Απο ότι βλέπεις στο blog μου που το έχω εφαρμόσει δεν έχει αλλάξει η υπόλοιπη μορφοποίηση, αλλά υπάρχει το μειονέκτημα ότι τα share buttons και το like button δεν τα εμφανίζω γιατι θα μου πάρει πολύ χώρο και θα φαίνεται άσχημα και επίσης θα αργεί περισσότερο να φορτώσει η σελίδα. Γίνεται αν αλλάξεις τις διαστάσεις width και height να εμφανίσεις 2-5 αναρτήσεις ανά γραμμή.

      Διαγραφή
  2. καλημέραα..ειδικέ! θελω να χρησιμοποιησω το γκαλερι στυλ στο blog μου cashoutgr.blogspot.gr
    απλά θέλω να ειναι σε ασπρο φόντο με μαυρα γραμματα το κείμενο..η επικεφαλίδα επισης το ιδιο...η ημερομηνια και ώρα σε πράσινο χρωμα.. και όλα σε γραμματοσειρα..Trebuchet... αν ειναι ευκολο να μου "εφτιαχνες" τον κώδικα..?θα το προσπαθησω και μονος αλλα δεν ξερω αν τα καταφέρω!

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Δεν αρκεί να στο φτιάξω πρέπει να δοκιμαστεί στο blog σου και να αυξομειωθούν τα κουτάκια των αναρτήσεων. Δηλαδή πρέπει να έχω πρόσβαση στο blog σου για να κάνω τις σωστές ρυθμίσεις στο πλάτος. Καλύτερα να μιλήσουμε στο skype. Στείλε όνομα skype με e-mail και πές μου πότε μπορείς να σε καλέσω.

      Διαγραφή

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.