ΠΩΣ ΦΤΙΑΧΝΩ ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ ΜΕ ΕΓΧΡΩΜΕΣ ΚΑΤΗΓΟΡΙΕΣ ΚΑΙ 2 ΣΤΗΛΕΣ

ΠΩΣ ΦΤΙΑΧΝΩ ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ ΜΕ ΕΓΧΡΩΜΕΣ ΚΑΤΗΓΟΡΙΕΣ ΚΑΙ 2 ΣΤΗΛΕΣ
Με τον παρακάτω κώδικα μπορείτε να εμφανίσετε σε μία σελίδα του blogger όλες τις αναρτήσεις του ιστολογίου σας ανά κατηγορίες ετικετών σε διάταξη 2 στηλών και να έχει κάθε κατηγορία το δικό της χρώμα background. Ανοίξτε μία σελίδα του blogger, πατήστε την HTML διάταξη και επικολλήστε μέσα στη σελίδα τον παρακάτω κώδικα. Αυτά που πρέπει να αλλάξετε είναι :

1. Τα χρώματα των backgrounds που έχουν μπροστά τους το σύμβολο της δίεσης #.

2. Την περιγραφή της κατηγορίας των αναρτήσεων που είναι με πορτοκαλί γράμματα.

3. Το url του δικού μου blog που είναι με πράσινα γράμματα με το url του δικού σας blog.

4. Την ετικέτα της κατηγορίας αναρτήσεων που θέλετε να εμφανίζονται με τα κίτρινα γράμματα. 
5. Τον αριθμό 100 αν υπάρχουν περισσότερες από 100 αναρτήσεις σε κάποια κατηγορία.

6. Το συνολικό πλάτος ανάρτησης που έχω βάλει στη 2^η γραμμή (960px) με το δικό σας πλάτος ανάρτησης.

7. Το πλάτος της αριστερής στήλης που έχω βάλει στην 3^η γραμμή (470px) με δικό σας πλάτος.

8. Το πλάτος της δεξιάς στήλης που έχω βάλει στην 14^η γραμμή (470px) με δικό σας πλάτος.

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

Για παράδειγμα αν διαθέτετε συνολικό πλάτος ανάρτησης 700px τότε βάλτε στην 2^η γραμμή κώδικα αυτό το πλάτος δηλ. 700px και στην 3^η και 14^η γραμμή κώδικα βάλτε το μισό πλάτος δηλαδή 350px – 10px για τα περιθώρια = 340 για κάθε στήλη και τέλος.

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

<script src='https://github-codes.github.io/mycodes/javascripts/archive-page-1n.js'></script>

<div style="width: 960px;">

<div style="float: left; padding: 1px; width: 470px;">

<div style="background:#173377; border-radius:5px; height:auto; width:auto; overflow:auto; padding:4px;">

<span style="font:bold 16px Arial; background-color:#FFFF00;color:black;">FACEBOOK WIDGETS</span>

<script src="https://the-best-widgets.blogspot.gr/feeds/posts/summary/-/FACEBOOK WIDGETS?max-results=100&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#105105; border-radius:5px; height:auto; width:auto; overflow:auto; padding:5px;">

<span style="font:bold 16px Arial; background-color:#FFFF00;color:black;">ON LINE TOOLS</span>

<script src="https://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ON LINE TOOLS?max-results=100&amp;alt=json-in-script&amp;callback=recentpostslist"></script>

</div>

</div>

<div style="float: left; padding: 1px; width: 470px;">

<div style="background:#661111;border-radius:5px; height:auto; width:auto; overflow:auto; padding:5px;">

<span style="font:bold 16px Arial; background-color:#FFFF00;color:black;">ΣΧΟΛΙΑ BLOGGER</span>

<script src="https://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΣΧΟΛΙΑ BLOGGER?max-results=100&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#621061;border-radius:5px; height:auto; width:auto; overflow:auto; padding:5px;">

<span style="font:bold 16px Arial; background-color:#FFFF00;color:black;">TEXT BOXES</span>

<script src="https://the-best-widgets.blogspot.gr/feeds/posts/summary/-/TEXT BOXES?max-results=100&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#532000; border-radius:5px; height:auto; width:auto; overflow:auto; padding:5px;">

<span style="font:bold 16px Arial; background-color:#FFFF00;color:black;">ΣΥΜΒΟΥΛΕΣ SEO</span>

<script src="https://the-best-widgets.blogspot.gr/feeds/posts/summary/-/SEO?max-results=100&amp;alt=json-in-script&amp;callback=recentpostslist"></script>

</div>

</div>

</div>

FACEBOOK WIDGETS

