Blogger Tips – Tricks – Gadgets – Templates – Hacks

Ετικέτες (Προσθήκη, Επεξεργασία ή Διαγραφή) στις Αναρτήσεις σας – Add, Edit or Delete Labels (or categories,tags) In Blogger Posts



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Η κατηγοριοποίηση των αναρτήσεών μας είναι μία από τις σημαντικότερες λειτουργίες του Blogger.

Με τις θεματικές ενότητες (ετικέτες, κατηγορίες, φάκελοι, labels, categories, tags) βοηθάμε και τους επισκέπτες μας να βρουν γρήγορα το κομμάτι του blog μας που τους ενδιαφέρει, αλλά και τον εαυτό μας, αν θελήσουμε στο μέλλον να βρούμε γρήγορα μια παλιά μας ανάρτηση.

Σε όλες τις εποχές ο άνθρωπος για να απλουστεύσει την καθημερινότητά του, προσπαθούσε να κατηγοριοποιήσει τα πράγματα γύρω του και να τα βάλει σε μια Τάξη. Γιατί αλλιώς επέρχεται ένα Χάος.

Σε σχεδόν όλες τις σελίδες στον ιστό, οι χιλιάδες πληροφορίες είναι ταξινομημένες σε θεματικές ενότητες. Και ειδικά στις μεγάλες ιστοσελίδες, που έχουν εκατομμύρια πληροφορίες για κάθε τι. Προσπαθήστε να φανταστείτε την Wikipedia, χωρίς να είχε ταξινομήσει τα άρθρα της σε κατηγορίες.

Δεν θέλω να καταντήσω σχολαστικός (όλοι πιστεύω καταλάβατε τη σημαντικότητα της κατηγοριοποίησης), για αυτό πάμε να σας εξηγήσω πως μπορείτε να προσθέσετε ετικέτες στις αναρτήσεις σας, πως μπορείτε να διαγράψετε ή να αντικαταστήσετε τις ετικέτες σας και γενικώς πως θα τις επεξεργάζεστε.




ΠΩΣ ΕΠΕΞΕΡΓΑΖΟΜΑΣΤΕ ΓΕΝΙΚΑ ΤΙΣ ΕΤΙΚΕΤΕΣ ΣΤΙΣ ΑΝΑΡΤΗΣΕΙΣ ΜΑΣ?



Η όλη δυνατή επεξεργασία, μπορεί να γίνει από την επεξεργασία αναρτήσεων (Πανόπτης>Ανάρτηση>Επεξεργασία Αναρτήσεων).

Από εδώ μπορούμε να δημιουργήσουμε, να διαγράψουμε ετικέτες και να κατατάξουμε τις αναρτήσεις μας στις ετικέτες μας.

Δεν υπάρχει περιορισμός ετικετών που μπορούμε γενικά ή και σε μια μόνο ανάρτηση.

Ωστόσο προτείνω οι ετικέτες μας να είναι όσο το δυνατόν πιο λίγες, γιατί αν έχουμε 500 αναρτήσεις και 200 ετικέτες, τότε χάνεται το νόημα των ετικετών νομίζω. Ούτε όμως να έχουμε 500 αναρτήσεις και 2 ετικέτες. Το ιδανικό είναι, πιστεύω, στις 500 αναρτήσεις να έχουμε περίπου 50 ετικέτες, δηλαδή 1 προς 10, αλλά αυτό ΔΕΝ είναι σε καμία περίπτωση απόλυτο, γιατί εξαρτάται και από την θεματολογία του blog.




ΠΩΣ ΒΑΖΟΥΜΕ ΕΤΙΚΕΤΕΣ ΣΤΙΣ ΑΝΑΡΤΗΣΕΙΣ ΜΑΣ?


Εικόνα 1



Την ώρα που γράφουμε μια νέα ανάρτηση -πριν την δημοσιεύσουμε (ή και μετά)– μπορούμε να την φακελοποιήσουμε με νέες ή ήδη υπάρχουσες αναρτήσεις. Το πως γίνεται αυτό περιγράφεται στις εικόνες (1) και (2).


Εικόνα 2


Εικόνα 3



Αλλιώς μπορούμε να δημιουργήσουμε μια νέα ετικέτα από την επεξεργασία αναρτήσεων, και πολύ γρήγορα να προσθέσουμε σε αυτήν πολλές αναρτήσεις μαζί. Αρχικά δημιουργούμε την ετικέτα, όπως περιγράφεται στην εικόνα (4). Μετά κάνουμε “τσεκ” στα κουτάκια των αναρτήσεων, που θέλουμε να βάλουμε στην ετικέτα που μόλις δημιουργήσαμε και μετά πάμε και πατάμε πάνω σε αυτήν την ετικέτα (εικόνα 3) ώστε να της προστεθούν οι αναρτήσεις που έχουμε τσεκάρει. Αυτός είναι και ο πιο φυσιολογικός τρόπος.


Εικόνα 4




ΠΩΣ ΔΙΑΓΡΑΦΟΥΜΕ ΕΤΙΚΕΤΕΣ ΣΤΙΣ ΑΝΑΡΤΗΣΕΙΣ ΜΑΣ?



Μπορούμε να διαγράψουμε τις ετικέτες από τις αναρτήσεις μόνο με έναν τρόπο.

Μπαίνοντας στην επεξεργασία κάθε ανάρτησης ξεχωριστά και αφαιρώντας από εκεί την ετικέτα που δεν θέλουμε.


Εικόνα 5



Ας πούμε ότι θέλουμε να διαγράψουμε π.χ. μια ετικέτα που τώρα έχει προστεθεί σε 50 αναρτήσεις. Τότε πρέπει να πάμε στην επεξεργασία αυτών των 50 αναρτήσεων ξεχωριστά και να αφαιρέσουμε την εν λόγω ετικέτα από την κάθε μία ανάρτηση. Αλλά αν έχουμε συνολικά 5000 αναρτήσεις πως θα βρούμε αυτές τις 50? Για αυτό προτείνω να κάνουμε αυτό που απεικονίζεται στην εικόνα (5): από την επεξεργασία αναρτήσεων να πατήσουμε πάνω στην ετικέτα που θέλουμε να διαγράψουμε, ώστε να μας εμφανίσει “μαζεμένες” τις 50 αναρτήσεις και να μην ψάχνουμε. Έτσι για περισσότερη ευκολία το λέω αυτό.




ΠΡΟΣΘΗΚΗ ΤΟΥ GADGET ΤΩΝ ΕΤΙΚΕΤΩΝ ΣΤΗ ΣΕΛΙΔΑ ΣΑΣ



Η προσθήκη του είναι πολύ εύκολη.

Από τον Πανόπτη μας, πάμε στη Σχεδίαση -ενώ βρισκόμαστε στα Στοιχεία Σελίδας- πατάμε Προσθήκη Gadget και βάζουμε το έκτο από το τέλος Gadget με τίτλο “Ετικέτες”.

Το ρυθμίζουμε ανάλογα με το πως θέλουμε να φαίνεται, το αποθηκεύουμε και μετά το βάζουμε στη θέση που θέλουμε να είναι μέσα στο blog.

Αυτό ήταν!





Πάνω-κάτω οι έμπειροι bloggers τα ξέρουν αυτά, αλλά έχω δεχτεί πολλά μαιλς από νέους blogger και όφειλα να γράψω αυτή την ανάρτηση.





Νομίζω έχω αναλύσει όλες τις πτυχές των ετικετών, αν παρολ’αυτά θέλετε κάτι ακόμα να ρωτήσετε ή κάτι να προσθέσετε που νομίζετε ότι λύπει, περιμένω τα σχόλιά σας.




Αν σας άρεσε η παραπάνω ανάρτηση “κρεμάστε” την στο wall του facebook σας, πατώντας το παρακάτω κουμπί. Ευχαριστώ!


Copyrights: http://www.bloggertips.gr/




Οριζόντιο blogger menu -ΜΕ υποκαρτέλες- κάτω από τον τίτλο για προσθήκη συνδέσμων (2)



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Είναι μια μπάρα-μενού ΜΕ ΥΠΟΚΑΡΤΕΛΕΣ που την εγκαθιστάμε κάτω από τον τίτλο του blog μας και βάζουμε σε αυτή, links από αναρτήσεις μας, ετικέτες μας και ότι άλλο θέλουμε.



Θα φαίνεται κάπως έτσι:



Ακολουθήστε τα παρακάτω βήματα για να την βάλετε κι εσείς:



1. Σύνδεση στον blogger λογαριασμό μας από το blogger.com

2. Πανόπτης> Σχεδίαση> Επεξεργασία html

3. Με το ctrl+F βρείτε το </head>

4. Πάνω από αυτό επικολλήστε το παρακάτω:


<style type=’text/css’>

#foxmenucontainer{

height:29px;

background:url(http://i45.tinypic.com/rlw8qe.jpg) repeat-x;

display:block;

padding:0px 0 0px 0px;

border-top:1px solid #474747;

font: 14px "Century gothic",verdana, Arial, sans-serif;

font-weight:normal;

}



#menu ,#menu ul {

margin: 0px 5px;

padding: 0px;

list-style: none;

height:29px;

}



#menu a {

color: #B3DBEF;

display: block;

font-weight: normal;

padding: 4px 10px 6px 10px;

}



#menu a:hover {

background:url(http://i47.tinypic.com/20zxzdj.jpg) repeat-x;

color: #fff;

display: block;

text-decoration: none;

}



#menu li {

float: left;

margin: 0px 0 0px 0;

padding: 0px;

}



#menu li li {

float: left;

margin: px 0px 0px 5px;

padding: 0px;

width: 130px;

}



#menu li li a, #menu li li a:link, #menu li li a:visited {

background:url(http://i45.tinypic.com/rlw8qe.jpg) repeat-x;

width: 150px;

float: none;

margin: 0px;

padding: 4px 10px 5px 10px;

color:#fff;

}



#menu li li a:hover, #menu li li a:active {

background:url(http://i47.tinypic.com/20zxzdj.jpg) repeat-x;

width: 150px;

float: none;

margin: 0px;

padding: 4px 10px 5px 10px;

color:#06415F;

}



#menu li ul {

position: absolute;

width: 10em;

left: -999em;

z-index:1;

}



#menu li:hover ul {

left: auto;

display: block;

}



#menu li:hover ul, #menu li.sfhover ul {

left: auto;

}

</style>



5. Αποθηκεύουμε το πρότυπό μας

6. Σχεδίαση> Στοιχεία Σελίδας> Προσθήκη gadget> HTML/JavaScript

7. Βάλτε τον παρακάτω κωδικό:


<div id=”foxmenucontainer”>



<div id=”menu”>



<ul>



<li><a expr:href=”data:blog.homepageUrl”>Home</a></li>



<li><a href=”#” title=”#”>About</a></li>



<li><a href=”#” title=”#”>Tutorials</a>

<ul>

<li><a href=”#“>Blogger Tutorials</a></li>

<li><a href=”#“>HTML Tutorials</a></li>

