Πως να προσθέσετε αριθμούς στα σχόλια σας

Καλησπέρα, σε αυτή την ανάρτηση θα ασχοληθούμε ξανά με τα σχόλια σας. Πιο αναλυτικά στο προηγούμενο Tip για τα σχόλια σας είχαμε δείξει για το πως μπορείτε να κάνατε πιο όμορφα, σε αυτό το Tip θα σας δείξουμε πως μπορείτε να αριθμήσετε τα σχόλια σας. Με αυτόν τον τρόπο θα ξέρετε ακριβώς σε ποιο σχόλιο είσαστε ή ακόμα και σε ποιο υποσχόλιο (απάντηση ενός σχόλιου). Ελπίζουμε όπως πάντα να σας αρέσει, επίσης είναι εύκολο και δεν θα σας πάρει καθόλου χρόνο για την τοποθέτηση του (Το Video Tutorial βρίσκεται πάντα στο τέλος της ανάρτησης).

1) Πρώτα, συνδεθείτε στο λογαριασμό σας Blogger.

2) Κάντε κλικ στο Σχεδίαση. και επιλέξτε Επεξεργασία HTML.

Προσοχή:

  Πριν ξεκινήσουμε:

- Πρέπει να είστε προσεκτικοί κατά την αλλαγή του προτύπου σας.

- Πριν κάνετε οποιαδήποτε αλλαγή, αποθηκεύστε το πρότυπο σας σε ασφαλή μέρος (Στον υπολογιστή σας).

3) Ψάξτε για τον παρακάτω κώδικα (Ctl+F):

]]></b:skin>

4) Αντιγράψτε και επικολλήστε τον παρακάτω κώδικα ακριβώς πάνω από το ]]></b:skin>.

.comment-thread ol {

    counter-reset: countcomments;
}

.comment-thread li:before {

    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizGfsDKa4h_UmZVVXxpDKizC6N9MF-MeGiz3Ox3oKmaPrz_WW_uykLBlBdb3Njpk4pRhqBehBve8LGMYS8esMv6928DlLGB-oW7FJHfkFmfMRBynPTn1ONW5jEZtqjOjW1kXWbqNAXr8nb/s1600/comment+bubble2.png") no-repeat scroll 0 0 transparent;
    color: #000;
    content: counter(countcomments, decimal);
    counter-increment: countcomments;
    float: right;
    font-size: 30px;
    height: 50px;
    margin-left: 10px;
    margin-top: 0px;
    padding-left: 16px;
    padding-top: 0px;
    width: 50px;
}

.comment-thread ol ol {

    counter-reset: contrebasse;

}

.comment-thread li li:before {

    color: #000;
    content: counter(countcomments, decimal) "." counter(contrebasse, lower-alpha);
    counter-increment: contrebasse;
    float: right;
    font-size: 23px;
    margin-top: 0px;
    padding-left: 8px;
    padding-top: 4px;

} 

-Αποθηκεύσετε το πρότυπο.

Σημιώσεις:

Μπορείτε να αλλάξετε τα κόκκινα γράμματα, τα μπλε γράμματα και τα πράσινα γράμματα.
 
Τα κόκκινα γράμματα ειναι το λινκ των εικονιδιων, οπου υαπρχουν πισω απο τους αριθμους.
Τα μπλε γράμματα είναι το μέγεθος και "διεύθυνση" των αριθμών, δηλαδή πρέπει να δώσετε μεγάλη προσοχή όταν τα επεξεργάζεστε, αλλά και χρειάζεται να τα επεξεργαστείτε για να ρυθμίσετε το που ακριβώς θέλετε τους αριθμούς.
Τα πράσινα γράμματα είναι οι κώδικες από τα χρώματα των αριθμών.
Κώδικες χρωμάτων μπορείτε να βρείτε σε αυτήν την σελίδα: www.color-hex.com

Και αυτό ήταν, τώρα μπορείτε τώρα να χαρείτε τα καινούργια αριθμημένα σχόλια σας.

- Για το Demo ειναι το παρακατω βιντεο:

- Για ότι πρόβλημα υπάρξει μην διστάσετε να επικοινωνήστε μαζί μας μεσώ του
κουμπιού "Επικοινωνία" που θα βρείτε πάνω πάνω.
  
-Άμα σας αρέσουν οι αναρτήσεις μας παρακαλώ προωθήστε την ιστοσελίδα μας ή πατήστε το κουμπί παρακολούθηση στα δεξιά.
Ευχαριστούμε.

Copyrights: BlogyTricks© 

Πηγη κωδικα: helplogger

Διαβαστε Περισσοτερα