1. TWITTER FOLLOW FLYING BIRD
2. FACEBOOK LIST AND GALLERY STYLE RSS FEED WIDGET BY RSS.APP
3. ΠΩΣ ΒΑΖΩ FACEBOOK PAGE RSS FEED WIDGET ΣΤΟ BLOG MOY
4. ΠΩΣ ΒΑΖΩ ΒΙΝΤΕΟ ΑΠΟ ΤΟ FACEBOOK ΣΤΟ BLOG ΜΟΥ
5. ΠΩΣ ΒΑΖΩ FACEBOOK PHOTO GALLERY WIDGET 1
6. ΠΩΣ ΒΑΖΩ FACEBOOK LIKE BUTTON ΣΤΟ BLOG ΜΟΥ
7. ΠΩΣ ΒΑΖΩ FACEBOOK LIKE BOX (ΝΕΟ ΑΝΑΝΕΩΜΕΝΟ)
8. ΠΩΣ ΒΑΖΩ ΣΧΟΛΙΑ FACEBOOK ΚΑΤΩ ΑΠΟ ΟΛΕΣ ΤΙΣ ΑΝΑΡΤΗΣΕΙΣ
9. ΠΩΣ ΒΡΙΣΚΩ ΤΟ FACEBOOK ID
10. ΠΩΣ ΒΑΖΩ FACEBOOK POP UP LIKE BOX
11. ΠΩΣ ΒΑΖΩ FACEBOOK FLOATING LIKE BOX
12. ΠΩΣ ΒΑΖΩ ΣΧΟΛΙΑ FACEBOOK ΣΤΟ BLOG MOY

ON LINE TOOLS

1. 10 ΔΩΡΕΑΝ SCREEN SHOTS PROGRAMS
2. 20 ΔΩΡΕΑΝ ΥΠΗΡΕΣΙΕΣ ΓΙΑ VOIP VIDEO CALLS
3. 20 ΔΩΡΕΑΝ ΥΠΗΡΕΣΙΕΣ FREE HOSTING
4. ΠΟΥ ΝΑ ΑΝΕΒΑΣΩ ΔΩΡΕΑΝ ΤΙΣ ΦΩΤΟΓΡΑΦΙΕΣ ΜΟΥ
5. ΠΟΥ ΝΑ ΑΝΕΒΑΣΕΤΕ ΔΩΡΕΑΝ ΤΙΣ ΠΑΡΟΥΣΙΑΣΕΙΣ ΣΑΣ (10 online services)
6. ΟΙ 50 ΚΑΛΥΤΕΡΕΣ ΜΗΧΑΝΕΣ ΑΝΑΖΗΤΗΣΗΣ
7. ΟΙ 40 ΚΑΛΥΤΕΡΟΙ BROWSERS
8. ΠΩΣ ΒΑΖΩ FORUM ΣΤΟ BLOG ΜΟΥ (12 on line services)
9. FREE BANNER CREATORS (25 on line services)
10. ΠΟΥ ΝΑ ΑΝΕΒΑΣΕΤΕ ΔΩΡΕΑΝ ΤΗ ΜΟΥΣΙΚΗ ΣΑΣ. (10 on line services)
11. ΠΩΣ ΒΑΖΩ CHAT ΣΤΟ BLOG ΜΟΥ (20 ON LINE SERVICES)
12. 15 ΔΩΡΕΑΝ ΠΡΟΓΡΑΜΜΑΤΑ ΔΙΑΧΕΙΡΙΣΗΣ EMAIL
13. ΠΩΣ ΝΑ ΒΑΛΕΤΕ ΜΕΤΡΗΤΕΣ ΣΤΟ BLOG ΣΑΣ (25 online services)
14. ΚΑΝΤΕ ΜΙΑ ΑΝΑΛΥΣΗ SEO ΣΤΟ BLOG ΣΑΣ (13 ΕΡΓΑΛΕΙΑ)
15. ΔΟΚΙΜΑΣΤΕ ΤΟΥΣ ΚΩΔΙΚΕΣ ΣΑΣ ΣΕ HTML VIEWERS
16. ΜΕΤΡΗΣΤΕ ΤΗΝ ΤΑΧΥΤΗΤΑ ΦΟΡΤΩΣΗΣ ΤΟΥ BLOG ΣΑΣ
17. ΔΕΙΤΕ ΠΟΣΑ BACKLINKS ΕΧΕΙ ΤΟ BLOG ΣΑΣ

ΣΧΟΛΙΑ BLOGGER

