Erns Eporium

If you like Ern's-Eporium
then you can donate below.

HTML Tags
  • P paragraph
  • BR line break
  •  
  • B bold
  • I  italic
  • U under line
  • Center centre
  •  
  • UL unordered list
  • OL ordered list
  • LI  list item
  •  
  • H1 header 1
  • H2 header 2
  • H3 header 3
  • Span span

Free custom auction templates for eBay

This page contains a free custom auction template generator. The custom templates use CSS style codes using methods detailed in the Style codes page. This template maker also has an option for adding the listing's text and image links. Once saved the templates may be edited using an HTML editor such as the free HTML-kit editor.

Design selections

Below the colour picker is a schematic diagram of the custom design template along with the design options. For colours, select the item then pick a colour using the colour picker. Click the Set Colour button to update the code and diagram. When all selections have been made go to the code-view panel to copy the code.

Important Announcement

The Erns-Eporium website will be closed down from about Feburary 2015.

Anyone wishing to continue using the templates or custom designs may do so but will need to make and keep copies of them.

Any background image used will need to be copied, stored on a host (such as Photobucket) and the template background url code amended.

  • Background
  • Border
  •  
  • Title
  • Title Background
  • Title Border
  •  
  • Header
  • Header Background
  • Header Border
  •  
  • Text
  • Text Background
  • Text Border
  •  
  • Image Border
  •  
  •  
  •  
  •  

Colour Schemes

Font face

Template width

Border style

Border size

Title

Header

Text

Image Border Image Border

Header

Text

Background Selector

url
Title Text

Text Editor

  • Description Text
  • Text Boxes
  • Box quantity
  1. Box width
Image Links Select image quantity (maximum 35).

Image link example;
http://i117.photobucket.com/albums/o47/eporium/jktwmk2.jpg

Copying the code.

To create or update the code click the Make Code button, this will load the code into the code-view panel. The template may then be previewed by clicking the Preview button, this will either open a pop-up window or new tab. The design can be changed by going back to the design area, then click the Make Code button to update the code and the Preview button for a new preview.

When satisfied with the design click the Select All button to highlight the code. Copy the code by right-clicking on the highlighted area and then select copy, alternatively use Ctrl-C keys to copy the code.

Once the code has been copied open a new blank text or HTML document using notepad or an HTML editor, paste in the code and save the document. The template has now been created, now make a second copy for use as a back-up.

Code View

Further customisation.

Each of the auction design boxes (title, headers, image area) are made from self contained blocks of codes. These areas are marked with comment tag codes, the tag codes will be green if using the HTML-kit editor. This means that they can be easily copied, cut, pasted or deleted in order to create a different looking template. If several templates are made with different colour schemes then the title, header and image areas can be swapped around to create a multi-coloured design.

Guidance notes

Setting colours.

To set a colour, select an item from the list then pick a colour using the colour picker. Click the Set Colour button to update the code and diagram. The colour code numbers in the colour picker and the set colour list are editble and can also be set by typing in a colour hex code.

Colour Schemes

There is also a selection of pre-made colour schemes to choose from. Just click a swatch to change the colour scheme.

Background images

In the Background Selector click on the required image. The image will then appear in the schematic diagram and it's url in the url box. The background tile will be displayed as actual size in the schematic diagram and so may appear to be out of scale. To remove a background click the No Background button. It is also possible to use externally hosted background graphics, just paste the background's url in the url box and then click the Set url button (it may takes a few seconds for the image to load into the schematic diagram).

Adding text.

The auction listing title text can be typed or pasted into the Title Text box.

The Text Editor can be used for adding text to the Description area (the first text box in the template). In addition to the description area up to three more text areas can be added below the images, these may be used for information such as Payment, Shipping etc.. These can be created by selecting the required amount with the "Text box quantity" feature. The width of the boxes can be set with the "Text box width" feature. The header for each box can can be typed or pasted into the input boxes. Use the main text area for writing the information. Switching the text area between boxes is done by clicking the coloured squares.

The text is not formatted and will appear as a block. Formatting can be done by adding HTML tags. There are a few HTML tag buttons in the description text header that can be used. Within the text select where the tag needs to be inserted then click the tag button.

The BR, line break, does not require a closing tag. The other HTML tags require both an open and a close tag. Click a button once to open a tag, click it again to close the tag, the Close Tags button will close all open tags. For information about HTML tags see the HTML codes page.

Adding Images.

Enter the number of images required, from 0 to 35, and then click Update. This will create the image fields. Then add the image's url's.

adding an image link

The template is designed to use an external image hoster for storing the auction photos. One image hoster that can be used for storing auction photographs is Photobucket. Upload the photo to Photobucket and they will supply the url/address for it. This image shows the links as provided by Photobucket, the Direct Link is the one to be used.

Information; To access the photo's links login to your Photobucket account and go to the Library. hover the pointer over an image, an icon will appear in the corner. Hover the pointer over this and a menu will appear.

Image link

Clink Get Links and a another pop-up window will appear.

Image link

Select and copy the Direct link. This is the image address and can be added to an HTML image tag.

Notice in this pop-up menu is an Easy Linking option. Click on this and activate Easy Linking in the next screen. This will list the image links below each thumbnail image, like so;

Image link

The image link will look something like;    http://i117.photobucket.com/albums/o47/eporium/jktwmk2.jpg , this is the type of link that should be pasted into the image link area.

Adding a template to an auction

To access the HTML insertion area in Ebay's selling form first select Switch to advanced tool (top right) and then continue to the description area.
Note; The sell screen may differ from that shown below as Ebay tend to change their layouts often.

Advanced Sell

The listing can be made with an HTML editor such as the free HTML-kit editor. The code can then be copied and pasted into the Ebay HTML area, as shown below. Note; click the "Save Draft" button immediately after pasting.

Inserting Code

It is also possible to switch to the description area's standard view, shown below, to write the description.

Important; If the standard view is used when editing text be aware of how the Enter key works. As well as starting a new line it can also repeat the HTML coding and cause unwanted effects to the page design. So, to start a new line use the Shift + Enter keys.

Standard View