Tuesday, July 18, 2017

How to host your own blog images

Recently, I had an overnight hospital stay for some planned surgery. I knew that coming home I would have some down time away from work, and I had planned to write some blog posts as well as do some maintenance on my blog. 

Imagine my surprise when I checked my blog last week and saw the following image several times in the right-hand margin of my blog! 

I went straight to Google to see if this was a common issue, and it turns out that it is. Photobucket, a photo-hosting site, without warning, changed its policies and limited third-party hosting to only paying customers. I almost fell out when I saw the price... $400!

Now, photobucket has(had) a great thing going. With as many customers as photobucket has, they could have charged us a reasonable amount and we would have accepted it and paid it. Unfortunately for them, there are a ton of comments across the Internet of people who feel like I do - that it is a ridiculous amount and they will find another option for image hosting.

I immediately turned to help from the Xomisse website. I found a blog post with instructions on how to host images on my own blog and not have to use a third-party site like Photobucket. 

(To see the instructions from Xomisse for Blogger and Wordpress, click HERE).

My instructions are for blogger, since that is the platform that I use for The Compelled Educator. 

First, open a new post, and title it "Images for Blog." You are NOT going to publish this post. You will only save it and close it, leaving it in draft mode. 

In the picture above, you can see that I uploaded new images for social media buttons as well as our Compelled Tribe badge. 
Above, you can see the HTML code of the images that I have uploaded. If you are only uploading an image and not linking it to anything, you can highlight the code in YELLOW and paste into an html widget in your blog layout. Hint: Look for the second set of triangular brackets and copy the brackets and everything in them.

The href just prior to the image code will link the image to another "location." (See green highlighted text above.) 

For example, the social media icon containing the envelope will take blog readers to my email address. To do the same on your blog, use the following code just prior to the code for your social media icon. 

<a href="mailto:thecompellededucator@gmail.com">

You need to change the text in red above to YOUR email address. 

For twitter, facebook, pinterest, etc... just change the text in the quotation marks (above) to the web address of each.

Pin the image below to try later on your own blog. Feel free to contact me if you need help!

1 comment:

  1. Thanks for the info. I definitely needed to know this. Your Blog looks great, by the way.