Τετάρτη, 4 Ιανουαρίου 2012

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>


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

                                                                  




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

0 σχόλια:

Αναγνώστες

ShareThis

Για να λαμβάνετε όλες τις ενημερώσεις μέσω Facebook.Απλά κάντε κλίκ στο like button και γίνετε μέλη

Powered By | Useful Gadgets

 

Powered By Software Review