10 Οκτωβρίου 2013

Πώς Προσθέτω Social Media Εικονίδια Στο Blog Μου

   Σε πολλά blogs, που παρακολουθώ, έβλεπα αυτά τα τέλεια social media εικονίδια και τα ήθελα και στο δικό μου blog, αλλά ούτε πολλή εμπειρία και γνώσεις είχα, ούτε κανένα εύκολο tutorial είχα βρει (μάλλον δεν είχα ψάξει αρκετά!). 
photo by geralt, on pixabay
   Χθες βρήκα αυτό το τέλειο blog της Carrie, Carrie loves, που προσφέρει δωρεάν social media icons σε πολύ όμορφες παστέλ αποχρώσεις. Η διαδικασία είναι σχετικά εύκολη και για κάποιον που δεν ξέρει (σαν και μένα ☺!). Βέβαια, είχα μια μικρή "αναποδιά", που λίγο με σπαζοκεφάλιασε, αλλά βρήκα την <<άκρη>> και το έφερα στα μέτρα μου.


  

Πώς γίνεται...





1ο βήμα

Κατεβάζουμε και αποθηκεύουμε στον υπολογιστή μας τα εικονίδια που μας αρέσουν από το site που μας τα παρέχει δωρεάν (βλ. Carrie Loves, Icon Archive κ.τ.λ.) Αν τα αρχεία είναι αποθηκευμένα με μορφή .zip, τα εξάγουμε σ' ένα νέο φάκελο.

2ο βήμα:
Πηγαίνουμε σ' ένα site αποθήκευσης φωτογραφιών, όπως το photobuquet, που να επιτρέπει την αποθήκευση εικόνων σε μορφή .png, γινόμαστε μέλη (sign up), αν δεν είμαστε ήδη, και ανεβάζουμε τις φωτογραφίες των εικονιδίων (upload).

3ο βήμα:

Ανοίγουμε ένα νέο αρχείο .txt στο σημειωματάριο, για να ετοιμάσουμε τον κωδικό μας. Αντιγράφουμε και επικολλούμε τον παρακάτω html: 

<a href="https://pinterest.com/.../" target="_blank"><img src="http://.....photobucket.com/albums/....png" /></a>

4ο βήμα:

Πηγαίνουμε στη σελίδα του social media προφίλ μας, το εικονίδιο της οποίας θέλουμε να δημιουργήσουμε, και αντιγράφουμε την url διεύθυνση, πχ. http://www.pinterest.com/.../ 
Επιστρέφουμε στο σημειωματάριο και την επικολλούμε στη θέση των μπλε γραμμάτων.

5ο βήμα:

Από τη βιβλιοθήκη (library) του λογαριασμού μας στο photobucket, βρίσκουμε το αντίστοιχο social media εικονίδιο, π.χ. για το pinterest το p, για το facebook το f κ.τ.λ. 
Αντιγράφουμε τον html code, που βρίσκομαι στο παράθυρο διαλόγου, που ανοίγει, όταν κάνουμε κλικ στο εικονίδιο για τους συνδέσμους.
Πηγαίνουμε στο αρχείο .txt και επικολλούμε το html κωδικό του εικονιδίου στη θέση των κόκκινων γραμμάτων.

6ο βήμα:

Πατάμε enter, για να πάμε στην επόμενη σειρά, και επαναλαμβάνουμε τα ίδια βήματα (από το 3ο ως το 5ο), για κάθε νέο εικονίδιο που θέλουμε να προσθέσουμε.
Όταν ετοιμάσουμε τον κωδικό για όλα τα social media icons που μας ενδιαφέρουν, αντιγράφουμε ολόκληρο το κείμενο.

7ο βήμα:

Στο ιστολόγιό μας, πηγαίνουμε στον Πίνακα ελέγχου και από το μενού αριστερά, στη Διάταξη.
Επιλέγουμε Προσθήκη gadget και στη συνέχεια, HTML/JavaScript.
Επικολλούμε το κείμενο που έχουμε αντιγράψει στο παράθυρο και αποθηκεύουμε. 
Βλέπουμε στην προεπισκόπηση αν είναι εντάξει η εμφάνιση των εικονιδίων, και αποθηκεύουμε τη διάταξη, αν είμαστε ικανοποιημένοι .

8ο βήμα:

Προβολή του ιστολογίου μας και κλικ πάνω στα εικονίδια, για να βεβαιωθούμε ότι συνδέονται κανονικά με τη σελίδα των social media προφίλ μας. Και είναι έτοιμα ! 


Πρώτη δημοσίευση στο blog Βρίσκω τον τρόπο



Καλή συνέχεια ☺ !!!






2 σχόλια:

  1. Καλημέρα ένας άλλος τρόπος είναι ο εξής δεξί κλικ στην εικόνα που θέλουμε (αντιγραφή διεύθυνσησ url εικόνας ) και κάνεις επικόλληση σε ένα αρχείο txt.παράδειγμα: http://icons.iconarchive.com/icons/danleech/simple/128/google-plus-icon.png

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Πολύ χρήσιμο ! Σ' ευχαριστώ πολύ που το μοιράστηκες ! Καλημέρα !

      Διαγραφή