If you have created or bought your own eBay listing template design, it will just be HTML code but won’t have any of the template tags which Xpress Lister will use to populate with dynamic data such as Title, Price, Description, etc. The purpose of this article is to give an overview
Preparation
To get started, you will need the following:
- An editor suitable for editing web pages
- Your listing design
- The default Codisto template for reference
Replace Content with Template Tags
Your template design should have sections for content such as Title, Price and Description. So that Xpress Lister can put the appropriate content into those sections, the placeholder text in your design will need to be replaced with template tags.
Title
Replace the Title in your design with:
{Title}
Price
Replace Price in your design with:
{format eBayPrice, eBayCurrency}
Description
Replace Description in your design with:
{include field="EbayDescription"}
Main Product Image
The main image is quite easy to do via WYSIWIG editor as you can just replace the image source with:
{CDNUrl}/productimages/{ProductID}.png?width=547&etag={etag}
Change the width in the QueryString to suit the image container width of your design.
Additional Images
Additional images are a little more difficult as it can only be implemented in source code and needs to take into account the HTML markup of the design. The following sample code is from our default template. The CSS classes in the example are for Bootstrap 2, which is what our default template is based on.
{for images}
<a href="#_" class="lightbox" id="img{position+1}">
<div class="close-img">×</div>
<img src="{cdnurl}{images.src}?width=800&height=600&nostretch">
</a>
{/for}
<div class="clearfix"></div>
{if count(images) > 1}<hr/>{/if}
{for images step=4}
<div class="row image-row text-center">
{for Images count=4 start={position}}
<div class="span2"><a class="image fancybox" href="#img{position+1}"><img src="{cdnurl}{images.src}?width=200&height=200"/></a></div>
{/for}
</div>
{/for}
References
Please see the Template Editing article for a more technical discussion including a full set of available template tags.