ΠΩΣ ΒΑΖΩ BACKGROUND ΣΤΟΝ ΤΙΤΛΟ ΑΝΑΡΤΗΣΗΣ

ΠΩΣ ΒΑΖΩ BACKGROUND ΣΤΟΝ ΤΙΤΛΟ ΑΝΑΡΤΗΣΗΣ
TITLE BACKGROUND
Με τις παρακάτω σύντομες γραμμές κώδικα μπορούμε να βάλουμε ένα διαφορετικό background στον τίτλο της ανάρτησης από το χρώμα φόντου της ανάρτησης που έχουμε ορίσει από την προσαρμογή του προτύπου του blogger. Μπορεί το background αυτό να είναι απλά ένα διαφορετικό χρώμα αλλά μπορεί να είναι και μία απλή εικόνα jpg, png ή ακόμα και μία κινούμενη εικόνα gif όπως έχω βάλει εγώ σε αυτό το blog που διαβάζετε.
Για να βάλουμε ένα διαφορετικό background πρέπει να πάμε στην επεξεργασία του προτύπου μας και να ανοίξουμε το πρώτο βελάκι που θα συναντήσουμε το οποίο βρίσκεται περίπου ανάμεσα στις γραμμές 13-43 του κώδικα του blog μας για να επεκταθεί ο κρυμένος κώδικας ο οποίος είναι με μπλέ γράμματα. 

Μετά θα αναζητήσουμε με τα πλήκτρα Ctrl+F την γραμμή : h3.post-title,h4 { και μόλις την εντοπίσουμε επικολλούμε ακριβώς από κάτω της την εξής γραμμή κώδικα : background:#333333;
Μετά κοιτάξτε 3-4 γραμμές παρακάτω και θα δείτε την εξής γραμμή κώδικα : h3.post-title a {   
επικολλήστε ακριβώς από κάτω της την ίδια γραμμή κώδικα δηλαδή : background:#333333;
Μετά κοιτάξτε 3-4 γραμμές παρακάτω και θα δείτε την εξής γραμμή κώδικα : h3.post-title a:hover {επικολλήστε ακριβώς από κάτω της την ίδια γραμμή κώδικα δηλαδή : background:#333333; Αυτό ισχύει για να βάλετε για background απλό χρώμα.

Για να βάλετε μία εικόνα θα πρέπει πρώτα να βρείτε μία εικόνα που να έχει ύψος 3-4px μεγαλύτερη από το μέγεθος γραματοσειράς τίτλου ανάρτησης που έχετε ορίσει από την προσαρμογή του προτύπου του blogger. Την εικόνα αυτή την ανεβάζετε σε ένα λεύκωμα του Google+ και από εκεί παίρνετε το link της και το επικολλάτε μέσα στις παρενθέσεις του παρακάτω κώδικα αντικαθιστώντας την δική μου εικόνα με τα μώβ γράμματα που μπορεί να μην σας κάνει. Τον παρακάτω κώδικα τον επικολλάτε ακριβώς από κάτω από τις 3 διαφορετικές γραμμές κώδικα που γράφω παραπάνω και έχω επισημάνει με πορτοκαλί χρώμα. Αντί δηλαδή να βάλετε τον κώδικα με το απλό χρώμα που έχω επισημάνει παραπάνω με πράσιναγράμματα βάζετε τον παρακάτω Χ 3 φορές.

background: url(https://lh5.googleusercontent.com/-D86fR5KR5-0/VNSitICZsrI/AAAAAAAAO1c/DueTyvQ5E0M/w960-h25-no/Wood-color1.jpg); background-repeat:repeat;

Δεν υπάρχουν σχόλια:

Δημοσίευση σχολίου

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.