Being able to identify the code for a picture
-
Let’s say that I have six pictures and text to be formatted on a blog page. If I want to format in the HTML mode, then
out of all of that gobbledygook HOW do I identify the code for each picture? What is at the beginning and what is at the end? I am guessing that the letter IMG are going to be there somehow. I need to be able to separate the code for the pictures from everything else.
Lornakismet
The blog I need help with is: (visible only to logged in users)
-
If you have inserted the image into a post or page, the code is typically going to look similar to this:
<img class="alignnone size-full wp-image-943" title="ed-format" src="URL of image" alt="ed-format" width="247" height="135" />The basic code without any attributes would look something like this:
<img src="URL of image" alt="" /> -
Dear Sacred Path, I am not able to understand your reply because:
(1) I do not know how you are defining ”attributes“ when you say ”The basic code without any attributes would look something like this:“
(2) Given your two examples of HTML code above, I could not find the second code
( <img src=”URL of image” alt=”” /> ) inside the first, longer code.What I was figuring was that the second shorter code was the code of the picture, and that logically, if that code were embedded inside the first longer code, I would be able to find it, but no, that was not so. I could not find the smaller, shorter code within the longer code.
And thus I cannot understand your explanation.
I must be honest and say that this question arises from me having great difficulty dealing with an article that I put in my Blogger personal blog ( http://lornakismet.blogspot.com ) In that post I was putting pictures and captions into a post with text.
The thing is, whether or not it is for the Blogger post, it is still something that I need to learn. I am trying to slowly learn HTML because it is becoming clear that without a rudimentary knowledge of it, my work is always going to look irregular or messy.
lornakismet
-
Sacred Path, so what I am saying is that I would like to be able to identify the code that belongs to a picture when that picture code is mixed in with a bunch of other pictures and a lot of text.
If I could identify codes for pictures, that would get me started to being able to figure things out.
lornakismet
-
This HTML code below represents a post that had six pictures and six captions for those pictures. Which are the codes for the pictures???
If you are able to do this for me, could you delete the code around the picture codes so that I am left with only the codes for the pictures?
But the first request is still the more important one: How can I tell which group of letters is the code for a picture when it is mixed up in all the rest of the article?
lornakismet
<div style=”text-align: left;”><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 200px; height: 156px;” src=”http://1.bp.blogspot.com/_2uVVwkHzags/SomJceuI32I/AAAAAAAADhQ/ORSsYzNUq4k/s200/slide_2328_29716_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370975152991952738″ border=”0″ /></div><div style=”text-align: left;”><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 200px; height: 160px;” src=”http://1.bp.blogspot.com/_2uVVwkHzags/SomJb3zC2nI/AAAAAAAADhI/uTmwkh0nxZE/s200/slide_2328_29715_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370975142543546994″ border=”0″ /><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 200px; height: 160px;” src=”http://1.bp.blogspot.com/_2uVVwkHzags/SomJPLcdsfI/AAAAAAAADgw/WyvGn60Z1z8/s200/slide_2328_29710_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370974924479246834″ border=”0″ />
<span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span>
<div style=”text-align: left;”><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” > </span><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” >[Eva Amurri and Susan Sarandon] </span><span style=”font-style: italic; color: rgb(102, 0, 0);”><span style=”font-size:78%;”> </span> </span><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” >[Kelly and Sharon Osbourne]</span><span style=”font-style: italic; color: rgb(102, 0, 0);”> </span><span style=”font-style: italic; color: rgb(102, 0, 0);”><span style=”font-size:78%;”>[Kate Hudson </span></span><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” >and Goldie Hawn]</span>
</div><div style=”text-align: center;”>
</div><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 200px; height: 166px;” src=”http://1.bp.blogspot.com/_2uVVwkHzags/SomJbmpP92I/AAAAAAAADhA/Eo7h9K4hBos/s200/slide_2328_29714_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370975137939060578″ border=”0″ /><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 200px; height: 146px;” src=”http://1.bp.blogspot.com/_2uVVwkHzags/SomJOjYH_cI/AAAAAAAADgo/JsxBi8oGxvQ/s200/slide_2328_29709_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370974913723628994″ border=”0″ /><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 200px; height: 146px;” src=”http://4.bp.blogspot.com/_2uVVwkHzags/SomJOXqPasI/AAAAAAAADgg/EBWF8524glE/s200/slide_2328_29708_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370974910578387650″ border=”0″ /><span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span>
<span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span><div style=”text-align: center;”>
<span style=”font-style: italic; color: rgb(102, 0, 0);”><span style=”font-size:78%;”> </span> </span><span style=”font-style: italic; color: rgb(102, 0, 0);”><span style=”font-size:78%;”> </span></span><div style=”text-align: left;”><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” > [Paris and Kathy Hilton]</span><span style=”font-size:78%;”> </span><span style=”font-style: italic; color: rgb(102, 0, 0);”> </span><span style=”font-style: italic; color: rgb(102, 0, 0);”><span style=”font-size:78%;”> [Demi Moore and Rumer Willis] </span></span><span style=”font-size:78%;”> </span><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” >[Beyonce and Tina Knowles]</span>
</div><span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” ></span></div>
This kind of article would never have existed in in the not so distant past, with mothers looking young enough to be their grown-up daughters’ older sisters.<span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 200px; height: 146px;” src=”http://2.bp.blogspot.com/_2uVVwkHzags/SomJN-zTFqI/AAAAAAAADgY/gnAFM0VOpfw/s200/slide_2328_29706_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370974903905490594″ border=”0″ />It takes a lot of discretionary time
and income, not to mention technological and surgical advancements, to be almost thought of as a sister by the casual passers-by. <span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” ></span><div style=”text-align: right;”>
</div>Me? I never had kids, so I cannot be an example, but I
think that if I did have a daughter,<span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” >[Leslie and Hayden Panettiere]</span>
I would want to look my best for her sake
as well as mine and my husband’s. Hope you’ve enjoyed
seeing these Hollywood moms and their daughters. <span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” ><span style=”font-style: italic; color: rgb(102, 0, 0);”> [</span><span style=”color: rgb(102, 0, 0);”>Melanie Griffith and Dakota Johnson]</span></span><div style=”text-align: left;”><img style=”margin: 0pt 0pt 10px 10px; float: right; cursor: pointer; width: 226px; height: 165px;” src=”http://3.bp.blogspot.com/_2uVVwkHzags/SomJPoA1xtI/AAAAAAAADg4/sMJfjIMvlgs/s200/slide_2328_29711_large.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5370974932148012754″ border=”0″ /></div>
P.S.
Here is a picture of my mom and me
one Christmas many decades ago. She
and I never looked alike because I inherited
my father’s facial features.<div style=”text-align: left;”><img style=”cursor: pointer; width: 200px; height: 156px;” src=”http://2.bp.blogspot.com/_2uVVwkHzags/SorqjF0tK-I/AAAAAAAADhg/x0ta99OlJ3A/s200/myMother_2.jpg” alt=”” id=”BLOGGER_PHOTO_ID_5371363394172300258″ border=”0″ /><span style=”font-style: italic;font-size:78%;” ><span style=”color: rgb(102, 0, 0);”>[</span></span><span style=”font-style: italic;font-size:78%;” ><span style=”color: rgb(102, 0, 0);”> </span></span>
</div>
<div style=”text-align: right;”><span style=”font-style: italic;font-size:78%;” > <span style=”color: rgb(102, 0, 0);”>
</span></span><span style=”font-size:78%;”>
</span>
<span style=”font-size:78%;”>
</span></div> <span style=”font-size:78%;”>
</span><div style=”text-align: right;”><span style=”font-style: italic;font-size:78%;” > </span><span style=”font-size:78%;”>
</span></div><div style=”text-align: right;”><span style=”font-style: italic;font-size:78%;” > </span></div>
<span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span><div style=”text-align: right;”>
</div><div style=”text-align: right;”>
</div></div><div style=”text-align: right;”><span style=”font-style: italic;font-size:78%;” > </span><span style=”font-size:78%;”>
</span></div><div style=”text-align: left;”>
</div>
<span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span><span style=”font-size:78%;”>
</span><div style=”text-align: left;”><span style=”font-style: italic; color: rgb(102, 0, 0);”> </span>
<span style=”font-size:78%;”>
</span>
<span style=”font-style: italic; color: rgb(102, 0, 0);”>
</span></div><div style=”text-align: left;”><span style=”font-size:78%;”>
</span></div><span style=”font-size:78%;”>
</span><div style=”text-align: left;”><span style=”font-style: italic; color: rgb(102, 0, 0);font-size:78%;” > </span>
</div> -
Ok, I have been breaking my eyeballs looking at what you wrote and now I think I understand what you were trying to say. Is this correct:
This: <img src=”URL of image” alt=”” /> is the bare skeleton of the code for a picture.
If I give attributes to this bare skeleton, then I would have this:
<b>img</b> class=”alignnone size-full wp-image-943″ title=”ed-format” <b>src=”URL of image”alt=”</b>ed-format” width=”247″ height=”135″<b> /><.b>So am I correct in guessing that the code for images will begin:
<img and will end: />Correct or not correct?
Lornakismet
-
I should have added that, as I am understanding it, the HTML code for a picture will be something like this:
<img blanketyblanketyslanketyflankety />
Yes? No?
lornakismet
-
I made a mistake in the URL I gave up there. It’s supposed to be
lornacheyene.blogspot.com, not lornakismet;blogspot.comBut it doesn’t matter anyway, since it is a Blogger page that I was using to ask my question about html.
Someone told me: ”Right where the image HTML code ends, which is the caret, that is where you should start typing your caption.“
I know that WordPress doesn’t make you format captions, but Blogger does.
Thank you for your help tonight.
lornakismet
-
Re your 8:26 AM post:
If the image isn’t a link (i.e. nothing happens when you click on it), then yes its html code will be
<img blanketyblanketyslanketyflankety />
If the image is a link (to a larger original or to any other webpage), then its code will be
-
Oops – linking image code:
<a href=blanketyblanketyslanketyflankety><img blanketyblanketyslanketyflankety /></a> -
Dear Panaghiotisadam ———
Thank you for the feedback. I can tell you right now that I could never be a code writer because all of the letters slide together like mush for me.~Lorna
____________________________________
- The topic ‘Being able to identify the code for a picture’ is closed to new replies.
WordPress.com Forums 