Cool Blue Drop-Down Μενού

Γεια σας και πάλι, η σημερινή ανάρτηση είναι αφιερωμένη στον φίλο μας τον DimP, όπου επειδή δεν δούλεψε το προηγούμενο Drop-Menu όπου είχαμε ανεβάσει και επειδή του υποσχέθηκα ότι θα του ανεβάσω μετά τον διαγωνισμό ένα άλλο, έτσι λοιπόν δικό σου φιλέ μου. Πιο αναλυτικά το παρακάτω Gadgetaki είναι ένα πολλή όμορφο Drop-Menu στο οποίο για να βεβαιωθώ ότι όντως θα δουλέψει όπως κάνω και σε πολλά αλλά Gadgets το δοκίμασα στο Demosite μου (όπου είναι φτιαγμένο από ένα απλό πρότυπο) και όπως διαπίστωσα δουλεύει μια χαρά. Το μόνο που έμεινε είναι να το δοκιμάσετε και εσείς τώρα και να μου πείτε την γνώμη σας. (Το Demo όπως πάντα είναι στο τέλος της ανάρτησης).

1) Πρώτα, συνδεθείτε στο λογαριασμό σας Blogger.

2) Κάντε κλικ στο Σχεδίαση. και επιλέξτε Επεξεργασία HTML.

Προσοχή:

  Πριν ξεκινήσουμε:

- Πρέπει να είστε προσεκτικοί κατά την αλλαγή του προτύπου σας.

- Πριν κάνετε οποιαδήποτε αλλαγή, αποθηκεύστε το πρότυπο σας σε ασφαλή μέρος (Στον υπολογιστή σας).

3) Ψάξτε για τον παρακάτω κώδικα (Ctl+F):

]]></b:skin>

4) Αντιγράψτε και επικολλήστε τον παρακάτω κώδικα ακριβώς πάνω από το ]]></b:skin>.

.menu{
border:none;
border:0px;
margin:0px;
padding:0px;
font-family:verdana,geneva,arial,helvetica,sans-serif;
font-size:14px;
font-weight:bold;
color:8e8e8e;
}
.menu ul{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsE1CgmLjlFIQ6mFaFF9KRnmB74Ssk6QsyH4DnxMV5BHGSMAZl8auYwiv5QEkAqRbz1j4GakCLm0aWDooUgLIBYNxmwKgX1vOgYOrct66jLF7SwE0Lhc9ksLI0kDtztuOjJ6V-5J0TGtyl/s1600/menu-bg.gif) top left repeat-x;
height:43px;
list-style:none;
margin:0;
padding:0;
}
.menu li{
float:left;
}
.menu li a{
color:#666666;
display:block;
font-weight:bold;
line-height:43px;
padding:0px 25px;
text-align:center;
text-decoration:none;
}
.menu li a:hover{
color:#000000;
text-decoration:none;
}
.menu li ul{
background:#e0e0e0;
border-left:2px solid #0079b2;
border-right:2px solid #0079b2;
border-bottom:2px solid #0079b2;
display:none;
height:auto;
filter:alpha(opacity=95);
opacity:0.95;
position:absolute;
width:225px;
z-index:200;
/*top:1em;
/*left:0;*/
}
.menu li:hover ul{
display:block;
}
.menu li li {
display:block;
float:none;
width:225px;
}
.menu li ul a{
display:block;
font-size:12px;
font-style:normal;
padding:0px 10px 0px 15px;
text-align:left;
}
.menu li ul a:hover{
background:#949494;
color:#000000;
opacity:1.0;
filter:alpha(opacity=100);
}
.menu p{
clear:left;
}
.menu #current{
color:#999999;
}

-Αποθηκεύσετε το πρότυπο.


5) Κάντε παλι κλικ στο Σχεδίαση. και επιλέξτε Διάταξη (στα αριστερά της οθόνης σας).
-Πατήστε Προσθηκη Gadget και έπειτα HTML/JavaScript .

6) Αντιγράψτε και επικολλήστε τον παρακάτω κώδικα μέσα στο πλαίσιο HTML/JavaScript.  

<div class="menu">
<ul>
<li><a href="#" >Home</a></li>
<li><a href="#" id="current">Products</a>
<ul>
<li><a href="#">Drop Down CSS Menus</a></li>
<li><a href="#">Horizontal CSS Menus</a></li>
<li><a href="#">Vertical CSS Menus</a></li>
<li><a href="#">Dreamweaver Menus</a></li>
</ul></li>
<li><a href="/faq.php">FAQ</a>
<ul>
<li><a href="#">Drop Down CSS Menus</a></li>
<li><a href="#">Horizontal CSS Menus</a></li>
<li><a href="#">Vertical CSS Menus</a></li>
<li><a href="#">Dreamweaver Menus</a></li>
</ul></li>
<li><a href="/contact/contact.php">Contact</a></li>
</ul></div>