<li><a href=”#“>JQuery Tutorials</a></li>

<li><a href=”#“>Blogger Tools</a></li>

<li><a href=”#“>Blogger Layouts</a></li>

<li><a href=”#“>Blogger Templates</a></li>

</ul>

</li>



<li><a href=”#” title=”#”>Contact</a></li>



</ul>



</div>



</div>



Όπου το # βάζετε το link σας και όπου About (και τα άλλα ονόματα) βάζετε το όνομα του link.



Προσέξτε τον χρωματισμό για να καταλάβετε καλύτερα!



8. Αποθήκευση κι είστε έτοιμοι!


Θα ακολουθήσουν κι άλλα σχέδια.


Τα σχόλιά σας, πάντα ευπρόσδεκτα!


Copyrights: /




Μετατροπή Των Τίτλων Στις Sidebars Από Κεφαλαία Σε Μικρά



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Θα έχετε προσέξει ότι σε κάποια Τemplates ο τίτλος των gadgets που περνάτε στις Sidebars αναγράφεται με κεφαλαία γράμματα (Όπως και το δικό μου).

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



1. Σύνδεση στον λογαριασμό σας από το blogger.com

2. Πανόπτης>Σχεδίαση>Επεξεργασία html

3. Ψάξτε εκεί (πατώντας ctrl και f) τον κώδικα text-transform:uppercase; και διαγράψτε τον. Σε περίπτωση που υπάρχουν περισσότεροι από ένας τέτοιοι κώδικες, επιλέξτε αυτόν που βρίσκεται στο σημείο “Sidebar Content”.

Κάντε προεπισκόπηση για να δείτε αν είναι όλα καλά, αποθηκεύστε και όλοι οι τίτλοι θα αναγράφονται πλέων με μικρά γράμματα…



Ο φίλος konsoulito μας δίνει επίσης την παρακάτω χρήσιμη πληροφορία:



Μπορούν ακόμη στο σημείο με ctrl+f που ψάχνουν το text-transform:uppercase; να μη το διαγράψουν και να το μετατρέψουν σε text-transform:upperfirstcase; Αυτό θα κάνει έναν τίτλο να έχει κεφαλαίο το πρώτο γράμμα της πρότασης και όλα τα υπόλοιπα πεζά.



Πηγές: Φώτο, κείμενο και κωδικός αντεγραμμένα από αυτή την ανάρτηση εδώ από το http://www.freeware-tools.net/

Copyrights: /




Πως εμφανίζονται μόνο οι τίτλοι των αναρτήσεων στις Ετικέτες?



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Πως γίνεται να εμφανίζονται μόνο οι τίτλοι των αναρτήσεων όταν πατάω σε μια ετικέτα?

Είναι πολύ εύκολο να το βάλετε και διευκολύνει πολύ τους επισκέπτες σας.Πατήστε εσείς εδώ για να δείτε.Δεν είναι καλύτερα που εμφανίζονται μόνο οι τίτλοι και όχι και αυτά που γράφουν.Πάμε να σας δείξω πως θα το βάλετε.



Ακολουθήστε με προσοχή τα παρακάτω βήματα:



1. Σύνδεση στον blogger account σας

2. Πανόπτης>Διάταξη>Επεξεργασία html

3. Τσέκαρε το τετραγωνάκι που λέει “Επέκταση προτύπων γραφικών στοιχείων”

4. Με τη βοήθεια του Ctrl + F βρες τους παρακάτω κώδικες:


<b:include data=’post’ name=’post’/>



5.Τώρα αντικατέστησε τον παραπάνω με τον παρακάτω κώδικα:



<b:if cond=’data:blog.homepageUrl

!= data:blog.url’>



<b:if cond=’data:blog.pageType != “item”‘>



<h3 class=’post-title’><a expr:href=’data:post.url’><data:post.title/></a></h3>



<b:else/>



<b:include data=’post’ name=’post’/>



</b:if>



<b:else/>



<b:include data=’post’ name=’post’/>



</b:if>



6. Κάντε προεπισκόπηση να δείτε αν θα σας το δεχτεί και αν σας το δεχτεί κάντε αποθήκευση.Αν όχι κάτι έχετε κάνει λάθος.



Τώρα πατήστε πάνω σε μια ετικέτα σας να δείτε το αποτέλεσμα.



Άφησέ μου ένα σχόλιο για να ξέρω αν σου βγήκε ή όχι.





ΑΝΑΔΗΜΟΣΙΕΥΣΗ ΑΠΟ 27-10-2009




Διέγραψε το “Εμφάνιση όλων των αναρτήσεων” από τις Ετικέτες



Print Friendly and PDFPrintPrint Friendly and PDFPDF




Όταν πατάτε πάνω σε μια ετικέτα(=label) δεν σας εμφανίζει ένα παραθυράκι που λέει “Εμφάνιση όλων των αναρτήσεων στην ετικέτα…”?

Όπως φαίνεται στη εικόνα.

Αν θέλετε να το διαγράψετε αυτό και να μην φαίνεται ακολουθήστε τα παρακάτω βήματα:



1. Σύνδεση στον λογαριασμό σας

2. Πανόπτης>>Διάταξη>>Επεξεργασία html>>Επέκταση προτύπων γραφικών στοιχείων

3. Βρες τους παρακάτω κώδικες:




<b:includable id=’status-message’>

<b:if cond=’data:navMessage’>

<div class=’status-msg-wrap’>

<div class=’status-msg-body’>

<data:navMessage/>

</div>

<div class=’status-msg-border’>

<div class=’status-msg-bg’>

<div class=’status-msg-hidden’><data:navMessage/></div>

</div>

</div>

</div>

<div style=’clear: both;’/>

</b:if>

</b:includable>





4. Αντικατέστησε τους παραπάνω κώδικες με τους παρακάτω:




<b:includable id=’status-message’>

<b:if cond=’data:navMessage’>

<div>

</div>

<div style=’clear: both;’/>

</b:if>

</b:includable>





5.Αποθηκεύστε το πρότυπό σας κι είστε έτοιμοι!





ΑΝΑΔΗΜΟΣΙΕΥΣΗ ΑΠΟ 27-10-2009




READ MORE BUTTON (ΜΕ ΕΙΚΟΝΑ!) ΑΝΤΙ ΓΙΑ ΚΕΙΜΕΝΟ



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Καλησπέρα στους φίλους-αναγνώστες!



Μετά από δεκάδες ερωτήσεις που δέχτηκα για αυτό το θέμα αποφάσισα να γράψω τη σημερινή ανάρτηση.



