Ο κώδικας για την επεξεργασία κάθε φωτογραφίας - Picture html code

Το θέμα με το οποίο θα ασχοληθούμε σήμερα είναι ένα θέμα το οποίο πρέπει να το ξέρει όποιος θέλει να λέγεται blogger!
Για μένα blogger δεν είναι αυτός που μόνο γράφει και αναρτεί κείμενα.Δεν είπαμε να είναι και προγραμματιστής αλλά αυτό που θα σας πω σήμερα θα πρέπει να το ξέρει.Θα τον βοηθήσει αφάνταστα.Πολλοί από σας θα το ξέρουν αλλά πρέπει να τα ξέρουν κι οι υπόλοιποι.
Πρόκειται να σας πω τι html κωδικό έχει η κάθε φωτογραφία ,και πως μπορούμε να τι ρυθμίσουμε όπως θέλουμε(πλάτος,ύψος,που θα πηγαίνει-αν πηγαίνει σε κάποιο άλλο site)

Που θα σας βοηθήσουν αυτά που θα μάθετε παρακάτω?

Παντού!!!Θα ξέρετε πως να ρυθμίσετε ένα banner ή όποια άλλη εικόνα βλέπετε και θέλετε να τη βάλετε στο blog σας ,είτε σε gadget ,είτε μέσα σε ανάρτηση.

Να σας πω επίσης ότι το 30% των ερωτήσεων που μου κάνετε (για το πως θα προσθέσουμε το banner ή πως θα ρυθμίσουμε αυτήν την εικόνα να κάνει αυτό και να είναι έτσι...) απαντιέται σε αυτήν εδώ την ανάρτηση.

Χωρίς άλλες καθυστερήσεις πάμε παρακάτω.

Να πούμε καταρχάς οτί ένα banner δεν είναι τίποτα άλλο από μια εικόνα.
Για να προχωρήσουμε παρακάτω πρέπει να μάθετε να βρίσκετε τη διεύθυνση κάθε εικόνας.Κάθε εικόνα έχει μια διεύθυνση (url).Θα σας πω δύο (2) τρόπους για να τη βρίσκετε.

1)Πατάτε δεξί κλικ πάνω στην φωτογραφία που σας ενδιαφέρει ,και μετά επιλέγετε "Ιδιότητες".Εκεί θα βρείτε τη διεύθυνση της εικόνας.

2)Πατήστε πάλι δεξί κλικ πάνω στην φώτο και πατήστε "Αποθήκευση εικόνας ως..." για να κατεβάσετε την εικόνα στον υπολογιστή σας.Αφού λοιπόν την έχετε αποθηκευμένη στο pc σας ,πρέπει τώρα να την ανεβάσετε κάπου για να βρείτε τη διεύθυνση της.
Μερικά αξιόλογα sites για να την ανεβάσετε είναι το photobucket ,το imageshack και το freefotos.

Σημειώσεις:

α.Και στους δύο τρόπους αφού βρείτε την url της φώτο που θέλετε ,ανοίξτε ένα άλλο παράθυρο στο πρόγραμμα περιήγησης (π.χ. explorer,mozilla) που χρησιμοποιείτε και ανοίξτε την εκεί για να δείτε αν έχετε βρει τη σωστή διεύθυνση.Δηλαδή να κάνετε επαλήθευση.

β.Να προτιμάτε τον δεύτερο τρόπο ,αν και είναι πιο χρονοβόρος, γιατί έτσι ξέρετε που έχετε ανεβάσει την φωτογραφία σας και αν εμπιστεύεστε την αξιοπιστία του site αυτού.Γιατί π.χ. μπορώ να έχω και εγώ ένα server και όποτε θέλω να διαγράφω τις φωτογραφίες μου.Ενώ τα πιο μεγάλα sites όπως αυτά που ανέφερα παραπάνω είναι φυσικά πιο αξιόπιστα σε σχέση με μένα.

Τώρα λοιπόν ξέρετε πως να βρίσκετε τη διεύθυνση (url) κάθε εικόνας.

Ο html κώδικας λοιπόν κάθε φωτογραφίας είναι σαν τον παρακάτω:

<img alt="johnpatrablog" src="http://i723.photobucket.com/albums/ww239/johnpatra/banners/coollogo_com_73212405.gif" height="50" width="120" />

Αυτό που έχω μαρκάρει με κίτρινο είναι η διεύθυνση (url) της φωτογραφίας.Την αλλάζετε με την url της φωτογραφίας που θέλετε να εμφανίζεται.
Με κόκκινο έχω μαρκάρει το μέγεθος της φωτογραφίας.
"height="50"" σημαίνει ότι έχει 50 pixels ΥΨΟΣ και "width="120"" 120 pixels ΠΛΑΤΟΣ.
Μπορείτε να αλλάξτε τα νούμερα για να ρυθμίσετε όπως σας αρέσει την φωτογραφία σας.