Σημιώσεις:

Μπορείτε να αλλάξετε τα κόκκινα γράμματα, τα μπλε γράμματα.
 
Τα κόκκινα γράμματα είναι οι τίτλοι από τις σελίδες που θέλετε να βάλετε.
Τα μπλε γράμματα είναι το λινκ/url των αναλόγων τίτλων. 

- Για το Demo είναι το παρακάτω βίντεο:




- Για ότι πρόβλημα υπάρξει μην διστάσετε να επικοινωνήστε μαζί μας μεσώ του
κουμπιού "Επικοινωνία" που θα βρείτε πάνω πάνω.
 
-Άμα σας αρέσουν οι αναρτήσεις μας παρακαλώ προωθήστε την ιστοσελίδα μας ή πατήστε το κουμπί παρακολούθηση στα δεξιά.
Ευχαριστούμε.

Copyrights: BlogyTricks©   

Πηγη κωδικα: Blogspot Tutorial

Διαβαστε Περισσοτερα

2ος Μεγάλος διαγωνισμός του BlogyTricks

 Το BlogyTricks γιορτάζει τον 1χρόνο λειτουργιάς του και μοιράζει τα καλύτερα δώρα.

Ο διαγωνισμός θα διαρκέσει από σήμερα (17/06) έως τα μεσάνυχτα της Κυριακής (24/06), όπου και εκείνη την ήμερα θα κλείσουμε τον πρώτο μας χρόνο.

Ο διαγωνισμός μας θα γίνει μέσω επιλογής ιδέας, αλλά και κλήρωσης. Πιο αναλυτικά ο 1ος νικητής θα αναδειχθεί μέσω επιλογής ιδέας για το ιδανικό Blog, οπου θα υποβάλει μέσω την συμπλήρωση της φόρμας, ενω ο 2ος θα αναδειχθεί μέσω κλήρωσης. Οι νικητές θα πάρουν τα έξης δώρα:

Ο 1ος θα κερδίσει δωρεάν ένα Φουλ Πακέτο Web Service οπού περιέχει:

Μια Κατασκευή ενός ολοκαίνουργιου Blog (όπου θα φτιαχτεί απο την ιδέα που θα μας στείλει), μια Αφαίρεση του .Blogspot.com του + ένα Domain Name: .eu για ένα χρόνο + 100mb Hosting + ένα email της αρεσκείας του.

Ο 2ος θα κερδίσει δωρεάν ένα Πακέτο Web Service οπού περιέχει:
Μια Αφαίρεση του .Blogspot.com του + ένα Domain Name: .org για ένα χρόνο + 100mb Hosting + ένα email της αρεσκείας του.

Οι νικητές θα αναδειχτούν σε αυτή την ανάρτηση στο τέλος του διαγωνισμού και θα λάβουν ένα email στην διεύθυνση που θα μας στείλουν. Στην περίπτωση που δεν μας στείλει μήνυμα ένας απο τους νικητές για την αποδοχή του δώρου μέσα στο διάστημα των 3 ημερών θα επιλεχθεί άλλος νικητής.

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

<Ο Διαγωνισμός ολοκληρώθηκε!> 

1ος νικητής όπου κερδίζει ένα Φουλ πακέτο Web service είναι ο:

 ΕΥΑΓΓΕΛΟΣ ΑΝΔΡΕΟΓΛΟΥ (m**ie**y@ma**bo*.**)

2ος νικητής όπου κερδίζει ένα πακέτο Web service είναι ο:

 Απόστολος Κασάπης (ap***olk***pi*@y**o*.***)


 Αναπληρωτές νικητών (σε περίπτωση μη αποδοχής του δώρου):

Αναπληρωτής του 1ου είναι ο: Albano Seitaj (al***ose***j@**ai*.***)

  Αναπληρωτής του 2ου είναι ο: ΔΗΜΗΤΡΗΣ  ΠΕΧΛΙΒΑΝΙΔΗΣ (p***es**@g***l.***)

Συγχαρητήρια στους νικητές!

 Σας ευχαριστούμε όλους για την συμμετοχή σας στον διαγωνισμό μας!

Χορηγοί Επικοινωνίας Διαγωνισμού:

Διαβαστε Περισσοτερα

Προσθήκη Slideshow στο BlogyTricks

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

Ευχαριστούμε, BlogyTricks©

Διαβαστε Περισσοτερα