Roll On: How to Put an Image in Text Gadget (Blogger)

Nov 22, 2016

I've applied jobs in two pharmacies here (since the pharmacies have some more branches around here as well, it is as if I apply for 5 different pharmacies). Just need to tell that.

Ok. I've been head over heels trying to put an image into the text gadget in the sidebar. As you can see in the text gadget in my sidebar, I've put some facts about me. I like it to be just words but recently I have wanted badly to put an image together with it hence the new one's with Dean Winchester image.

I'm not coding jedi or anything. I mainly get the pre-made coding, copy and paste.



But since I want to include the image together with the text, I've got to get the coding to preview an image from the image link which through dust and (dramatic sangat) I finally found it HERE. They have all kinds of coding.

To make it easier for you to understand and since I am a horrible explainer, read this sequence first so that the next part made sense.

  1. Blogger dashboard - Layout - Add a gadget - Text
  2. Paste the coding
  3. Change the caption, width, height and the image link
  4. Publish
  5. Voila

Same rules: Blogger dashboard - Layout - Add a gadget - Text

The codes is as follow, so just copy and paste it! (say if it didn't work, you can just copy from the link I give before).

<html>

<body>



<h2>Spectacular Mountain</h2>

<img src="pic_mountain.jpg" alt="Mountain View" style="width:304px;height:228px;">



</body>

</html>



From the code you can see that you can adjust the width and height of the picture. You have to try it a few times so that the picture would not appear smash or anything. At the pic_mountain.jpg you can change it to the link of the image you want. While the word Spectacular Mountain , you can change it if you want to put some caption or just delete it so it would appear blank like mine.


I made an example.
The one circled red is the caption that I wanted while
the highlighted words is where i'm going to put the link of the image


This is how it looked in the gadget after I put the codes and the link..
You won't see the codes anymore unless if you switch to Edit html mode.


REMEMBER to get the image link which ended with the usual picture format code like .jpg, .png .gif etc.
RESULT! okay, the word "TEST" is the gadget title while the word "BABE" is the caption I put.
The capital letter is automatic as according to my template coding.

Just to remind you again, I want the text and the image to be together in the same widget so that is why I do it like this instead of simply "Add an Image".

So, recap! I should do this in sequence but i'm too lazy to redo it. SORRY.


  1. Blogger dashboard - Layout - Add a gadget - Text
  2. Paste the coding
  3. Change the caption, width, height the image link
  4. Publish
  5. Voila

I need a work. 

Post a Comment