Όλοι ξέρουμε τώρα πια (με τη βοήθεια βεβαίως του bloggertips.gr) πως θα βάζουμε το Read More στις αναρτήσεις μας, ώστε να μην φαίνονται ολόκληρες στην αρχική μας σελίδα. Σχετικά με αυτό έχω συγγράψει στο παρελθόν δύο τρόπους προσθήκης του: την απλή (http://www.bloggertips.gr/2009/07/read-more-blog.html) και την αυτόματη (http://www.bloggertips.gr/2010/03/automatic-read-more-function-in-blogger.html).



Σήμερα θα σας πω, πως και στις δύο περιπτώσεις θα βάλουμε αντί για κείμενο ένα read more button, όπως έχω εγώ.



Αν έχετε το απλό read more:



Στο βήμα 11 σας λέω να βάλετε τον παρακάτω κωδικό:


<b:if cond=’data:blog.pageType != “item”‘>

<span style=”font-weight:bold;”><span ><a expr:href=’data:post.url’ target=’_blank’>Διαβάστε περισσότερα…</a></span></span>

</b:if>



Απλά αντικαθιστάτε το Διαβάστε περισσότερα… με τον παρακάτω κωδικό:


<img src=”url_of_image” border=”0″ />



Στο url_of_image βάζετε το url του read more button σας.



Στο αυτόματο read more:



Εκεί που λέω να αντικαταστήστε το <data:post.body/> με τον παρακάτω κωδικό:


<b:if cond=’data:blog.pageType != “item”‘>

<div expr:id='”summary-” + data:post.id’><data:post.body/></div>

<script type=’text/javascript’>createSummaryAndThumb(“summary-<data:post.id/>”);</script>

<a class=’readmore’ expr:href=’data:post.url’>Read more »</a>

</b:if>

<b:if cond=’data:blog.pageType == “item”‘><data:post.body/></b:if>



Εκεί που λέει Read more » το αντικαθιστάτε με το:


<img src=”url_of_image” border=”0″ />



Στο url_of_image βάζετε το url του read more button σας.





Πολύ απλό, ε?





ΕΥΡΕΣΗ READ MORE BUTTON





Υπάρχουν εκατοντάδες read more button και σίγουρα θα βρείτε ένα που θα ταιριάζει στη σελίδα σας.



Θα βρείτε πολλά από εδώ και ψάξτε και με άλλες λέξεις-κλειδιά!



Καλή σας ημέρα!


Πηγές: –
Copyrights: /




Οριζόντιο blogger menu κάτω από τον τίτλο για προσθήκη συνδέσμων (1)



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Μου το έχετε ζητήσει πάρα πολλοί και δεν μπορούσα να σας αρνηθώ.

Πρόκειται για ένα ακόμη από τα βασικότερα blogger tips που δεν θα μπορούσε να έλειπε από το bloggertips.gr

Είναι μια μπάρα-μενού που την εγκαθιστάμε κάτω από τον τίτλο του blog μας και βάζουμε σε αυτή, links από αναρτήσεις μας, ετικέτες μας και ότι άλλο θέλουμε.



Θα φαίνεται κάπως έτσι:




Ακολουθήστε τα παρακάτω βήματα για να την βάλετε κι εσείς:



1. Σύνδεση στον blogger λογαριασμό μας από το blogger.com

2. Πανόπτης> Σχεδίαση> Επεξεργασία html

3. Με το ctrl+F βρείτε το </head>

4. Πάνω από αυτό επικολλήστε το παρακάτω:


<!–MENU-11-STARTS-Widget-by-http://loneeagle110.blogspot.com+http://www.bloggertips.gr/–>

<style type=’text/css’>

.solidblockmenu{

margin: 0;

padding: 0;

float: left;

font: bold 13px Arial;

width: 100%;

overflow: hidden;

margin-bottom: 1em;

border: 1px solid #625e00;

border-width: 1px 0;

background: black url(http://i44.tinypic.com/333j255.jpg) center center repeat-x;

}



.solidblockmenu li{

display: inline;

}



.solidblockmenu li a{

float: left;

color: white;

padding: 9px 11px;

text-decoration: none;

border-right: 1px solid white;

}



.solidblockmenu li a:visited{

color: white;

}

.solidblockmenu li a:hover, .solidblockmenu li .current{

color: white;

background: transparent url(http://i40.tinypic.com/51wnm9.jpg) center center repeat-x;

}

</style>

<!–MENU-11-STOPS-Widget-by-http://loneeagle110.blogspot.com+http://www.bloggertips.gr/–>



5. Αποθηκεύουμε το πρότυπό μας

6. Σχεδίαση> Στοιχεία Σελίδας> Προσθήκη gadget> HTML/JavaScript

7. Βάλτε τον παρακάτω κωδικό:


<!–MENU-11-STARTS-Widget-by-http://loneeagle110.blogspot.com+http://www.bloggertips.gr/–>

<ul class=”solidblockmenu”>

<li><a href=”…your link…” class=”current”>Login</a></li>

<li><a href=”…your link…” >Home</a></li>

<li><a href=”…your link…”>tab 1</a></li>

<li><a href=”…your link…“>tab 2</a></li>

<li><a href=”…your link…”>tab 3</a></li>

<li><a href=”…your link…”>tab 4</a></li>

<li><a href=”…your link…”>tab 5</a></li>

<li><a href=”…your link…”>tab 6</a></li>

<li><a href=”…your link…”>Contact me</a></li>

<li><a href=”…your link…”>About</a></li>

</ul>

<!–MENU-11-STOPS-Widget-by-http://loneeagle110.blogspot.com+http://www.bloggertips.gr/–>



Όπου το  …your link…  βάζετε το link σας και όπου  tab 0  βάζετε το όνομα του link.



8. Αποθήκευση κι είστε έτοιμοι!



Αν προσέξατε στον τίτλο έχω το (1). Αυτό, όπως καταλαβαίνετε, σημαίνει ότι θα ακολουθήσουν κι άλλα σχέδια.



Τα σχόλιά σας, πάντα ευπρόσδεκτα!


Πηγές: Εικόνα και κωδικοί από http://www.dynamicdrive.com/style/csslibrary/item/solid_block_menu/P150/
Copyrights: /




Βαλε Slider στο blog σου – Featured Post Content Slider



Print Friendly and PDFPrintPrint Friendly and PDFPDF




Άλλο ένα από τα σημαντικότερα blogger hacks! Σίγουρα θα έχετε δει σε πολλά blogs να έχουν sliders στο οποίο φιγουράρουν με εντυπωσιακά εφέ οι τελευταίες ή οι καλύτερες τους αναρτήσεις. Λίγοι από αυτούς που έχουν slider στο blog τους, το έχουν βάλει μόνοι τους. Στους πιο πολλούς το slider είναι ενσωματωμένο μέσα στο πρότυπο που χρησιμοποιούν. Σήμερα θα σας εξηγήσω βήμα-βήμα πως μπορείτε να εγκαταστήσετε στο blog σας, ένα δικό σας slider.



Ακολουθήστε τα παρακάτω βήματα:



1. Σύνδεση -όπως πάντα- στον blogger λογαριασμό σου από το blogger.com

2. Πανόπτης> Σχεδίαση> Επεξεργασία html

3. Με τη βοήθεια του ctrl+F από τον browser μας βρίσκουμε το </head>

4. Επικολλήστε τον παρακάτω κωδικό πριν από το </head>




<script src=’http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js’ type=’text/javascript’/>



<script type=’text/javascript’>

//<![CDATA[



eval(function(p,a,c,k,e,r){e=function(c){return(c<a?”:e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!”.replace(/^/,String)){while(c–)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return’\w+’};c=1};while(c–)if(k[c])p=p.replace(new RegExp(‘\b’+e(c)+’\b’,’g’),k[c]);return p}(‘(6($){$.1g.1w=6(o){o=$.1f({r:n,x:n,N:n,17:q,J:n,L:1a,16:n,y:q,u:12,H:3,B:0,k:1,K:n,I:n},o||{});8 G.R(6(){p b=q,A=o.y?”15″:”w”,P=o.y?”t”:”s”;p c=$(G),9=$(“9”,c),E=$(“10”,9),W=E.Y(),v=o.H;7(o.u){9.1h(E.D(W-v-1+1).V()).1d(E.D(0,v).V());o.B+=v}p f=$(“10”,9),l=f.Y(),4=o.B;c.5(“1c”,”H”);f.5({U:”T”,1b:o.y?”S”:”w”});9.5({19:”0″,18:”0″,Q:”13″,”1v-1s-1r”:”S”,”z-14″:”1″});c.5({U:”T”,Q:”13″,”z-14″:”2″,w:”1q”});p g=o.y?t(f):s(f);p h=g*l;p j=g*v;f.5({s:f.s(),t:f.t()});9.5(P,h+”C”).5(A,-(4*g));c.5(P,j+”C”);7(o.r)$(o.r).O(6(){8 m(4-o.k)});7(o.x)$(o.x).O(6(){8 m(4+o.k)});7(o.N)$.R(o.N,6(i,a){$(a).O(6(){8 m(o.u?o.H+i:i)})});7(o.17&&c.11)c.11(6(e,d){8 d>0?m(4-o.k):m(4+o.k)});7(o.J)1p(6(){m(4+o.k)},o.J+o.L);6 M(){8 f.D(4).D(0,v)};6 m(a){7(!b){7(o.K)o.K.Z(G,M());7(o.u){7(a<=o.B-v-1){9.5(A,-((l-(v*2))*g)+”C”);4=a==o.B-v-1?l-(v*2)-1:l-(v*2)-o.k}F 7(a>=l-v+1){9.5(A,-((v)*g)+”C”);4=a==l-v+1?v+1:v+o.k}F 4=a}F{7(a<0||a>l-v)8;F 4=a}b=12;9.1o(A==”w”?{w:-(4*g)}:{15:-(4*g)},o.L,o.16,6(){7(o.I)o.I.Z(G,M());b=q});7(!o.u){$(o.r+”,”+o.x).1n(“X”);$((4-o.k<0&&o.r)||(4+o.k>l-v&&o.x)||[]).1m(“X”)}}8 q}})};6 5(a,b){8 1l($.5(a[0],b))||0};6 s(a){8 a[0].1k+5(a,’1j’)+5(a,’1i’)};6 t(a){8 a[0].1t+5(a,’1u’)+5(a,’1e’)}})(1x);’,62,96,’||||curr|css|function|if|return|ul|||||||||||scroll|itemLength|go|null||var|false|btnPrev|width|height|circular||left|btnNext|vertical||animCss|start|px|slice|tLi|else|this|visible|afterEnd|auto|beforeStart|speed|vis|btnGo|click|sizeCss|position|each|none|hidden|overflow|clone|tl|disabled|size|call|li|mousewheel|true|relative|index|top|easing|mouseWheel|padding|margin|200|float|visibility|append|marginBottom|extend|fn|prepend|marginRight|marginLeft|offsetWidth|parseInt|addClass|removeClass|animate|setInterval|0px|type|style|offsetHeight|marginTop|list|jCarouselLite|jQuery’.split(‘|’),0,{}))



//]]>

</script>



<script type=’text/javascript’>

//<![CDATA[



/*

* Copyright (c) 2009 Simo Kinnunen.

* Licensed under the MIT license.

*

* @version 1.02

*/

var Cufon=(function(){var m=function(){return m.replace.apply(null,arguments)};var x=m.DOM={ready:(function(){var C=false,E={loaded:1,complete:1};var B=[],D=function(){if(C){return}C=true;for(var F;F=B.shift();F()){}};if(document.addEventListener){document.addEventListener(“DOMContentLoaded”,D,false);window.addEventListener(“pageshow”,D,false)}if(!window.opera&&document.readyState){(function(){E[document.readyState]?D():setTimeout(arguments.callee,10)})()}if(document.readyState&&document.createStyleSheet){(function(){try{document.body.doScroll(“left”);D()}catch(F){setTimeout(arguments.callee,1)}})()}q(window,”load”,D);return function(F){if(!arguments.length){D()}else{C?F():B.push(F)}}})(),root:function(){return document.documentElement||document.body}};var n=m.CSS={Size:function(C,B){this.value=parseFloat(C);this.unit=String(C).match(/[a-z%]*$/)[0]||”px”;this.convert=function(D){return D/B*this.value};this.convertFrom=function(D){return D/this.value*B};this.toString=function(){return this.value+this.unit}},addClass:function(C,B){var D=C.className;C.className=D+(D&&” “)+B;return C},color:j(function(C){var B={};B.color=C.replace(/^rgba((.*?),s*([d.]+))/,function(E,D,F){B.opacity=parseFloat(F);return”rgb(“+D+”)”});return B}),fontStretch:j(function(B){if(typeof B==”number”){return B}if(/%$/.test(B)){return parseFloat(B)/100}return{“ultra-condensed”:0.5,”extra-condensed”:0.625,condensed:0.75,”semi-condensed”:0.875,”semi-expanded”:1.125,expanded:1.25,”extra-expanded”:1.5,”ultra-expanded”:2}[B]||1}),getStyle:function(C){var B=document.defaultView;if(B&&B.getComputedStyle){return new a(B.getComputedStyle(C,null))}if(C.currentStyle){return new a(C.currentStyle)}return new a(C.style)},gradient:j(function(F){var G={id:F,type:F.match(/^-([a-z]+)-gradient(/)[1],stops:[]},C=F.substr(F.indexOf(“(“)).match(/([d.]+=)?(#[a-f0-9]+|[a-z]+(.*?)|[a-z]+)/ig);for(var E=0,B=C.length,D;E<B;++E){D=C[E].split(“=”,2).reverse();G.stops.push([D[1]||E/(B-1),D[0]])}return G}),hasClass:function(C,B){return RegExp(“(?:^|\s)”+B+”(?=\s|$)”).test(C.className)},quotedList:j(function(E){var D=[],C=/s*(([“‘])([sS]*?[^\])2|[^,]+)s*/g,B;while(B=C.exec(E)){D.push(B[3]||B[1])}return D}),recognizesMedia:j(function(G){var E=document.createElement(“style”),D,C,B;E.type=”text/css”;E.media=G;try{E.appendChild(document.createTextNode(“/**/”))}catch(F){}C=g(“head”)[0];C.insertBefore(E,C.firstChild);D=(E.sheet||E.styleSheet);B=D&&!D.disabled;C.removeChild(E);return B}),removeClass:function(D,C){var B=RegExp(“(?:^|\s+)”+C+”(?=\s|$)”,”g”);D.className=D.className.replace(B,””);return D},supports:function(D,C){var B=document.createElement(“span”).style;if(B[D]===undefined){return false}B[D]=C;return B[D]===C},textAlign:function(E,D,B,C){if(D.get(“textAlign”)==”right”){if(B>0){E=” “+E}}else{if(B<C-1){E+=” “}}return E},textDecoration:function(G,F){if(!F){F=this.getStyle(G)}var C={underline:null,overline:null,”line-through”:null};for(var B=G;B.parentNode&&B.parentNode.nodeType==1;){var E=true;for(var D in C){if(!k(C,D)||C[D]){continue}if(F.get(“textDecoration”).indexOf(D)!=-1){C[D]=F.get(“color”)}E=false}if(E){break}F=this.getStyle(B=B.parentNode)}return C},textShadow:j(function(F){if(F==”none”){return null}var E=[],G={},B,C=0;var D=/(#[a-f0-9]+|[a-z]+(.*?)|[a-z]+)|(-?[d.]+[a-z%]*)|,/ig;while(B=D.exec(F)){if(B[0]==”,”){E.push(G);G={};C=0}else{if(B[1]){G.color=B[1]}else{G[[“offX”,”offY”,”blur”][C++]]=B[2]}}}E.push(G);return E}),textTransform:(function(){var B={uppercase:function(C){return C.toUpperCase()},lowercase:function(C){return C.toLowerCase()},capitalize:function(C){return C.replace(/b./g,function(D){return D.toUpperCase()})}};return function(E,D){var C=B[D.get(“textTransform”)];return C?C(E):E}})(),whiteSpace:(function(){var B={inline:1,”inline-block”:1,”run-in”:1};return function(E,C,D){if(B[C.get(“display”)]){return E}if(!D.previousSibling){E=E.replace(/^s+/,””)}if(!D.nextSibling){E=E.replace(/s+$/,””)}return E}})()};n.ready=(function(){var B=!n.recognizesMedia(“all”),E=false;var D=[],H=function(){B=true;for(var K;K=D.shift();K()){}};var I=g(“link”),J=g(“style”);function C(K){return K.disabled||G(K.sheet,K.media||”screen”)}function G(M,P){if(!n.recognizesMedia(P||”all”)){return true}if(!M||M.disabled){return false}try{var Q=M.cssRules,O;if(Q){search:for(var L=0,K=Q.length;O=Q[L],L<K;++L){switch(O.type){case 2:break;case 3:if(!G(O.styleSheet,O.media.mediaText)){return false}break;default:break search}}}}catch(N){}return true}function F(){if(document.createStyleSheet){return true}var L,K;for(K=0;L=I[K];++K){if(L.rel.toLowerCase()==”stylesheet”&&!C(L)){return false}}for(K=0;L=J[K];++K){if(!C(L)){return false}}return true}x.ready(function(){if(!E){E=n.getStyle(document.body).isUsable()}if(B||(E&&F())){H()}else{setTimeout(arguments.callee,10)}});return function(K){if(B){K()}else{D.push(K)}}})();function s(C){var B=this.face=C.face;this.glyphs=C.glyphs;this.w=C.w;this.baseSize=parseInt(B[“units-per-em”],10);this.family=B[“font-family”].toLowerCase();this.weight=B[“font-weight”];this.style=B[“font-style”]||”normal”;this.viewBox=(function(){var E=B.bbox.split(/s+/);var D={minX:parseInt(E[0],10),minY:parseInt(E[1],10),maxX:parseInt(E[2],10),maxY:parseInt(E[3],10)};D.width=D.maxX-D.minX;D.height=D.maxY-D.minY;D.toString=function(){return[this.minX,this.minY,this.width,this.height].join(” “)};return D})();this.ascent=-parseInt(B.ascent,10);this.descent=-parseInt(B.descent,10);this.height=-this.ascent+this.descent}function f(){var C={},B={oblique:”italic”,italic:”oblique”};this.add=function(D){(C[D.style]||(C[D.style]={}))[D.weight]=D};this.get=function(H,I){var G=C[H]||C[B[H]]||C.normal||C.italic||C.oblique;if(!G){return null}I={normal:400,bold:700}[I]||parseInt(I,10);if(G[I]){return G[I]}var E={1:1,99:0}[I%100],K=[],F,D;if(E===undefined){E=I>400}if(I==500){I=400}for(var J in G){if(!k(G,J)){continue}J=parseInt(J,10);if(!F||J<F){F=J}if(!D||J>D){D=J}K.push(J)}if(I<F){I=F}if(I>D){I=D}K.sort(function(M,L){return(E?(M>I&&L>I)?M<L:M>L:(M<I&&L<I)?M>L:M<L)?-1:1});return G[K[0]]}}function r(){function D(F,G){if(F.contains){return F.contains(G)}return F.compareDocumentPosition(G)&16}function B(G){var F=G.relatedTarget;if(!F||D(this,F)){return}C(this)}function E(F){C(this)}function C(F){setTimeout(function(){m.replace(F,d.get(F).options,true)},10)}this.attach=function(F){if(F.onmouseenter===undefined){q(F,”mouseover”,B);q(F,”mouseout”,B)}else{q(F,”mouseenter”,E);q(F,”mouseleave”,E)}}}function u(){var C=[],D={};function B(H){var E=[],G;for(var F=0;G=H[F];++F){E[F]=C[D[G]]}return E}this.add=function(F,E){D[F]=C.push(E)-1};this.repeat=function(){var E=arguments.length?B(arguments):C,F;for(var G=0;F=E[G++];){m.replace(F[0],F[1],true)}}}function A(){var D={},B=0;function C(E){return E.cufid||(E.cufid=++B)}this.get=function(E){var F=C(E);return D[F]||(D[F]={})}}function a(B){var D={},C={};this.extend=function(E){for(var F in E){if(k(E,F)){D[F]=E[F]}}return this};this.get=function(E){return D[E]!=undefined?D[E]:B[E]};this.getSize=function(F,E){return C[F]||(C[F]=new n.Size(this.get(F),E))};this.isUsable=function(){return !!B}}function q(C,B,D){if(C.addEventListener){C.addEventListener(B,D,false)}else{if(C.attachEvent){C.attachEvent(“on”+B,function(){return D.call(C,window.event)})}}}function v(C,B){var D=d.get(C);if(D.options){return C}if(B.hover&&B.hoverables[C.nodeName.toLowerCase()]){b.attach(C)}D.options=B;return C}function j(B){var C={};return function(D){if(!k(C,D)){C[D]=B.apply(null,arguments)}return C[D]}}function c(F,E){var B=n.quotedList(E.get(“fontFamily”).toLowerCase()),D;for(var C=0;D=B[C];++C){if(i[D]){return i[D].get(E.get(“fontStyle”),E.get(“fontWeight”))}}return null}function g(B){return document.getElementsByTagName(B)}function k(C,B){return C.hasOwnProperty(B)}function h(){var B={},D,F;for(var E=0,C=arguments.length;D=arguments[E],E<C;++E){for(F in D){if(k(D,F)){B[F]=D[F]}}}return B}function o(E,M,C,N,F,D){var K=document.createDocumentFragment(),H;if(M===””){return K}var L=N.separate;var I=M.split(p[L]),B=(L==”words”);if(B&&t){if(/^s/.test(M)){I.unshift(“”)}if(/s$/.test(M)){I.push(“”)}}for(var J=0,G=I.length;J<G;++J){H=z[N.engine](E,B?n.textAlign(I[J],C,J,G):I[J],C,N,F,D,J<G-1);if(H){K.appendChild(H)}}return K}function l(C,J){var B=n.getStyle(v(C,J)).extend(J);var D=c(C,B),E,H,G,F,I;for(E=C.firstChild;E;E=G){H=E.nodeType;G=E.nextSibling;if(H==3){if(F){F.appendData(E.data);C.removeChild(E)}else{F=E}if(G){continue}}if(F){C.replaceChild(o(D,n.whiteSpace(F.data,B,F),B,J,E,C),F);F=null}if(H==1&&E.firstChild){if(n.hasClass(E,”cufon”)){z[J.engine](D,null,B,J,E,C)}else{arguments.callee(E,J)}}}}var t=” “.split(/s+/).length==0;var d=new A();var b=new r();var y=new u();var e=false;var z={},i={},w={enableTextDecoration:false,engine:null,forceHitArea:false,hover:false,hoverables:{a:true},printable:true,selector:(window.Sizzle||(window.jQuery&&function(B){return jQuery(B)})||(window.dojo&&dojo.query)||(window.Ext&&Ext.query)||(window.$$&&function(B){return $$(B)})||(window.$&&function(B){return $(B)})||(document.querySelectorAll&&function(B){return document.querySelectorAll(B)})||g),separate:”words”,textShadow:”none”};var p={words:/[^Su00a0]+/,characters:””,none:/^/};m.now=function(){x.ready();return m};m.refresh=function(){y.repeat.apply(y,arguments);return m};m.registerEngine=function(C,B){if(!B){return m}z[C]=B;return m.set(“engine”,C)};m.registerFont=function(D){var B=new s(D),C=B.family;if(!i[C]){i[C]=new f()}i[C].add(B);return m.set(“fontFamily”,'”‘+C+'”‘)};m.replace=function(D,C,B){C=h(w,C);if(!C.engine){return m}if(!e){n.addClass(x.root(),”cufon-active cufon-loading”);n.ready(function(){n.addClass(n.removeClass(x.root(),”cufon-loading”),”cufon-ready”)});e=true}if(C.hover){C.forceHitArea=true}if(typeof C.textShadow==”string”){C.textShadow=n.textShadow(C.textShadow)}if(typeof C.color==”string”&&/^-/.test(C.color)){C.textGradient=n.gradient(C.color)}if(!B){y.add(D,arguments)}if(D.nodeType||typeof D==”string”){D=[D]}n.ready(function(){for(var F=0,E=D.length;F<E;++F){var G=D[F];if(typeof G==”string”){m.replace(C.selector(G),C,true)}else{l(G,C)}}});return m};m.set=function(B,C){w[B]=C;return m};return m})();Cufon.registerEngine(“canvas”,(function(){var b=document.createElement(“canvas”);if(!b||!b.getContext||!b.getContext.apply){return}b=null;var a=Cufon.CSS.supports(“display”,”inline-block”);var e=!a&&(document.compatMode==”BackCompat”||/frameset|transitional/i.test(document.doctype.publicId));var f=document.createElement(“style”);f.type=”text/css”;f.appendChild(document.createTextNode((“.cufon-canvas{text-indent:0;}@media screen,projection{.cufon-canvas{display:inline;display:inline-block;position:relative;vertical-align:middle;”+(e?””:”font-size:1px;line-height:1px;”)+”}.cufon-canvas .cufon-alt{display:-moz-inline-box;display:inline-block;width:0;height:0;overflow:hidden;text-indent:-10000in;}”+(a?”.cufon-canvas canvas{position:relative;}”:”.cufon-canvas canvas{position:absolute;}”)+”}@media print{.cufon-canvas{padding:0;}.cufon-canvas canvas{display:none;}.cufon-canvas .cufon-alt{display:inline;}}”).replace(/;/g,”!important;”)));document.getElementsByTagName(“head”)[0].appendChild(f);function d(p,h){var n=0,m=0;var g=[],o=/([mrvxe])([^a-z]*)/g,k;generate:for(var j=0;k=o.exec(p);++j){var l=k[2].split(“,”);switch(k[1]){case”v”:g[j]={m:”bezierCurveTo”,a:[n+~~l[0],m+~~l[1],n+~~l[2],m+~~l[3],n+=~~l[4],m+=~~l[5]]};break;case”r”:g[j]={m:”lineTo”,a:[n+=~~l[0],m+=~~l[1]]};break;case”m”:g[j]={m:”moveTo”,a:[n=~~l[0],m=~~l[1]]};break;case”x”:g[j]={m:”closePath”};break;case”e”:break generate}h[g[j].m].apply(h,g[j].a)}return g}function c(m,k){for(var j=0,h=m.length;j<h;++j){var g=m[j];k[g.m].apply(k,g.a)}}return function(ah,H,Z,D,L,ai){var n=(H===null);if(n){H=L.alt}var J=ah.viewBox;var p=Z.getSize(“fontSize”,ah.baseSize);var X=Z.get(“letterSpacing”);X=(X==”normal”)?0:p.convertFrom(parseInt(X,10));var K=0,Y=0,W=0,F=0;var I=D.textShadow,U=[];if(I){for(var ag=I.length;ag–;){var O=I[ag];var T=p.convertFrom(parseFloat(O.offX));var R=p.convertFrom(parseFloat(O.offY));U[ag]=[T,R];if(R<K){K=R}if(T>Y){Y=T}if(R>W){W=R}if(T<F){F=T}}}var al=Cufon.CSS.textTransform(H,Z).split(“”),B;var o=ah.glyphs,E,r,ac;var h=0,v,N=[];for(var ag=0,ae=0,ab=al.length;ag<ab;++ag){E=o[B=al[ag]]||ah.missingGlyph;if(!E){continue}if(r){h-=ac=r[B]||0;N[ae-1]-=ac}h+=v=N[ae++]=~~(E.w||ah.w)+X;r=E.k}if(v===undefined){return null}Y+=J.width-v;F+=J.minX;var C,q;if(n){C=L;q=L.firstChild}else{C=document.createElement(“span”);C.className=”cufon cufon-canvas”;C.alt=H;q=document.createElement(“canvas”);C.appendChild(q);if(D.printable){var ad=document.createElement(“span”);ad.className=”cufon-alt”;ad.appendChild(document.createTextNode(H));C.appendChild(ad)}}var am=C.style;var Q=q.style;var m=p.convert(J.height);var ak=Math.ceil(m);var V=ak/m;var P=V*Cufon.CSS.fontStretch(Z.get(“fontStretch”));var S=h*P;var aa=Math.ceil(p.convert(S+Y-F));var t=Math.ceil(p.convert(J.height-K+W));q.width=aa;q.height=t;Q.width=aa+”px”;Q.height=t+”px”;K+=J.minY;Q.top=Math.round(p.convert(K-ah.ascent))+”px”;Q.left=Math.round(p.convert(F))+”px”;var A=Math.ceil(p.convert(S))+”px”;if(a){am.width=A;am.height=p.convert(ah.height)+”px”}else{am.paddingLeft=A;am.paddingBottom=(p.convert(ah.height)-1)+”px”}var aj=q.getContext(“2d”),M=m/J.height;aj.scale(M,M*V);aj.translate(-F,-K);aj.lineWidth=ah.face[“underline-thickness”];aj.save();function s(i,g){aj.strokeStyle=g;aj.beginPath();aj.moveTo(0,i);aj.lineTo(h,i);aj.stroke()}var u=D.enableTextDecoration?Cufon.CSS.textDecoration(ai,Z):{};if(u.underline){s(-ah.face[“underline-position”],u.underline)}if(u.overline){s(ah.ascent,u.overline)}function af(){aj.scale(P,1);for(var x=0,k=0,g=al.length;x<g;++x){var y=o[al[x]]||ah.missingGlyph;if(!y){continue}if(y.d){aj.beginPath();if(y.code){c(y.code,aj)}else{y.code=d(“m”+y.d,aj)}aj.fill()}aj.translate(N[k++],0)}aj.restore()}if(I){for(var ag=I.length;ag–;){var O=I[ag];aj.save();aj.fillStyle=O.color;aj.translate.apply(aj,U[ag]);af()}}var z=D.textGradient;if(z){var G=z.stops,w=aj.createLinearGradient(0,J.minY,0,J.maxY);for(var ag=0,ab=G.length;ag<ab;++ag){w.addColorStop.apply(w,G[ag])}aj.fillStyle=w}else{aj.fillStyle=Z.get(“color”)}af();if(u[“line-through”]){s(-ah.descent,u[“line-through”])}return C}})());Cufon.registerEngine(“vml”,(function(){var e=document.namespaces;if(!e){return}e.add(“cvml”,”urn:schemas-microsoft-com:vml”);e=null;var b=document.createElement(“cvml:shape”);b.style.behavior=”url(#default#VML)”;if(!b.coordsize){return}b=null;var g=(document.documentMode||0)<8;document.write((‘<style type=”text/css”>.cufon-vml-canvas{text-indent:0;}@media screen{cvml\:shape,cvml\:rect,cvml\:fill,cvml\:shadow{behavior:url(#default#VML);display:block;antialias:true;position:absolute;}.cufon-vml-canvas{position:absolute;text-align:left;}.cufon-vml{display:inline-block;position:relative;vertical-align:’+(g?”middle”:”text-bottom”)+”;}.cufon-vml .cufon-alt{position:absolute;left:-10000in;font-size:1px;}a .cufon-vml{cursor:pointer}}@media print{.cufon-vml *{display:none;}.cufon-vml .cufon-alt{display:inline;}}</style>”).replace(/;/g,”!important;”));function c(h,i){return a(h,/(?:em|ex|%)$|^[a-z-]+$/i.test(i)?”1em”:i)}function a(k,l){if(/px$/i.test(l)){return parseFloat(l)}var j=k.style.left,i=k.runtimeStyle.left;k.runtimeStyle.left=k.currentStyle.left;k.style.left=l.replace(“%”,”em”);var h=k.style.pixelLeft;k.style.left=j;k.runtimeStyle.left=i;return h}var f={};function d(o){var p=o.id;if(!f[p]){var m=o.stops,n=document.createElement(“cvml:fill”),h=[];n.type=”gradient”;n.angle=180;n.focus=”0″;n.method=”sigma”;n.color=m[0][1];for(var l=1,i=m.length-1;l<i;++l){h.push(m[l][0]*100+”% “+m[l][1])}n.colors=h.join(“,”);n.color2=m[i][1];f[p]=n}return f[p]}return function(aj,K,ad,G,O,ak,ab){var o=(K===null);if(o){K=O.alt}var M=aj.viewBox;var q=ad.computedFontSize||(ad.computedFontSize=new Cufon.CSS.Size(c(ak,ad.get(“fontSize”))+”px”,aj.baseSize));var aa=ad.computedLSpacing;if(aa==undefined){aa=ad.get(“letterSpacing”);ad.computedLSpacing=aa=(aa==”normal”)?0:~~q.convertFrom(a(ak,aa))}var C,r;if(o){C=O;r=O.firstChild}else{C=document.createElement(“span”);C.className=”cufon cufon-vml”;C.alt=K;r=document.createElement(“span”);r.className=”cufon-vml-canvas”;C.appendChild(r);if(G.printable){var ag=document.createElement(“span”);ag.className=”cufon-alt”;ag.appendChild(document.createTextNode(K));C.appendChild(ag)}if(!ab){C.appendChild(document.createElement(“cvml:shape”))}}var ap=C.style;var V=r.style;var m=q.convert(M.height),am=Math.ceil(m);var Z=am/m;var T=Z*Cufon.CSS.fontStretch(ad.get(“fontStretch”));var Y=M.minX,X=M.minY;V.height=am;V.top=Math.round(q.convert(X-aj.ascent));V.left=Math.round(q.convert(Y));ap.height=q.convert(aj.height)+”px”;var v=G.enableTextDecoration?Cufon.CSS.textDecoration(ak,ad):{};var J=ad.get(“color”);var ao=Cufon.CSS.textTransform(K,ad).split(“”),B;var p=aj.glyphs,H,s,af;var h=0,P=[],W=0,x;var z,L=G.textShadow;for(var ai=0,ah=0,ae=ao.length;ai<ae;++ai){H=p[B=ao[ai]]||aj.missingGlyph;if(!H){continue}if(s){h-=af=s[B]||0;P[ah-1]-=af}h+=x=P[ah++]=~~(H.w||aj.w)+aa;s=H.k}if(x===undefined){return null}var A=-Y+h+(M.width-x);var an=q.convert(A*T),ac=Math.round(an);var S=A+”,”+M.height,n;var N=”r”+S+”ns”;var y=G.textGradient&&d(G.textGradient);for(ai=0,ah=0;ai<ae;++ai){H=p[ao[ai]]||aj.missingGlyph;if(!H){continue}if(o){z=r.childNodes[ah];while(z.firstChild){z.removeChild(z.firstChild)}}else{z=document.createElement(“cvml:shape”);r.appendChild(z)}z.stroked=”f”;z.coordsize=S;z.coordorigin=n=(Y-W)+”,”+X;z.path=(H.d?”m”+H.d+”xe”:””)+”m”+n+N;z.fillcolor=J;if(y){z.appendChild(y.cloneNode(false))}var al=z.style;al.width=ac;al.height=am;if(L){var u=L[0],t=L[1];var F=Cufon.CSS.color(u.color),D;var R=document.createElement(“cvml:shadow”);R.on=”t”;R.color=F.color;R.offset=u.offX+”,”+u.offY;if(t){D=Cufon.CSS.color(t.color);R.type=”double”;R.color2=D.color;R.offset2=t.offX+”,”+t.offY}R.opacity=F.opacity||(D&&D.opacity)||1;z.appendChild(R)}W+=P[ah++]}var Q=z.nextSibling,w,E;if(G.forceHitArea){if(!Q){Q=document.createElement(“cvml:rect”);Q.stroked=”f”;Q.className=”cufon-vml-cover”;w=document.createElement(“cvml:fill”);w.opacity=0;Q.appendChild(w);r.appendChild(Q)}E=Q.style;E.width=ac;E.height=am}else{if(Q){r.removeChild(Q)}}ap.width=Math.max(Math.ceil(q.convert(h*T)),0);if(g){var U=ad.computedYAdjust;if(U===undefined){var I=ad.get(“lineHeight”);if(I==”normal”){I=”1em”}else{if(!isNaN(I)){I+=”em”}}ad.computedYAdjust=U=0.5*(a(ak,I)-parseFloat(ap.height))}if(U){ap.marginTop=Math.ceil(U)+”px”;ap.marginBottom=U+”px”}}return C}})());



//]]>

</script>



<script type=’text/javascript’>

//<![CDATA[



/*

* jQuery Easing v1.1 – http://gsgd.co.uk/sandbox/jquery.easing.php

*

* Uses the built in easing capabilities added in jQuery 1.1

* to offer multiple easing options

*

* Copyright (c) 2007 George Smith

* Licensed under the MIT License:

* http://www.opensource.org/licenses/mit-license.php

*/



jQuery.easing = {

easein: function(x, t, b, c, d) {

return c*(t/=d)*t + b; // in

},

easeinout: function(x, t, b, c, d) {

if (t < d/2) return 2*c*t*t/(d*d) + b;

var ts = t – d/2;

return -2*c*ts*ts/(d*d) + 2*c*ts/d + c/2 + b;

},

easeout: function(x, t, b, c, d) {

return -c*t*t/(d*d) + 2*c*t/d + b;

},

expoin: function(x, t, b, c, d) {

var flip = 1;

if (c < 0) {

flip *= -1;

c *= -1;

}

return flip * (Math.exp(Math.log(c)/d * t)) + b;

},

expoout: function(x, t, b, c, d) {

var flip = 1;

if (c < 0) {

flip *= -1;

c *= -1;

}

return flip * (-Math.exp(-Math.log(c)/d * (t-d)) + c + 1) + b;

},

expoinout: function(x, t, b, c, d) {

var flip = 1;

if (c < 0) {

flip *= -1;

c *= -1;

}

if (t < d/2) return flip * (Math.exp(Math.log(c/2)/(d/2) * t)) + b;

return flip * (-Math.exp(-2*Math.log(c/2)/d * (t-d)) + c + 1) + b;

},

bouncein: function(x, t, b, c, d) {

return c – jQuery.easing[‘bounceout’](x, d-t, 0, c, d) + b;

},

bounceout: function(x, t, b, c, d) {

if ((t/=d) < (1/2.75)) {

return c*(7.5625*t*t) + b;

} else if (t < (2/2.75)) {

return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;

} else if (t < (2.5/2.75)) {

return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;

} else {

return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;

}

},

bounceinout: function(x, t, b, c, d) {

if (t < d/2) return jQuery.easing[‘bouncein’] (x, t*2, 0, c, d) * .5 + b;

return jQuery.easing[‘bounceout’] (x, t*2-d,0, c, d) * .5 + c*.5 + b;

},

elasin: function(x, t, b, c, d) {

var s=1.70158;var p=0;var a=c;

if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;

if (a < Math.abs(c)) { a=c; var s=p/4; }

else var s = p/(2*Math.PI) * Math.asin (c/a);

return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;

},

elasout: function(x, t, b, c, d) {

var s=1.70158;var p=0;var a=c;

if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;

if (a < Math.abs(c)) { a=c; var s=p/4; }

else var s = p/(2*Math.PI) * Math.asin (c/a);

return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;

},

elasinout: function(x, t, b, c, d) {

var s=1.70158;var p=0;var a=c;

if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5);

if (a < Math.abs(c)) { a=c; var s=p/4; }

else var s = p/(2*Math.PI) * Math.asin (c/a);

if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;

return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;

},

backin: function(x, t, b, c, d) {

var s=1.70158;

return c*(t/=d)*t*((s+1)*t – s) + b;

},

backout: function(x, t, b, c, d) {

var s=1.70158;

return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;

},

backinout: function(x, t, b, c, d) {

var s=1.70158;

if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t – s)) + b;

return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;

},

linear: function(x, t, b, c, d) {

return c*t/d + b; //linear

}

};



//]]>

</script>



<script type=’text/javascript’>

//<![CDATA[



jQuery(document).ready(function() {

Cufon.replace(‘.blogname h2’, { fontFamily: ‘MankSans-Medium’ });

Cufon.replace(‘.sidetitl,.blogname h1’, { fontFamily: ‘ChunkFive’ });



});



//]]>

</script>





<style type=’text/css’>

#slidearea{

height: 230px;

overflow: hidden;

position: relative;

width:680px;

background:#242424;

}

#gallerycover{

overflow: hidden;

margin:0px 0px;

}



.mygallery{

overflow: hidden;

position:relative;

}



.mytext img{

position:absolute;

left:10px;

top:10px;

padding:5px;

background:#515252;

border:1px solid #5e5e5e;

}



.mytext{

position:relative;

margin:0px 0px;

height:200px;

width:680px;

float:left;

display:inline;

line-height:20px;

color:#c4c4c4;

font-family: Tahoma,Georgia,century gothic,Verdana, sans-serif;

}



.mytext ul li{

height:200px;



}



.mytext a:link, .mytext a:visited {

color:#fff;

}



.mytext h2 {

font: 18px Georgia,century gothic,Verdana, sans-serif;

margin:15px 0px 5px 310px;

font-weight:normal;

width:350px;

height:24px;

overflow:hidden;

}



.mytext p {

width:350px;

margin:0px 0px 5px 310px;

color:#6f6f6f;

}



.mytext h2 a:link, .mytext h2 a:visited {

color:#fff;

}

.slnav{

padding:3px 0px;

background:#000;



}

.prev{

float:left;

width:24px;

height:24px;

z-index:200;

margin-left:5px;

background:url(http://1.bp.blogspot.com/_4HKUHirY_2U/S2FVY1DGRHI/AAAAAAAAAtc/BZkCromQU-I/prev.png);

}



.next{

float:right;

width:24px;

height:24px;

z-index:200;

background:url(http://4.bp.blogspot.com/_4HKUHirY_2U/S2FVWGJQahI/AAAAAAAAAtU/l-hiX3uOqBo/nxt.png);

display:block;

}



</style>





Τροποποίηση:



Στο τέλος σας έχω μαρκάρει δύο urls. Μπορείτε να τις αλλάξετε. Αυτές οι images urls αντιπροσωπεύουν αντίστοιχα τα δυο παρακάτω εικονίδια.




http://1.bp.blogspot.com/_-j7_-ccACuU/S2Fp48raFDI/AAAAAAAABdE/sflTOaNrpIQ/prev.png:



http://2.bp.blogspot.com/_-j7_-ccACuU/S2Fp1DzO4LI/AAAAAAAABc8/wPtkkr78LYM/nxt.png:




5. Αποθήκευση Προτύπου

6. Σχεδίαση> Στοιχεία Σελίδας> Προσθήκη gadget> HTML/JavaScript

7. Εκεί επικολλήστε και αποθηκεύστε τον παρακάτω κώδικα:


<script type=”text/javascript”>

var $jx = jQuery.noConflict();

$jx(function() {

$jx(“.mygallery”).jCarouselLite({

btnNext: “.next”,

btnPrev: “.prev”,

visible: 1,

easing: “backout”,

speed: 1000

});



});

</script>



<div id=”slidearea”>



<div id=”gallerycover”>

<div class=”mygallery”>

<ul>



<li>

<div class=”mytext”>

<h2><a href=”URL-of-Post-1” title=”#“>Title-of-Post-1</a></h2>

<p>Slide 1 Description […]</p>



<img src=”Slide-1-Image-Address” alt=”” />

</div>

</li>





<li>

<div class=”mytext”>

<h2><a href=”URL-of-Post-2″ title=”#”>Title-of-Post-2</a></h2>

<p>Slide 2 Description […]</p>



<img src=”Slide-2-Image-Address” alt=”” />

</div>

</li>





<li>

<div class=”mytext”>

<h2><a href=”URL-of-Post-3″ title=”#”>Title-of-Post-3</a></h2>

<p>Slide 3 Description […]</p>



<img src=”Slide-3-Image-Address” alt=”” />

</div>

</li>





<li>

<div class=”mytext”>

<h2><a href=”URL-of-Post-4″ title=”#”>Title-of-Post-4</a></h2>

<p>Slide 4 Description […]</p>



<img src=”Slide-4-Image-Address” alt=”” />

</div>

</li>





<li>

<div class=”mytext”>

<h2><a href=”URL-of-Post-5″ title=”#”>Title-of-Post-5</a></h2>

<p>Slide 5 Description […]</p>



<img src=”Slide-5-Image-Address” alt=”” />

</div>

</li>



</ul>



<div class=”clear”></div>



</div>

</div>



<div class=”slnav”>

<a href=”#” class=”prev”></a>

<a href=”#” class=”next”></a>

<div class=”clear”></div>

</div>



</div>



Τροποποίηση:



Όπως καταλαβαίνετε αντικαθιστάτε το URL-of-Post-X , Title-of-Post-X , Slide X Description […] , Slide-X-Image-Address με αυτό που θέλετε να βάλετε.



Το width=270px (πλάτος) και το height=170px (ύψος) αντιπροσωπεύουν το μέγεθος της εικόνας που θα βάλετε.



Επίσης μπορείτε να προσθαφαιρέσετε όσα slides θέλετε.



Τις αναρτήσεις σας στο slider μπορείτε να τις αλλάζετε όποτε θέλετε, πάντα με τον ίδιον τρόπο.



8. Είστε έτοιμοι. Μπορείτε να μετακινήσετε το gadget σε όποια θέση θέλετε να εμφανίζεται το slider.



Τα σχόλιά σας είναι πάντα ευπρόσδεκτα, τα διαβάζω όλα με προσοχή και για μένα σημαίνουν πάρα πολλά



Καλή σας μέρα!


Πηγές κωδικών: http://www.bloggertipandtrick.net/
Copyrights: /




Προγραμματισμός αναρτήσεων για αυτόματη μελλοντική δημοσίευση



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Ο Blogger δίνει την δυνατότητα στους χρήστες να προγραμματίζουν αναρτήσεις που έχουν γράψει να δημοσιευθούν αυτόματα σε μια μελλοντική χρονική στιγμή που οι ίδιοι θα επιλέξουν. Αυτό είναι πολύ πρακτικό και χρήσιμο, όπως καταλαβαίνετε, γιατί έτσι οι χρήστες θα μπορούν να φτιάχνουν αναρτήσεις όταν έχουν χρόνο και να τις προγραμματίζουν να αναρτήθουν, τότε που αυτοί δεν θα έχουν πρόσβαση στο διαδίκτυο. Αυτό είναι πολύ χρήσιμο, γιατί αν για παράδειγμα κάποιος θέλει να πάει διακοπές για μια εβδομάδα, τότε για να μην μείνει το blog του χωρίς ανάρτηση (κάτι που είναι πολύ-πολύ κακό), μπορεί να έχει προγραμματίσει να δημοσιεύονται αναρτήσεις κάθε μέρα! Έτσι κι αυτός θα περνάει ανέμελα τις διακοπές του και παράλληλα το blog του θα είναι ενεργό!



Είναι πολύ εύκολο και απλό να προγραμματίσει κάποιος μια ανάρτηση να δημοσιευτεί στο μέλλον.

Απλά τη στιγμή που γράφει την ανάρτηση, που θέλει να την δημοσίευσει στο μέλλον, πάει και βάζει την ημερομηνία και την ώρα που θέλει να δημοσιευτεί. Και αφού βάλει την μέρα και ώρα που θέλει, πατάει Δημοσίευση Ανάρτησης, κι αυτή θα προγραμματιστεί αυτόματα.



Δείτε και το παρακάτω screenshot για να βοηθηθείτε.




Στο παραπάνω screenshot, η ανάρτηση έχει προγραμματιστεί να δημοσιευτεί το 2014.



Όπως καταλαβαίνετε, με αυτη την λογική, οι στατικές σελίδες του blogger μας είναι τελείως ΆΧΡΗΣΤΕΣ!

Εγώ ποτέ δεν έχω καταλάβει που μας είναι χρήσιμες οι στατικές σελίδες, που μάλιστα είναι εως 10.

Ποιο είναι το νόημα των στατικών σελιδών?

Είναι να δημοσίευουμε περιέχομενο, το οποίο δεν θα φαίνεται στην αρχική μας σελίδα, αλλά για να το δούμε θα πρέπει να έχουν το συγκεκριμένο link. Αυτό είναι ουσιαστικά το νόημα των στατικών σελίδων στο blogger.



Εγώ όταν θέλω να δημοσίευσω μια σελίδα που δεν θέλω όμως να φαίνεται στην αρχική σελίδα του blog μου, απλά την δημοσίευω με πολύ παλαιότερη ημερομηνία. Για παράδειγμα δημοσίευω μια ανάρτηση με ημερομηνία του 2007. Έτσι δεν θα φαίνεται η ανάρτηση στην αρχική σελίδα, αλλά θα υπάρχει η ανάρτηση.



Αυτά είχα να σας πω και σήμερα. Αυτη η ανάρτηση θα είναι χρήσιμη σε νέους bloggers που ακόμα δεν ξέρουν βασικές λειτουργίες του blogger.



Καλή σας μέρα!


Copyrights: /




Feed Subscription Page Peel Effect Add For Blogger (στη πανω δεξια γωνια)



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Από τα καλύτερα και αγαπημένα μου blogger hacks κι αυτό, που θέλω σήμερα να το μοιραστώ μαζί σας. Είναι ένα απίστευτα όμορφο blogger εφέ για το blog σας, που μπαίνει στην πάνω δεξιά γωνία του blog σας, ενώ αναδιπλώνει ανάλογα με τις κινήσεις του ποντικιού. Αυτό το add προοτρέπει τους επισκέπτες σας να εγγραφούν στο newletter σας στο feedburner.


ΣΗΜΑΝΤΙΚΟ: πρέπει να έχετε οπωσδήποτε λογαριασμό και newsletter στο feedburner μόνο! μην πανικοβάλεστε! δείτε το http://www.bloggertips.gr/2010/11/newsletter-how-to-add-feedburner-email.html κια φτιάξτε τώρα τον λογαριασμό σας!



Ακολουθήστε πιστά τα παρακάτω βήματα για να το εγκαταστήσετε στο blog σας:



1. Σύνδεση στον λογαριασμό μας από το blogger.com

2. Σχεδίαση> Επεξεργασία html

3. Με τη βοήθεια του ctrl+F βρείτε το </head> και επικολλήστε τον παρακάτω κωδικό αμέσως πάνω από το </head>


<style type=’text/css’>

img { behavior: url(iepngfix.htc) }

#pageflip {

position: relative;

right: 0; top: 0;

float: right;

}

#pageflip img {

width: 50px; height: 52px;

z-index: 99;

position: absolute;

right: 0; top: 0;

-ms-interpolation-mode: bicubic;

}

#pageflip .msg_block {

width: 50px; height: 50px;

overflow: hidden;

position: absolute;

right: 0; top: 0;

background: url(http://www.wallheaven.com/subscribe.png) no-repeat right top;

}

</style>



<script src=’http://code.jquery.com/jquery-latest.js’ type=’text/javascript’/>

<script type=’text/javascript’>

$(document).ready(function(){



//Page Flip on hover



$("#pageflip").hover(function() {

$("#pageflip img , .msg_block").stop()

.animate({

width: '307px',

height: '319px'

}, 500);

} , function() {

$("#pageflip img").stop()

.animate({

width: '50px',

height: '52px'

}, 220);

$(".msg_block").stop()

.animate({

width: '50px',

height: '50px'

}, 200);

});





});

</script>



To http://www.wallheaven.com/subscribe.png προτείνω να το αφήσετε όπως είναι αν δεν έχετε να βάλετε κάτι καλύτερο.



Εγω για μένα θα το άλλαζα με το http://i723.photobucket.com/albums/ww239/johnpatra/social%20networks/avoda0.png, τώρα εσείς δεν ξέρω αν έχετε κάτι τέτοιο :).



4. Τώρα βρείτε το <body> και επικολλήστε τον παρακάτω κωδικό αμέσως μετά από το <body>


<div id=’pageflip’>

<a href=’http://feeds.feedburner.com/Johnpatrablog‘><img alt=” src=’http://www.wallheaven.com/page_flip.png‘/></a>

<div class=’msg_block’></div>

</div>



Το Johnpatrablog στο http://feeds.feedburner.com/Johnpatrablog το αλλάζετε με τη διεύθυνση του δικού σας λογαριασμού στο feedburner. Πρέπει να βάλετε διεύθυνση μόνο από το feedburner αλλιώς δεν λειτουργεί! Και πρέπει να είναι της παραπάνω μορφής ΜΟΝΟ! Ουσιαστικά το μόνο που αλλάζετε είναι το Johnpatrablog.



Tο http://www.wallheaven.com/page_flip.png προτείνω να το αφήσετε όπως είναι αν δεν έχετε να βάλετε κάτι καλύτερο.



5. Αποθήκευση!





Αν σας άρεσε αφήστε ένα σχόλιο 🙂


Πηγές κωδικών: http://www.sohtanaka.com/,http://www.anshuldudeja.com/,http://www.cssreflex.com/
Copyrights: /




ΕΝΑΛΛΑΣΟΜΕΝΟ BACKGROUND ΣΤΟ BLOG ΣΑΣ



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Για σας είμαι ο joni_joni από το STAGONA  και σήμερα έχω να σας δείξω ένα πολύ ενδιαφέρον gadget. Διαφορετικό background στο blog σας ανάλογα με την ώρα της ημέρας. Αυτό το gadget είναι ειδικό για αυτούς που δεν θέλουν να γίνει το blog τους βαρετό. Οι εικόνες θα αλλάζουν αυτόματα την ώρα που τις έχω ρυθμίσει, έτσι το blog σας θα γίνει πιο διασκεδαστικό και πιο ενδιαφέρον .







Πάμε  να δούμε πως θα το βάλετε







1..Σύνδεση στον λογαριασμό σου στον blogger.com

2..Πίνακας ελέγχου

3..Σχεδίαση4..στοιχεία Σελίδας

5..Προσθήκη gadget6..HTML/Javascript











Και μέσα στο gadget βάζουμε τον παρακατω κωδικα:







                                                                                                                











<script language=”JavaScript”>







day=new Date()     //..get the date







x=day.getHours()    //..get the hour







if(x>=0 && x<3) {










   document.write(‘<style type=”text/css”>body{background: white url(…εδώ το url της εικόνας που θα εμφανίζετε στο blog σας από της 00:00 – 03:00 …..); color: blackbackground-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>’)

} else







if(x>=3&& x<8) {










   document.write(‘<style type=”text/css”>body{background: white url(…εδώ το url της εικόνας που θα εμφανίζετε στο blog σας από της 03:0008:00  …..); color: blackbackground-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>’)

} else







if(x>=8 && x<12) {










   document.write(‘<style type=”text/css”>body{background: white url(…εδώ το url της εικόνας που θα εμφανίζετε στο blog σας από της  08:0012:00  …..); color: blackbackground-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>’)

} else







if (x>=12 && x<18) {







   document.write(‘<style type=”text/css”>body{background: white url(…εδώ το url της εικόνας που θα εμφανίζετε στο blog σας από της 12:00 – 18:00 …..); color: blackbackground-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>’)














} else

if (x>=18 && x<22) {













 document.write(‘<style type=”text/css”>body{background: white url(…εδώ το url της εικόνας που θα εμφανίζετε στο blog σας από της  18:0022:00  …..); color: blackbackground-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>’)














} else

if (x>=22 && x<24) {













 document.write(‘<style type=”text/css”>body{background: white url(…εδώ το url της εικόνας που θα εμφανίζετε στο blog σας από της  22:0024:00  …..); color: blackbackground-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>’)



}

</script>










                                                                                               










7..Αποθήκευση  και είστε έτοιμοι!







***Αυτή η ανάρτηση έγινε από το:  http://stagona-stagona.blogspot.com




















Automatic Read More Function in Blogger Posts – Αυτόματο “Διαβάστε περισσότερα…” (UPDATE 2011)



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Γεια σας.



Το πιο σημαντικό και διαχρονικό blogger trick είναι ο διαχωρισμός των αναρτήσεων με τη λειτουργία του “Read More”.Δηλαδή στην αρχική σελίδα να μην φαίνεται όλη η ανάρτηση αλλά ένα μέρος της και για να εμφανιστεί το υπόλοιπο θα πρέπει ο ενδιαφερόμενος να πατήσει το Read more.

Όποιος θέλει να δει πως θα βάλει το απλό read more στο blog του ας κοιτάξει στο http://johnpatrablog.blogspot.com/2009/07/read-more-blog.html.

Σήμερα θα μιλήσουμε για ένα άλλο θέμα.

Παρακάτω θα βρείτε την απάντηση στην ερώτηση:

“Πώς θα κόβονται οι αναρτήσεις μου αυτόματα?”

Ναι υπάρχει κι αυτή η δυνατότητα.

Προσφέρει 2 πλεονεκτήματα και ένα μειονέκτημα.

Πλεονεκτήματα:

1)Δεν χρειάζεται να κόβεις τις αναρτήσεις σου “χειρονακτικά” αλλά κόβονται αυτόματα.(δηλαδή τα <span class=”fullpost”>

</span> είναι άχρηστα’δεν θα τα βάζετε εσείς αλλά προστίθονται αυτόματα)

2)Ρυθμίζεις στους πόσους χαρακτήρες θέλεις να κόβονται κι έτσι όλες οι αναρτήσεις σου είναι ομοιόμορφες.(όπως σε μένα)

Μειονεκτήματα:

1)Στο απλό read more καθορίζεις ο ίδιος μέχρι πιο σημείο θα είναι στην αρχική σελίδα η αναρτηση σου.Στο αυτόματο καθορίζεται αυτόματα.



Πάμε τώρα να δούμε πως θα το βάλετε αυτό.



Κάνουμε log in στον blogger account μας,πάμε διάταξη και μετά επεξεργασία html.

Πατάμε “Επέκταση προτύπων γραφικών στοιχείων”

Με τη βοήθεια του ctrl+F βρίσκουμε το



</head>



Αμέσως από πάνω του βάζουμε τον παρακάτω κώδικα:


<script type=’text/javascript’>var thumbnail_mode = “no-float” ;

summary_noimg = 430;

summary_img = 340;

img_thumb_height = 100;

img_thumb_width = 120;

</script>

<script type=’text/javascript’>

//<![CDATA[

function removeHtmlTag(strx,chop){

if(strx.indexOf(“<“)!=-1)

{

var s = strx.split(“<“);

for(var i=0;i<s.length;i++){

if(s[i].indexOf(“>”)!=-1){

s[i] = s[i].substring(s[i].indexOf(“>”)+1,s[i].length);

}

}

strx = s.join(“”);

}

chop = (chop < strx.length-1) ? chop : strx.length-2;

while(strx.charAt(chop-1)!=’ ‘ && strx.indexOf(‘ ‘,chop)!=-1) chop++;

strx = strx.substring(0,chop-1);

return strx+’…’;

}



function createSummaryAndThumb(pID){

var div = document.getElementById(pID);

var imgtag = “”;

var img = div.getElementsByTagName(“img”);

var summ = summary_noimg;

if(img.length>=1) {

imgtag = ‘<span style=”float:left; padding:0px 10px 5px 0px;”><img src=”‘+img[0].src+'” width=”‘+img_thumb_width+’px” height=”‘+img_thumb_height+’px”/></span>’;

summ = summary_img;

}



var summary = imgtag + ‘<div>’ + removeHtmlTag(div.innerHTML,summ) + ‘</div>’;

div.innerHTML = summary;

}





//]]>

</script>



Εδώ όπως θα δείτε, μπορούμε (και πρέπει ίσως ) να χρησιμοποιήσουμε ‘μεταβλητές’ παραμέτρους στον παραπάνω κώδικα. Εδώ σας εξηγώ ποιές και τι κάνει η κάθε μία:



var thumbnail_mode = “float” ; — Με αυτήν την μεταβλητή, αποφασίζετε εάν το εικονίδιο που θα εμφανίζεται στην ανάρτησή σας, θα κάνει “float” αριστερά (float), ή θα εμφανίζεται απλά ‘άτακτα΄ στην ανάρτηση (οπότε αλάξτε το και κάντε το: no-float).

summary_noimg = 250; — Προσδιορίζει πόσοι χαρακτήρες θα εμφανίζονται σε μια ανάρτηση, η οποία δεν έχει εικόνα (no images/thumbnail) Στην περίπτωσή μας, είναι 250.

summary_img = 250; — Προσδιορίζει πόσοι χαρακτήρες θα εμφανίζονται σε μια ανάρτηση, η οποία έχει εικόνα (with images/thumbnail) Στην περίπτωσή μας, είναι 250 και πάλι.

img_thumb_height = 120; — Εικονίδια (Thumbnails) Ύψος (height) σε pixels.

img_thumb_width = 120; — Εικονίδια (Thumbnails) Πλάτος (with) σε pixels.



Ακόμα δε τελειωσαμε.



Βρείτε τον παρακάτω κωδικό:




<data:post.body/>





Αντικαταστήστε τον παραπάνω κωδικό με τον κάτω:


<b:if cond=’data:blog.pageType != “item”‘>

<div expr:id='”summary-” + data:post.id’><data:post.body/></div>

<script type=’text/javascript’>createSummaryAndThumb(“summary-<data:post.id/>”);</script>

<a class=’readmore’ expr:href=’data:post.url’>Read more »</a>

</b:if>

<b:if cond=’data:blog.pageType == “item”‘><data:post.body/></b:if>



Το “Read more »” μπορείτε να το αλλάξετε με κείμενο της αρεσκείας σας.





Βρείτε τώρα το </b:skin> και πριν από αυτό επικολλήστε το παρακάτω:


a.readmore {

/* CSS properties go here */

}



Αποθηκεύστε το πρότυπο σας και είστε έτοιμοι!


Πηγές: Κωδικοί και μέρος της ανάρτησης από http://nikos63.blogspot.com/
Copyrights: /




BACKGROUND ΧΡΩΜΑ ΣΕ ΤΙΤΛΟ ΑΝΑΡΤΗΣΗΣ ΚΑΙ ΠΕΡΙΕΧΟΜΕΝΟ ΑΝΑΡΤΗΣΗΣ



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Σήμερα θα δείτε πως μπορεί να αλλάξει το background χρώμα σε έναν τίτλο μιας ανάρτησης ή και στο περιεχόμενο της ανάρτησης. Δεν αλλάζουμε γενικώς τα χρώματα! Αυτά αλλάζουν μόνο από Σχεδίαση>Σχεδιαστή προτύπων>Προηγμένη. Εμείς απλά αλλάζουμε αλλιώς τα χρώματα σε μια μόνο ανάρτηση. Ο κωδικός είναι ίδιος και για τις δυο περιπτώσεις (τον τίτλο & το περιεχόμενο).



Όταν γράφετε λοιπόν μια ανάρτηση και θέλετε να αλλάξετε το background χρώμα στον τίτλο της, βάζετε το παρακάτω κωδικό:



Αντίστοιχα βάζετε τον παρακάτω κωδικό και αν θέλετε να αλλάξετε το περιεχόμενο της ανάρτηση (τον κωδικό τον επικολλάμε, ενώ βρισκόμαστε στην καρτέλα “Σύνθεση” και όχι “Επεξεργασία html”!):


<div style=”background:#000000; padding:5px 8px 5px 8px;”>ΕΔΩ_Ο_ΤΙΤΛΟΣ_ΤΗΣ_ΑΝΑΡΤΗΣΗΣ_ΣΑΣ_ή_ΤΟ_ΠΕΡΙΕΧΟΜΕΝΟ_ΤΗΣ</div>



ΕΔΩ_Ο_ΤΙΤΛΟΣ_ΤΗΣ_ΑΝΑΡΤΗΣΗΣ_ΣΑΣ_ή_ΤΟ_ΠΕΡΙΕΧΟΜΕΝΟ_ΤΗΣ ==> εδώ γράφετε ή τον τίτλο της ανάρτησής σας ή το περιεχόμενό της



background:#000000; ==> αυτό αντιπροσωπεύει το background χρώμα. Τους html κωδικούς των χρωμάτων μπορείτε να τα βρείτε από το http://www.bloggertips.gr/2009/08/html-color-codes-and-names.html





Είναι πολύ εύκολο όπως βλέπετε.


TIP:



Αν θέλετε να αλλάζετε τα χρώματα σε κάθε ανάρτησή σας, τότε μπορείτε να αποθηκεύσετε τον παραπάνω κωδικό σε κάθε ανάρτησή σας και να τον έχετε έτοιμο. Αυτό το κάνουμε από Ρυθμίσεις>Διαμόρφωση>Πρότυπο Ανάρτησης>Επικόλληση κώδικα και Αποθήκευση Ρυθμίσεων!

Και τώρα θα έχετε έτοιμο τον κώδικα κάθε φορά που θα γράφετε μια νέα ανάρτηση. Απλά θα αλλάζετε τα χρώματα.



Ελπίζω να σας φάνηκα χρήσιμος!



Πηγές κωδικών: http://gubhugreyot.blogdetik.com/, http://bloggershappiness.blogspot.com/

Copyrights: /




ΕΝΑΛΛΑΣΣΟΜΕΝΕΣ ΕΙΚΟΝΕΣ (Νο2)



Print Friendly and PDFPrintPrint Friendly and PDFPDF




Νέοι bloggers γειά σας !Σήμερα σας παρουσιάζω το κώδικα που κάνει τις εικόνες σας onmouseover (δηλαδή, όταν περνάει από πάνω τους το ποντίκι να αλλάζουν όψη)…βασική προυπόθεση όμως είναι να ταιριάζουν λίγο στα μεγέθη αυτές οι φωτογραφίες (δηλ. και οι 2 πλαγιαστές, η και οι 2 όρθιες)

Το κώδικα που σας δίνω τον βρήκα , (δεν τον έφτιαξα εγώ, βεβαίως), αλλά τον δοκίμασα πολλές φορές μέχρι να βεβαιωθώ ότι δουλεύει με πολλές φωτογραφίες στο ίδιο blog !!!

Ο τρόπος που βάζουμε το κώδικα είναι γνωστός, και σας τον ξαναθυμίζω:

BLOGGER επεξεργασία διάταξης=>Σχεδίαση=>Στοιχεία Σελίδας=>GADGET=>HTML/JavaScript :




Χρώμα πίσω από την ανάρτηση και τον τίτλο της



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Νέοι bloggers γειά σας !..Αν βαρεθήκατε την ασπρίλα και την μονοτονία του ίδιου χρώματος σε όλες τις αναρτήσεις σας, τότε ήρθε η ώρα να τα βάψετε και τα δύο…βάλτε αυτόν τον κώδικα που σας δίνω, ΚΑΙ στην αρχή της ανάρτησης, ΚΑΙ στην αρχή του κώδικα της ανάρτησης:



<div style=”background:#0B0B61; padding:5px 8px 5px 8px;”> ΤΙΤΛΟΣ Η ΑΝΑΡΤΗΣΗ </div>



αυτό ηταν…πατάτε ΑΠΟΘΗΚΕΥΣΗ, η ΠΡΟΕΣΚΟΠΗΣΗ για να δειτε πως φαίνεται…εννοείται οτι βρίσκετε το κατάλληλο χρώμα ΕΔΩ …και αντικαθιστάτε το #0B0B61




ΔΙΑΓΡΑΨΤΕ ΤΑ BLOGGER LINKS ΣΤΟ ΤΕΛΟΣ ΤΩΝ ΑΝΑΡΤΗΣΕΩΝ ΣΑΣ – Remove Older Post and Posts (Atom) Links



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Αν σας την σπάνε αυτά τα λινκς διαγράψτε τα!



Σύνδεση στον blogger account μας

Σχεδίαση

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

Με ctrl+F βρείτε τους παρακάτω μαύρους κωδικούς και προσθέστε τους κόκκινους κωδικούς:



Για το Νεότερη – Αρχική – Παλαιότερη:

#blog-pager-newer-link {

display: none;

}



#blog-pager-older-link {

display: none;

}



#blog-pager {

display: none;

}



Για το Εγγραφή σε: Αναρτήσεις(Atom):



.feed-links {

display: none;

}



Αν σου άρεσε αυτό το hack, δημοσίευσέ το στο Facebook!

Σε ευχαριστώ για την υποστήριξή σου!




ΑΦΑΙΡΕΣΤΕ ΤΗΝ ΜΠΑΡΑ ΤΟΥ BLOGGER (HOW TO REMOVE BLOGGER NAVIGATION BAR)



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Γειά σε όλους! Το όνομά μου είναι Μιχάλης και αυτό είναι το πρώτο μου post στο johnpatra.com. Γι’ αυτό , διάλεξα κάτι ξεχωριστό!

Όλα τα blog έχουν το blogger navbar , έτσι αποφάσισα να σας δείξω πως να το αφαιρέσετε!





1. Κάντε σύνδεση στο blogger

2. Σχεδίαση

3. Επεξεργασία HTML

4. CTRL + F και ψάχνουμε το ”Name    :”

5. Από κάτω απο τις πολλές παύλες (—–) βάζουμε τον κωδικό : 





#navbar-iframe {display: none !important;}





6. Πατήστε το κουμπί ”Αποθήκευση ”





ΤΕΛΕΙΩΣΑΜΕ!! ΕΥΚΟΛΟ ΔΕΝ ΗΤΑΝ;;





ΑΝ ΔΕΝ ΚΑΤΑΛΑΒΑΤΕ ΚΑΤΙ ΜΠΟΡΕΙΤΕ ΝΑ ΔΕΙΤΕ ΚΑΙ ΤΟ ΒΙΝΤΕΟ :