Πέμπτη, 5 Ιανουαρίου 2012

1 ΠΡΟΣΑΡΜΟΓΗ ΣΤΟ ΥΠΟΣΕΛΙΔΟ(ΠΑΛΑΙΟΤΕΡΕΣ-ΝΕΟΤΕΡΕΣ ΑΝΑΡΤΗΣΕΙΣ)



Σ'αυτή την ανάρτηση θα προσαρμόσουμε λιγάκι το υποσέλιδο του blog μας,και συγκεκριμένα τις συνδέσεις παλαιότερες και νεότερες αναρτήσεις.Μπορούμε να αλλάξουμε το κείμενο με αυτό της αρεσκείας μας ή να βάλουμε εικονίδιο δίπλα απο το κείμενο ή και να αντικαταστήσουμε το κείμενο με εικόνα της αρεσκείας μας.Άς ξεκινήσουμε.Αρχικά...
.... 
►Σχεδίαση
►Επεξεργασία Html
►Κλίκ επέκταση προτύπων γραφικών στοιχείων
  • Με την βοήθεια του ctrl-f βρείτε το παρακάτω τμήμα κωδικού(δεν κάνουμε αντιγραφή και επικόλληση στην εύρεση όλο αυτό το τμήμα,μόνο την πρώτη γραμμή)

<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

</div>
<div class='clear'/>
</b:includable>

Τώρα όπως βλέπετε υπάρχουν 3 διαφορετικά μέρη του κωδικού...
-με το ρόζ είναι ο κωδικός για τις νεότερες αναρτήσεις
-με το πορτοκαλί είναι για τις παλαιότερες
-με το πράσινο είναι η αρχική σελίδα

                                         Αλλάξτε το κείμενο των συνδέσεων

Πρέπει να αντικαταστήσετε τα επόμενα μέρη του αρχικού κωδικού,με όποιο κείμενο σας αρέσει
► αντικατάσταση <data:newerPageTitle/> με, για παράδειγμα NEXT POST
►  αντικατάσταση  <data:olderPageTitle/> με, για παράδειγμα PREVIOUS POST
► αντικατάσταση <data:homeMsg/> (μόνο το πρώτο) με, για παράδειγμα HOMEPAGE

  • Δείτε τον κωδικό ολοκληρωμένο
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'>NEXT POST</a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>PREVIOUS POST</a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'>HOMPAGE</a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

</div>
<div class='clear'/>
</b:includable>
                                         Βάλτε εικονίδιο/icon ή είκονα/image
                                                δίπλα στους συνδέσμους

Θα πρέπει να εισάγετε τον κωδικό για την εικόνα

<Img src = " http://i42.tinypic.com/zn4qic.jpg "/>
Αντικαταστήστε το πορτοκαλί χρώμα με το url της εικόνας σας

  • Δείτε τον κωδικό ολόκληρο
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><img src='http://i42.tinypic.com/zn4qic.jpg'/><data:newerPageTitle/></a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/><img src='http://i40.tinypic.com/sfcox4.jpg'/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

</div>
<div class='clear'/>
</b:includable>  
                                            Εικόνα/image αντί των συνδέσεων

Εδώ μπορείτε να βάλετε όποιο είδος εικόνας θέλετε,φτάνει να χρησιμοποιήσετε το παρακάτω κωδικό
<img src='URL ADDRESS'/>
Απλώς αντικαθιστάτε το ρόζ μέρος με την εικόνα(url)που θέλετε
► αντικατάσταση <data:newerPageTitle/> με εικόνα για νεότερες αναρτήσεις
► αντικατάσταση <data:olderPageTitle/> με εικόνα για παλαιότερες αναρτήσεις
► αντικατάσταση <data:homeMsg/> (only the first one) με εικόνα για την αρχική σελίδα

  • Δείτε τον κώδικα ολοκληρωμένο
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><img src='URL ADDRESS'/></a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><img src='URL ADDRESS'/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img src='URL ADDRESS'/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

</div>
<div class='clear'/>
</b:includable>

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



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

1 σχόλια:

Mantinadesblog.gr είπε...

Απίστευτη Ανάρτηση...!! με βοήθησε να βγάλω εντελώς τα κουμπάκια.... www.mantinadesblog.gr

Αναγνώστες

ShareThis

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

Powered By | Useful Gadgets

 

Powered By Software Review