1. ΠΡΟΣΦΑΤΑ ΣΧΟΛΙΑ ΜΕ AVATAR No 2
2. ΠΩΣ ΔΙΑΜΟΡΦΩΝΩ ΤΟ LINK ΤΩΝ ΣΧΟΛΙΩΝ ΤΟΥ BLOGGER
3. ΠΩΣ ΑΛΛΑΖΩ ΤΟ BACKGROUND ΤΩΝ ΣΧΟΛΙΩΝ ΤΟΥ BLOGGER
4. ΠΩΣ ΒΑΖΩ ΕΝΕΡΓΟ LINK ΣΤΑ ΣΧΟΛΙΑ ΤΟΥ BLOGGER
5. WIDGET ΜΕΤΡΗΤΗΣ ΑΝΑΡΤΗΣΕΩΝ ΚΑΙ ΣΧΟΛΙΩΝ No 2
6. ΠΡΟΣΦΑΤΑ ΣΧΟΛΙΑ ΜΕ AVATAR No 1
7. ΠΩΣ ΒΑΖΩ ΜΕΤΡΗΤΗ ΣΧΟΛΙΩΝ ΔΕΞΙΑ ΑΠΟ ΤΟΝ ΤΙΤΛΟ ΑΝΑΡΤΗΣΗΣ
8. WIDGET ΜΕΤΡΗΤΗΣ ΑΝΑΡΤΗΣΕΩΝ ΚΑΙ ΣΧΟΛΙΩΝ Νο 1
9. WIDGET ΜΕ ΤΑ ΠΙΟ ΠΡΟΣΦΑΤΑ ΣΧΟΛΙΑ

TEXT BOXES

1. FLOATING TEXT BOX OPENS WITH MOUSEOVER
2. 3D ANIMATED TEXT
3. ΚΕΙΜΕΝΟ ΠΟΥ ΑΝΑΒΟΣΒΗΝΕΙ ΚΑΙ ΑΥΞΟΜΕΙΩΝΕΤΑΙ
4. TEXT BOX ΜΗΝΥΜΑΤΩΝ ΜΕ ΕΦΕ ΓΡΑΦΟΜΗΧΑΝΗΣ
5. ΠΡΟΒΟΛΗ TEXT BOX ΑΠΟ ΑΝΑΠΤΥΣΟΜΕΝΟ ΜΕΝΟΥ
6. ΑΝΑΔΥΟΜΕΝΟ TEXT BOX ΜΕ ΕΙΚΟΝΑ ΠΟΥ ΑΝΟΙΓΕΙ ΜΕ MOUSEOVER
7. ΑΝΑΔΥΟΜΕΝΟ TEXT BOX ΠΟΥ ΑΝΟΙΓΕΙ ME BUTTON
8. TEXT BOXES ΜΕ KEIMENO, ΕΙΚΟΝΕΣ, ΒΙΝΤΕΟ ΚΑΙ BUTTONS No 2
9. TEXT BOXES ΜΕ KEIMENO, ΕΙΚΟΝΕΣ, ΒΙΝΤΕΟ ΚΑΙ BUTTONS No 1
10. ΚΟΥΤΙ ΠΕΡΙΓΡΑΦΗΣ ΟΤΑΝ ΠΕΡΝΑΤΕ ΤΟ MOUSE ΠΑΝΩ ΑΠΟ ΜΙΑ ΛΕΞΗ
11. ΠΩΣ ΒΑΖΩ ΠΕΡΙΓΡΑΦΗ ΠΑΝΩ ΑΠΟ ΜΙΑ ΛΕΞΗ Ή ΦΡΑΣΗ ΤΗΣ ΑΝΑΡΤΗΣΗΣ ΜΟΥ
12. ΠΩΣ ΒΑΖΩ ΠΙΝΑΚΑ ΜΕΣΑ ΣΕ ΜΙΑ ΑΝΑΡΤΗΣΗ
13. ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 4
14. ΠΩΣ ΒΑΖΩ ΚΕΙΜΕΝΟ ΜΕ CLICKABLE ΕΙΚΟΝΑ ΣΤΗΝ ΠΛΑΪΝΗ ΜΠΑΡΑ
15. ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 3
16. ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 2
17. ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 1

ΣΥΜΒΟΥΛΕΣ SEO

1. ΠΩΣ ΝΑ ΦΟΡΤΩΝΕΙ ΓΡΗΓΟΡΑ ΤΟ BLOG ΜΟΥ
2. ΓΙΑΤΙ ΔΕΝ ΕΜΦΑΝΙΖΕΤΑΙ ΤΟ BLOG ΜΟΥ ΣΤΗΝ ΑΝΑΖΗΤΗΣΗ GOOGLE
3. ΣΥΜΒΟΥΛΕΣ ΓΙΑ ΕΝΑ BLOG ΜΕ ΚΑΛΟ SEO, ΕΜΦΑΝΙΣΙΜΟ & ΛΕΙΤΟΥΡΓΙΚΟ
4. ΠΩΣ ΒΑΖΩ DUBLIN CORE META TAGS
5. ΒΕΛΤΙΣΤΟΠΟΙΗΣΗ ΤΙΤΛΟΥ ΓΙΑ ΚΑΛΥΤΕΡΟ SEO
6. ΠΩΣ ΒΑΖΩ META TAGS ΣΤΟ BLOGGER
7. ΠΩΣ ΒΑΖΩ OPEN GRAPH TAGS ΣΤΟ BLOGGER