Adding Images To Web Pages And Landing Pages Of Your Sites Where The Hosts Do Not Allow Uploading Of Images

Print
User Rating:  / 5
PoorBest 
Parent Category: Web Page Mastering Category: Working With Images And Pictures
Created on Tuesday, 28 December 2010 Last Updated on Friday, 10 June 2011 Published Date Written by MrCompTech

This article will explain how to use a free blogging site as your image 'library' for web sites that do not allow you to upload images but do allow you to use the web address of the images in your web page, article, or post.

NOTE: to see an image better just click on the image, it will open in a separate browser window or tab where you can see it larger. you can even use your web browser to magnify the image, i.e. zoom in, using the keys {Ctrl}+{Shift}+{+}. You only press the keys labeled within the brackets not the brackets. In this instance you would press and hold the Control key then while holding the Ctrl key press and hold the Shift key then while holding the Shift key press the Plus sign next to the Backspace key. To reset the browsers magnification to normal use {Ctrl}+(0}, or you can use {Ctrl}+{-} to zoom out.

Many web hosts allow you to create or setup web pages on their servers, but not all allow you to upload images to their servers. Instead, these sites want you to supply a web address of the image that you want displayed on your web page. This is known as 'hot-linking'. The problem with this is that many sites do not allow you to hot-link to them while others site were you can easily images, only show the images or photos as part of a gallery and do not provide web addresses to your individual images or photos.

To overcome these obstacles you will need some place on the web to serve as your 'image library' that allows hot-linking and the image can be accessed individually and not as just part of an image gallery. For the 'library' we will use a free blogging account on blogger.com. So the first thing you need to do is to setup a free blogging account. This article assumes that you have setup a blogger.com account. It also assumes that you have saved the image you want to use on you web page on your PC.

Now that we have our blogging account we will be setting up a separate blog page.

  • Log in to your Blogger.com account and go to your 'dashboard'
  • Click on the link 'Create a Blog'

We are going to use the blog page to display images, but you need to place some meaningful text with the images, so that we are actually using this free service as a blog. Using anyplace on the web to simply store images or videos is often not allowed and can get your account banned.

  • Give your blog a name, this is the title that will show up on the page

For this example I will use 'Link Assistant' for the name and will use this as the URL as well. Be sure you click the availability of the URL. You may need to use something similar if what you want is not available. Here 'seotools.blogspot.com' was not available so I chose mct-seotools.blogspot.com.

  • Select a template

 

Now you have a blog, but every blog needs to start off with the topic of the blog so you need your first post to this blog.

  • Enter a title for this blog's post, this is a post title not a blog title.
  • Enter some text in the body to describe the blog page and maybe the image.
  • On the Toolbar click on the insert image icon.

  • In the 'Upload Images' dialog box that appears, click the "Browse" button and find the image on your computer that you want to upload.
  • Click the appropriate radio button to chose how you want the image styled in the blog post.
  • If you want to use this same layout as every time you upload an image then be sure the 'Use this layout every time?' checkbox is checked.
  • If this is the first time you have uploaded an image to your Google blog then you will need to read and agree to the T.O.S.
  • Click on the "UPLOAD IMAGE" button

  • You will need to click the 'Done' button to go back to the editor.

  • Click on the "Compose" tab next to the "Edit HTML" tab.

Now you should be able to see your image.

  • Click the "PUBLISH POST" button

Let's view the post by clicking the 'pop-up' link icon next to the "View Post" link. The difference between these two is that the "View Post" link shows the post in the current browser window while the pop-up' link icon cause a new browser window or browser tab to be opened.

Go ahead and click on the pop-up' link icon.

 

  • Right-click on the image you uploaded to display the 'context menu'.
  • On the 'context menu' click on properties.

  • Right-click on the text just to the right of "Address: (URL)"
  • On the 'context menu' that appears click on 'Select All' to highlight the web address. It must be highlighted before it can be copied to the PC clipboard.
  • Right-click again on the highlighted text. Notice that the menu option 'Copy' is black instead of gray. Click on copy.

  • Now open a plain text editor such as notepad and right-click in the body area then on the context menu that appears click 'Paste'.

It will look something like this:

http://1.bp.blogspot.com/_X8ZZtT9VMHw/TRPeniUv6qI/AAAAAAAAAAY/lR1BsTGJqxM/s400/linkassistant-468x60.gif

This is the 'web address' that you use on your web page where uploading of images is not permitted but web addresses of images is permitted.

Now you also need to test your efforts to be certain that you have the correct web address of the image that you want to use in your other web page.

  • Logout of your Blogger account
  • Paste the web address of the image in to the address bar of you web browser
  • Right-click in the address bar, this will highlight whatever web address is there.
  • On the context menu click on 'Paste'

  • Press enter or click the browser's 'Go' button

The only thing you should see in this web browser window is your image.

Now you have the web address of the image this is what you would paste or type into the "IMG URL" field to use an image on your web page that is on a server that doesn't allow you to upload images, but does allow you use a web addres if an image, the "IMG URL".

Please register or login to add your comments to this article.
Buy cheap web hosting service where fatcow web hosting review will give you advices and please read bluehost review for more hosting information.
Copyright © 2012 MrCompTech. All Rights Reserved.
Joomla! is Free Software released under the GNU General Public License.
Free Joomla Templates designed by Web Hosting Top