Royale Noir - Stylish dark Blogger template.

Preview Download

Έχει περάσει καιρός απο τότε που κυκλοφόρησα ενα Blogger πρότυπο.

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

Royale Noir είναι ένα σκούρο μοντέρνο πρότυπο με 2 στήλες, με widgetized τμήματα στο υποσέλιδο και στην πλαϊνή μπάρα, για οποιαδήποτε gadgets θέλετε να συμπεριλάβετε.

Αυτό το πρότυπο χρησιμοποιεί αρκετά CSS3 στοιχεία, για να δημιουργηθεί πιο καινοτόμος σχεδιασμός χωρίς τη χρήση εικόνων φόντου.

Συμβατότητα:

Το έχω δοκιμάσει σε Internet Explorer (7-8), Opera και Safari.

Ενώ οι στρογγυλεμένες γωνίες και text-shadow αποτελέσματα ενδεχετε να μην λειτουργούν στα προγράμματα περιήγησης που δεν υποστηρίζουν CSS3, χωρίς όμως να δημιουργούν άσχημα η ανεπιθύμητα αποτελέσματα.

Creative Commons Attribution

Αυτό το έργο διανέμεται υπό την Creative Commons Attribution 3.0 License που σημαίνει ότι είστε ελεύθεροι να χρησιμοποιήσετε , να διανέμετε , να παρουσιάσετε στο κοινό το Έργο, να το τροποποιήσετε για οποιοδήποτε σκοπό. Με μόνη προϋπόθεση να μην αφαιρεθούν οι σύνδεσμοι προς δημιουργούς από το footer.

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

Κύρια χαρακτηριστικά του Royale Noir

Fixed width
2 columns
Widget ready
Modern theme
125x125 Banners Ready
Όμορφα σχεδιασμένο Comment Section
Αυτόματα Sidebar tabs
Page Navigation

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

Ρυθμίσεις

Για να ρυθμίσετε το Header NavBar:

1. Βρείτε στο πρότυπο σας τον παρακάτω κώδικα:

<!--Navigation Menu-->
<div id='menu_navigation'>
<ul class='menu'>
<li><a class='on' href='/'>Home</a></li>
<li class='cat-item-1'><a href='YOUR-LINK-HERE' title='Text 1'>YOUR Text</a>
</li>
<li class='cat-item-2'><a href='YOUR-LINK-HERE' title='Text 2'>YOUR Text</a>
</li>
<li class='cat-item-3'><a href='YOUR-LINK-HERE' title='Text 3'>YOUR Text</a>
</li>
<li class='cat-item-5'><a href='YOUR-LINK-HERE' title='Text 4'>YOUR Text</a>
</li>
<li class='cat-item-6'><a href='YOUR-LINK-HERE' title='Text 5'>YOUR Text HERE</a>
</li>
<li class='cat-item-7'><a href='YOUR-LINK-HERE' title='ΑΡΧΕΙΑ'>ΑΡΧΕΙΑ</a>
</li>
<li class='cat-item-8'><a href='feeds/posts/default' title='Subscribe to our feeds'>Post RSS</a>
</li>
<li class='cat-item-9'><a href='feeds/comments/default' title='Subscribe to our Atom feeds'>RSS Atom</a>
</li>
</ul>
</div>
<!--End Navigation Menu-->

2. Και αλλάξτε τα url με τα δικά σας.

Για να ρυθμίσετε τα αυτοματα Sidebar tabs:

<!-- Tabs -->
<div class='widgets' id='tabzine'>
<ul class='tabnav'>
<li class='Foll'><a href='#tab1'>Followers</a></li>
<li class='Σχολ'><a href='#tab2'>Σχόλια</a></li>
<li class='Προσφ'><a href='#tab3'>Πρόσφατα</a></li>

Απλά αλλάξτε τα σημεία με έντονο κόκκινο χρώμα με τις ονομασίες απο τα gadgets που θα εισάγετε στα tabs.

Για να ρυθμίσετε το Comment Reply Option:

1. Βρείτε στο πρότυπο σας τον παρακάτω κώδικα:

<span class='comment-reply'><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=YOUR-BLOG-ID&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'>[Reply]</a></span>

2. Και αλλάξτε το YOUR-BLOG-ID με το ID του blog σας

3. Για να βρείτε το ID του blog σας , απλά πατήστε Ανάρτηση -> Νέα Ανάρτηση και δείτε πάνω στην σελίδα το addres bar, εκεί θα δείτε κάτι σαν αυτό: http://blogger.com/post-create.g?blogID= χχχχχχχχχχχχ

Αντιγράφετε τα νούμερα ( χχχχχχχχχχχχ ) που θα δείτε στο τέλος και αντικαταστήστε τοYOUR-BLOG-ID με το ID του blog σας

Για να εισαγετε gadgets στα tabs:

Αυτό θα το κάνετε κανονικά, όπως θα το κάνατε αν θέλατε να εισάγετε στο πρότυπό σας κάποιο gadget.
Απλά πατήστε Προσθήκη gadget και εισάγετε όποιο gadget θέλετε, ή μετακινήστε στα Tabs απο οποιοδήποτε σημείο του προτύπου κάποια gadget.

Δείτε την φωτογραφία για να καταλάβετε καλύτερα:

Για να ρυθμίσετε τα 125x125 Banners:

1. Βρείτε στο πρότυπο σας τον παρακάτω κώδικα:

