From collectibles to cars, buy and sell all kinds of items on eBayWelcome! Sign in or register.
Advanced Search

Reviews & Guides

Write a guide

Add Photos to your eBay Blog

by: shipscript( 8 ) Top 1000 Reviewer
18 out of 24 people found this guide helpful.
Guide viewed: 3827 times Tags: eBay Blogs | eBay Blog Photos | Blogging | Write a Blog | Blog Codes


Adding photos to your eBay Blog.

As you browse through the various eBay blogs, you'll notice the occasional image can really spice up the page, and significantly enhance reading enjoyment. So if you have access to properly prepared online photos, do use them to enhance your page.


♦ Resize and Compress

For an attractive and quick loading page, make sure that image is an appropriate size and that the image file is compressed for a quick page load. The best sizes are under 500 pixels wide. Anything larger will stretch the screen for 800-wide monitors, requiring the reader to scroll back and forth.

Compression is a method for reducing file size. The compression settings are often found on the "save as" screen of the image editor. The options may be described as compression or quality, and you'll want higher compression or lower quality. For dialup friendly results, try to keep file sizes under 70K (70,000) bytes, with 40K (40,000) as the most typical size.

This page, by user Merrygocats, deals with image preparation.

          http://www.isdntek.com/demo/merrypicprep.htm

Need help preparing your photo? Visit the Photos/HTML board,

♦ Host images online

To add a photo to your blog, it must first be hosted online. You can use your own website, personal webspace from your ISP, or an online image host for that purpose. You can even use images that are hosted by eBay in your Picture Manager account, on your ME page, eBay Guide, or even EPS auction photos (for up to 90 days).

Important! For images to remain viewable in your blog, they need to remain hosted and online. Be careful when renaming, deleting, or moving image files on your host. If you have linked to photos from your Guides or ME page, they will disappear shortly after removing them, so pay attention if you use those sources for photos.

This page contains some information about setting up and using outside hosting.

          http://www.isdntek.com/demo/hosting.htm

Need help finding or using your outside image host? Visit the Photos/HTML board.

♦ Add an image to your Blog

I would recommend that you type all of your content first and save your post. Then return and add photos. That way if you goof up on the photo part, you can abandon and return to the saved copy.

There are different methods for getting photos into your blog.

1. RichText Paste:   (image to image)

View your photo in a browser window. Then you can copy and paste the image directly into the RichText editing screen along with the rest of your formatted content (not in the HTML view).

While browsers all seem to copy text in the same manner, they copy pictures differently. If you have Internet Explorer, right-click-copy the image or press Ctrl-C to copy the image. With Firefox/Netscape, use your mouse to highlight the image, and then use the toolbar menu to Edit/copy the image or use Ctrl-C to copy the image. These methods actually pick up the underlying HTML code, but you don't have to see it or deal with it.

While in normal (not HTML) view, click your cursor into the editing page where you would like the image to appear. In Internet Explorer, right-click-paste or Ctrl-V to insert the image. In Firefox/Netscape, use the toolbar menu to Edit/Paste the image or use Ctrl-V to insert the image. The paste operation will add the underlying HTML code to your Blog, but you won't have to deal with the codes. Instead, you'll just see the image.

_________________________________________________________
To summarize: View HTML   (not checkmarked)

    Copy:      Display image in browser
                     Internet Explorer:  Right-click-Copy or Ctrl-C
                     Firefox/Netscape:  highlight image then
                                                   menu-Edit/Copy or Ctrl-C


    Paste:     Click cursor into page
                     Internet Explorer:  Right-click-Paste or Ctrl-V
                     Firefox/Netscape:  menu-Edit/Paste or Ctrl-V
_________________________________________________________

2. Add HTML Code:   (code to code)

Locate the URL of your online photo. A URL begins with http: and looks something like this:
      http://www.myhost.com/image.jpg

You can usually locate the URL for a photo by right-clicking to read the properties in the popup window. The URL may be so long that you can't read the entire text, but it is possible to click into the URL on the popup and right-click-SelectAll. That way you can right-click-copy the entire URL without the typo problems associated with typing a URL by hand.


However, in order to add it to your code, it will need to be contained within an HTML image tag. An image tag with a full URL will look like this:

      <img src="http://www.myhost.com/image.jpg">

Misspelling src is a common reason an image won't display. And leaving off one of quotes will cause the image or page to disappear.

Some image hosts prepare that code for you automatically, so all you will need to do is pick up the code from your account on their site. This is one host's example.


To learn about borders and linking (clickable images), please look at this page:

      http://www.isdntek.com/demo/hosting.htm


How do you know where to paste the code? One easy method is to add a marker to your text before flipping to the code view. Just type something like ....picture here.... and then look for it when you change views. Be careful to replace only your marker, as it is pretty easy to accidentally grab and overwrite other codes when pasting.

_________________________________________________________
To summarize: View HTML  (checkmark box)

        Type or paste image code that is constructed like this:

        <img src="http://www.myhost.com/image.jpg">
_________________________________________________________

3. Use the Blog's picture insertion tool: (url to image)

Well there isn't one - but I'm sure it will come along at some point. When it does become available, it will be an icon on the editing menu that will open up a dialog box where you can paste the URL to your photo, beginning with http: The photo will then be inserted at the cursor in the editing window.


Pasted Photos & Text won't stay?

There is currently a problem with the Blog editor that may prevent your pasted images, code, or text from sticking. You may find them disappearing when you save or flip back and forth between standard and HTML modes. This happens when using the mouse (not the keyboard) to paste into the fancy editor.

The solution is to first click into the field to see your blinking cursor prior to pasting, and then click the mouse or actually type something into the field with the keyboard after pasting into it. Of course, that is why the Ctrl-V always works - because the keyboard, instead of the mouse, is used to paste.

Need help adding photos to your blog? Visit the eBay Blogs board.


♦ Add a Logo, Banner, or NavBar image

Images can be used as part of your blog template by adding them to your custom stylesheet. Add a logo, banner, and backgrounds using CSS. For more info and instructions, visit the thread on how to Customize your Blog with Stylesheets, or go directly to the styling page:

          http://www.isdntek.com/demo/blog.htm

Need help adding your banner or CSS to your blog? Visit the eBay Blogs board.

 

Please see my other guides for Auction Template help, Page Design Basics, and useful tidbits:


The About ME page design series:

Summary  - The 10 Design Basics for a Better ME page
Design Basics 1  - Getting the most from Color
Design Basics 2  - Using Fonts
Design Basics 3  - Effective use of White space
Design Basics 4  - Using Photos
Design Basics 5  - Backgrounds and Borders
Design Basics 6  - Multimedia
Design Basics 7  - Top 10 Design Mistakes

Auction Template Help:

eBay Guide Help:

Copyright © 2006 shipscript Free Tools for Better Auctions


Guide ID: 10000000001240193Guide created: 06/26/06 (updated 05/03/08)

 
Was this guide helpful? Report this guide

Ready to share your knowledge with others? Write a guide



 


eBay Pulse | eBay Reviews | eBay Stores | Half.com | eBay Express | Reseller Marketplace | Austria | France | Germany | Italy | Spain | United Kingdom | Popular Searches
Kijiji | PayPal | ProStores | Apartments for Rent | Shopping.com | Skype | Tickets


About eBay | Announcements | Security Center | eBay Toolbar | Policies | Government Relations | Site Map | Help
Copyright © 1995-2008 eBay Inc. All Rights Reserved. Designated trademarks and brands are the property of their respective owners. Use of this Web site constitutes acceptance of the eBay User Agreement and Privacy Policy.
eBay official time