Wednesday, 22 January 2014


I'm always seeing on twitter bloggers asking for help with html, or asking for people to recommend blog designers etc. Due to this, I thought I'd start a new little series on my blog where I give my own helpful tips on using html. All of this I have learnt from google by the way - but I just though it would be easier to have everything in one place for you guys.

Today I'm going to be helping you to add a picture using html.

First of all, you need a picture. I'm going to use this one:

Step 1:

upload the picture to a site such as photobucket (you may need to create an account first). Once the picture is uploaded, click on it and it will take you onto a new page. Find where it says Direct, and copy the code.

Step two:

in blogger, click on layout > add gadget > HTML/JavaScript

Paste in the following code into the pop up:

<img src="DIRECT_LINK_TO_PICTURE" width="200" height="100"/>

change the information in RED:
DIRECT_LINK_TO_PICTURE is the 'direct' code from step one.
The width and height can also be changed here to match your blog layout.

Click SAVE and you're done!

You can also use this method to add pictures within a blog post. Just click on the HTML button at the top of the creating a post page.

I hope that this has helped some of you guys! If there's anything you would like me to write up for a HTML HELP post then please let me know on twitter.
post signature

twitter | instagram | bloglovin | youtube | shop
p.s: I now do custom social media buttons! Click here

1 comment

  1. This is fab! I look forward to your series:) the way you've done it is so easy to follow! I'm going to give it a go myself I'm rubbish with HTML!
    Kat xx


Feel free to leave a comment. If there's anything you'd like to ask me then don't hesitate in emailing me at or on twitter: @callierose92

© Callie Rose | All rights reserved.
Blogger Template Crafted by pipdig