3 ΠΡΟΣΘΗΚΗ ΔΙΑΧΩΡΙΣΤΙΚΗΣ ΓΡΑΜΜΗΣ ΜΕΤΑΞΥ ΤΩΝ ΑΝΑΡΤΗΣΕΩΝ

Αν δεν θέλετε μια απλή γραμμή μεταξύ των αναρτήσεων σας,αλλά ξεχωριστές γραμμές που θα έχετε επιλέξει μόνο εσείς τότε διαβάστε αυτή την ανάρτηση!
Πρώτα από όλα πρέπει να βρείτε την (εικόνα)γραμμή στο διαδίκτυο που θα τοποθετήσετε.
Πρέπει να προσέξετε το πλάτος της να είναι μικρότερο απο αυτό των αναρτήσεων σας #main-wrapper { ώστε να μην φαίνεται παραμορφωμένη.

#main-wrapper {
float: left;
width: 587px;

Τεράστια γκάμα dividers lines(διαχωριστικών γραμμών) έχει εδώ

ΒΗΜΑΤΑ:

1. Δημιουργία αντιγράφου ασφαλείας
2. Πίνακας Ελέγχου►Σχεδίαση►Επεξεργασία HTML
3. Βρείτε το ακόλουθο μέρος κωδικού

.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
}

      4. Αντικαταστήστε το με τον παρακάτω

.post {

background: url(url of picture);

background-repeat: no-repeat;

background-position: bottom center;

margin:.5em 0 1.5em;

border-bottom:0px dotted $bordercolor;

padding-bottom:3.5em;

}

....ο κωδικός στο βήμα 3 μπορεί να είναι λίγο διαφορετικός.Σημαντικό είναι να βρείτε την παράγραφο με το  .post {

     5. Αντικαταστήστε το πορτοκαλί τμήμα με το url της εικόνας σας(γραμμής).Επίσης μπορείτε να αυξήσετε/μειώσετε την αξία του padding-bottom:3.5em; για να δημιουργήσετε χώρο μεταξύ της γραμμής και του κάτω μέρους των αναρτήσεών σας.

     6.Προεπισκόπηση
     7.ΑΠΟΘΗΚΕΥΣΗ ΠΡΟΤΥΠΟΥ

*Θα σας δείξω και έναν δεύτερο τρόπο να προσθέσετε στο blog σας dividers lines ΜΟΝΟ εάν ο πρώτος δεν λειτουργεί ή αντιμετωπίσετε προβλήματα.

ΒΗΜΑTA:

1. Δημιουργία αντιγράφου ασφαλείας
2. Πίνακας Ελέγχου ►Σχεδίαση►Επεξεργασία HTML►Τσεκάρετε Επέκταση προτύπων γραφικών στοιχείων
3. Με την βοήθεια του ctrl-f βρείτε το παρακάτω μέρος κωδικού

<div class='post-footer-line post-footer-line-3'/>

     4.  Αμέσως μετά απο αυτή την γραμμή τοποθετήστε το παρακάτω κωδικό

<center><img height='20' src='url of your picture'/></center>

    5.Προεπισκόπηση
    6.ΑΠΟΘΗΚΕΥΣΗ ΠΡΟΤΥΠΟΥ

ΑΝ ΣΑΣ ΑΡΕΣΕ ΤΟ ΑΡΘΡΟ ΒΑΘΜΟΛΟΓΗΣΤΕ Ή ΑΦΗΣΤΕ ΤΟ ΣΧΟΛΙΟ ΣΑΣ!!!