Ebay templates coding has some pitfalls, and some research had been made recently to circumvent them. Here’s how to avoid problems with ebay product template coding.
- Ebay will cut
headtags, so don’t include them into template.
- Don’t add
- It’s a good idea to have your template wrap class name before every next class or ID, this way you’ll be sure not to touch ebay page classes.
- On first load of template ebay will use mixed styles which will come partly from ebay page – so every CSS style you don’t assign specifically, will get a style declaration from eBay CSS. Some elements can look different because of that. Assign CSS style to every element. Example: If you don’t have a special style for Paragraph it will get CSS from ebay, like
line-height:1, no margins, etc. After page reload your template will be put in
iframe, and your styles will be back, but you must achieve same look. Styles must have unique names, I add something before every name I assign to a class or ID, i.e.
- Default background of ebay is gray, so if you don’t add i.e. white background to your wrapper, on some screens you’ll get a gray background.
- Make your template responsive, users have different screen sizes.
- When adding font-family declarations, don’t use double quotes, they won’t work in Internet Explorer, use single quotes for font names:
font-family: 'Helvetica neue', Helvetica, Verdana, Sans-serif;
- Prepare template to look the same in “quirks mode”.
box-sizing: border-box;to input fields. otherwise you’ll have different field size on first load and after reloading.
- Inline style is a good solution for elements. But sometimes it’s enough to add
colorto a wrapper of your template.