<div class='ads125'>
<a href='YOUR-LINK-HERE'><img alt='Ad' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHPBuzknjx0_bmw8Y7sRfa_IPT29Q-Ao_R5QnEBlyiUd62Wk0-EHb3GX4konccOpe02jPfqAOvzKHFb0G3AdyUxXmDBVSfQMF4slwhKfNwDo4UoQaTYqqSAsmiEK_cVhPniO4dUaYvh1nN/s1600/33.jpg'/></a>
<a href='YOUR-LINK-HERE'><img alt='Ad' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHPBuzknjx0_bmw8Y7sRfa_IPT29Q-Ao_R5QnEBlyiUd62Wk0-EHb3GX4konccOpe02jPfqAOvzKHFb0G3AdyUxXmDBVSfQMF4slwhKfNwDo4UoQaTYqqSAsmiEK_cVhPniO4dUaYvh1nN/s1600/33.jpg'/></a>
<a href='YOUR-LINK-HERE'><img alt='Ad' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHPBuzknjx0_bmw8Y7sRfa_IPT29Q-Ao_R5QnEBlyiUd62Wk0-EHb3GX4konccOpe02jPfqAOvzKHFb0G3AdyUxXmDBVSfQMF4slwhKfNwDo4UoQaTYqqSAsmiEK_cVhPniO4dUaYvh1nN/s1600/33.jpg'/></a>
<a href='YOUR-LINK-HERE'><img alt='Ad' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHPBuzknjx0_bmw8Y7sRfa_IPT29Q-Ao_R5QnEBlyiUd62Wk0-EHb3GX4konccOpe02jPfqAOvzKHFb0G3AdyUxXmDBVSfQMF4slwhKfNwDo4UoQaTYqqSAsmiEK_cVhPniO4dUaYvh1nN/s1600/33.jpg'/></a>
<a href='YOUR-LINK-HERE'><img alt='Ad' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHPBuzknjx0_bmw8Y7sRfa_IPT29Q-Ao_R5QnEBlyiUd62Wk0-EHb3GX4konccOpe02jPfqAOvzKHFb0G3AdyUxXmDBVSfQMF4slwhKfNwDo4UoQaTYqqSAsmiEK_cVhPniO4dUaYvh1nN/s1600/33.jpg'/></a>
<a href='YOUR-LINK-HERE'><img alt='Ad' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHPBuzknjx0_bmw8Y7sRfa_IPT29Q-Ao_R5QnEBlyiUd62Wk0-EHb3GX4konccOpe02jPfqAOvzKHFb0G3AdyUxXmDBVSfQMF4slwhKfNwDo4UoQaTYqqSAsmiEK_cVhPniO4dUaYvh1nN/s1600/33.jpg'/></a>
</div>
<!-- /ADS ends Here-->

2. Και αλλάξτε τα links με τα δικά σας.

Για να ενεργοποιήσετε τα post share buttons:

Πηγαίνετε Σχεδίαση >> Στοιχεία Σελίδας και στο πλαίσιο Αναρτήσεις ιστολογίου ( ακριβώς απο κάτω ) πατήστε Επεξεργασία.

Θα ανοιξει ενα παραθυρακι Διαμόρφωση αναρτήσεων ιστολογίου  και εκει επιλεξτε Εμφάνιση κουμπιών κοινής χρήσης 

Για να ρυθμίσετε το Sidebar Follow :

1. Βρείτε στο πρότυπο σας τον παρακάτω κώδικα:

<!-- /Follow -->
<div class='follow'>
<img alt='rss' height='39' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBcGiC4vI3PD1uWmsLKv9SUwFWN4PqL0NslUSB8mFV12D5yKW7inKVL6O6bAUeTFn2DA3zAUXX0vuy2hb-ZJscUaNDlGl_MwlUYBeSzqf0hFEA-vlcxrWycZTWa_P6ErciR9kOOhmOZzRj/s320/follow.png' width='93'/>
<!-- /RSS -->
<a href='/feeds/posts/default'><img alt='rss' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXQOuGFZHqqfHaBsywO4ZX8Abrcslk9ovC3VpoWDPyCEFzOlGZtmUEbyQVcOU9rxG75FYfGU8l-LrPP3LwcGiOcg5o5tdCNLfUQN1A5DMzfCdHR3TXiiHKErwtkfyvpGEgye8QeaBYNyrB/s1600/rss.png' width='48'/></a>
<!-- /Twitter -->
<a href='http://twitter.com/bloggertrics'><img alt='twitter' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbG1_cQDc4pL5CxVoLWZVXpSdQD8njGZMyJ9NN-EB-IpOA-DsJVj6N7OhWXf1YuvImbk9Ltvt5cGkI9Usv14n7Nh_Q5US62bzWof3dj4Am6n8PpETT7OaItGHDn7OZx4Us_vtuTKSbtW7H/s320/twit.png' width='48'/></a>
<!-- /Email_RSS -->
<a href='http://feedburner.google.com/fb/a/mailverify?uri=bloggertrics&amp;loc=en_US'><img alt='mail' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv0HATEMvjotkOIrwwgJlvzokbPILcezl_8k6hZRZzOyD2oDlJ9JYpdfstb7yaJoPrqzi21njN7kh21AVKuo173Y2J2emQXIvRmC2NonKVFzjCJXXBuOLFAVYtWaaTrRPiuDiIxmemexf5/s1600/1268343221_Social_Email_RSS.png' width='48'/></a>
</div>

α ) Αλλάξτε το link http://twitter.com/bloggertrics με το twitter url σας.
β ) Στο Email_RSS βρείτε το σημείο bloggertrics και αλλάξτε το με το Email feed username σας

Για να ρυθμίσετε το Blogger date calendar:

Πηγαίνετε Ρυθμίσεις -> Διαμόρφωση -> Μορφή Timestamp και επιλέξτε την μορφή:

Μορφή Timestamp	Δευτέρα, Ιούνιος 28, 2010

Αν αντιμετωπίσετε κάποιο πρόβλημα η για όποιες απορίες σας, παρακαλώ αφήστε τα σχόλιά σας.