Ο παραπάνω κώδικας θα εμφανίσει την παρακάτω φωτογραφία:



Όπως θα διαπιστώσετε ,η παραπάνω φωτογραφία δεν <<οδηγεί>> κάπου ,δηλαδή δεν είναι σύνδεσμος.Επειδή όμως πολλοί θέλετε να φτιάξετε ένα banner για το blog σας και θέλετε όποιος πατάει το banner να εισέρχεται στο blog σας ,δείτε παρακάτω:

Ο παρακάτω κώδικας θα εμφανίσει και πάλι την ίδια φωτογραφία ,με τη μόνη διαφορά ότι αν την πατήσεις θα σου ανοίξει το blog μου

<a href="http://www.johnpatrablog.blogspot.com/" target="_blank">
<img alt="johnpatrablog" src="http://i723.photobucket.com/albums/ww239/johnpatra/banners/coollogo_com_73212405.gif" height="50" width="120" /></a>

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

Αυτό που έχω μαρκάρει με κίτρινο είναι η διεύθυνση (url) της φωτογραφίας.Την αλλάζετε με την url της φωτογραφίας που θέλετε να εμφανίζεται.
Με κόκκινο έχω μαρκάρει το μέγεθος της φωτογραφίας.
"height="50"" σημαίνει ότι έχει 50 pixels ΥΨΟΣ και "width="120"" 120 pixels ΠΛΑΤΟΣ.
Μπορείτε να αλλάξτε τα νούμερα για να ρυθμίσετε όπως σας αρέσει την φωτογραφία σας.

Με πράσινο είναι η διεύθυνση όπου θέλετε να οδηγεί η φωτογραφία.
Το target="_blank" κάνει τη φωτογραφία να ανοίγει σε νέο παράθυρο.
Αν πρόκειται να φτιάξετε ένα banner ,προτείνω να ανοίγει σε νέα καρτέλα.Με αυτόν τον τρόπο θα βάζουν πιο πολλοί το banner σας στο blog τους γιατί θα ξέρουν ότι δεν θα φεύγουν από το blog τους ,οι επισκέπτες τους.
Αν λοιπόν θέλετε να ανοίγει σε νέα καρτέλα αφήστε το όπως έχει.Αν θέλετε να ανοίγει στην ίδια καρτέλα διαγράψτε μόνο το target="_blank" .


Τώρα λοιπόν με τις παραπάνω πληροφορίες ξέρετε πως να βάλετε στο blog σας όποια φωτογραφία θέλετε και σε ότι μέγεθος θέλετε.

Μπορείτε με τους παραπάνω τρόπους να βάλετε την φωτογραφία που πρόκειται να φτιάξετε ,είτε μέσα σε μια ανάρτηση σας (εκεί που γράφετε μια ανάρτηση επικολλήτε τον κώδικα που φτιάξατε,ενώ βρισκόσαστε στην καρτέλα "Eπεξεργασία html" και ΟΧΙ στη "Σύνθεση") ,είτε σαν gadget στο blog σας (από Πανόπτη>Διάταξη>Προσθήκη gadget>HTML/JavaScript) .

Με τις παραπάνω χρήσιμες και απλές πληροφορίες ,λοιπόν, μπορείτε να κάνετε πολλά και όμορφα πράγματα!



Αν θέλετε βάλτε ένα bannerάκι στο blog σας για μένα με τον παρακάτω κώδικα:

<a href="http://johnpatrablog.blogspot.com/" target="_blank">
<img alt="link για pchands" src="http://i723.photobucket.com/albums/ww239/johnpatra/banners/coollogo_com_73212405.gif" border="0" height="30" width="150" /></a>

Θα εμφανίζεται αυτό το banner:




Αν δεν σας αρέσει αυτό το banner μπορείτε να διαλέξετε μέσα από την μεγάλη ποικιλία που θα βρείτε στο http://johnpatrablog.blogspot.com/2009/07/banners.html


Και κάτι ακόμα:

Αν σου άρεσαν οι παραπάνω πληροφορίες μπορείς να γραφτείς δωρεάν στην εφημερίδα της σελίδας από το http://feedburner.google.com/fb/a/mailverify?uri=Johnpatrablog&loc=en_US και θα σου έρχονται στο mail σου αυτόματα όλα τα tips & tricks για να μην χάνεις κανένα και να είναι το blog σου μοναδικό!
Μην το σκέφτεσαι άλλο!Κάνε δωρεάν εγγραφή τώρα και όποτε θέλεις μπορείς να ξεγραφτείς.

Άφησε μου ένα σχόλιο και πες μου τις εντυπώσεις σου.