0 ΗΜΕΡΟΜΗΝΙΑ ΤΟΥ ΤΙΤΛΟΥ ΑΝΑΡΤΗΣΗΣ-ΜΕΤΑΚΙΝΗΣΗ ΗΜΕΡΟΜΗΝΙΑΣ

Σ'αύτη την ανάρτηση θα σας δείξω πως να μετακινήσετε την ημερομηνία κάτω απο τον τίτλο ανάρτησης.

Θα σας δείξω 2 τρόπους να ακολουθήσετε,σας προτείνω να χρησιμοποιήσετε το πρώτο παράδειγμα.Αν κάτι δεν πάει καλά τοτε ακολουθήστε το δεύτερο.

ΑΡΧΙΚΑ
►Λήψη πλήρους προτύπου
►Επέκταση προτύπων γραφικών στοιχείων

•Eντοπίστε το ακόλουθο τμήμα κωδικού

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>  

•Κάντε το ΑΠΟΚΟΠΗ και επικόλληση στο σημειωματάριο(notebook)των Windows
•Στην συνέχεια βρείτε αυτό το τμήμα κωδικού...

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

...Και επικολήστε τον κωδικό απο το notebook κάτω απο αυτό τον κωδικό,οπότε θα μοιάζει κάπως έτσι όλο μαζί

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

Τώρα θα δούμε πως θα προσαρμόσουμε τα περιθώρια της ημερομηνίας.
►
Διάταξη
►

Επεξεργασία Html

• Βρείτε το ακόλουθο κωδικό

h2.date-header {
margin: 1.5em 0 .5 em?
}

...Θα το αλλάξετε σε αυτό

h2.date-header {

margin: 0,5 em 0 1.5em ?

}

Στο ροζ , μειώνοντας το επάνω περιθώριο, έχουμε "τραβήξει" την ημερομηνία πρός τα πάνω..

... στο πράσινο , αυξάνοντας το κάτω περιθώριο, έχουμε κερδίσει κάποιο διάστημα μεταξύ της ημερομηνίας και του περιεχομένου.

Διαβάστε το επόμενο παράδειγμα,μόνο εάν το πρώτο δεν λειτουργεί στο προτυπό σας.

Πηγαίνετε
►Διάταξη
►Επεξεργασία Html
►Κλίκ επέκταση γραφικών στοιχείων

• Εισάγεται τον κωδικό σε ρόζ πάνω απο τον κωδικό με το λευκό χρώμα(θα τον βρείτε με το ctrl-f)

#mydate {
margin:1.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;
}
.date-header {
display:none;
}

]]></b:skin>
</head>

Μπορείτε φυσικά να το προσαρμόσετε ανάλογα με τα γούστα σας π.χ(αλλάγη του χρώματος γραμματοσειράς,τα περιθώρια,το χρώμα)

Στην συνέχεια βρείτε τον ακόλουθο κωδικό με την βοήθεια του ctrl-f...

<b:includable id='post' var='post'>
<div class='post hentry'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>  

...o κωδικός σας μπορεί να είναι λίγο διαφορετικός(όπως το τμήμα σε μπλέ) αλλά η διαδικασιά είναι η ίδια
...Επόμενο βήμα είναι να προσθέσετε την παρακάτω γραμμή κώδικα

<div id='mydate'> <data:post.dateHeader/> </ p>

...Πρέπει να την τοποθετήσετε κάτω απο την άνω γραμμή κώδικα ώστε το αποτέλεσμα να είναι αυτό...

<b:includable id='post' var='post'>
<div class='post hentry'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>


<div id='mydate'><data:post.dateHeader/></div>

ΑΠΟΘΗΚΕΥΣΗ ΠΡΟΤΥΠΟΥ

                                                                  

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