• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

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

TITLE BACKGROUND
ΠΩΣ ΒΑΖΩ 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-4 px μεγαλύτερη από το μέγεθος γραματοσειράς τίτλου ανάρτησης που έχετε ορίσει από την προσαρμογή του προτύπου του 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;

4 σχόλια:

  1. γεια σου φιλε μου κ συγχαρητηρια για τις ωραιες πληροφοριες που δινεις...μια μικρη βοηθεια χρειαζομαι,μπορεις να μου πεις πως κεντραρουμε τον τιτλο αναρτησης ωστε να μην φαινεται στα αριστερα,,,,ευχαριστω!

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Πήγαινε μέσα στο πρότυπο και βρές αυτή τη γραμμή κώδικα h3.post-title, h4 { και πρόσθεσε μέσα της αυτό που σου έχω επισημάνει μεσα στο μώβ κουτάκι σε αυτό εδώ το screenshout. http://prnt.sc/agyxja

      Διαγραφή
    2. σε ευχαριστω πολυ για την βοηθεια!καλο βραδυ!

      Διαγραφή
  2. Ανώνυμος20/2/17 21:19

    Σε ευχαριστώ για όλα. Είσαι σπουδαίος

    ΑπάντησηΔιαγραφή

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

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