This is my journey as an E-commerce Consultant
Archive for June, 2008
eBay Design – The copycats rise and how to decide?
Well, keeping my eye out on the eBay Shop Design front there seems to be a lot of eBay Shops and templates all with the same layout. The re-skinning with CSS effect (close to what I am talking about with the DIY eBay Shop Design with CSS series, but with way better graphics and better organisation) within a very fixed template. Do we assume this is the only way using CSS that the eBay shop can operate?
In no particular order to prevent bias these companies offer the same look of eBay store and template design (varying in graphic design quality)
- JustTemplateIt.com
- Createmystore.co.uk
- Ebayshopdesign.com
- Gdfinternet.co.uk
- Frooition.com
- Apanado.com
- Connoserv.co.uk
- dascs.com (adding these guys as they look like eBay shop CSS junkies, but their layout is slightly different to the rest, on the same vein but a little more basic and £100)
- www.pmb-web-designs.co.uk (they have ebay stores designed by ebaystoredesign.com and now look the same as the rest, they might be one in the same)
- 121website.co.uk
- proimpulse.com
and these are just the guys I have seen. All seem to peg the ‘Advanced eBay Store’ design slogan (since first posting I have added a few who don’t say ‘Advanced eBay Store’), but I can’t see anything advanced, or new from when I took a first look at eBay design back in 2004. These guys all use the same CSS templates with nuggets of JavaScript around and graphics plugged in.
All charge under £1000 as far as I can see. So if you are going to invest your hard earned eBay pounds, dollars or euros, make sure that it is the support services and graphic design quality that you are buying into. It seems anyone can throw together the skeleton, but you can’t imitate good design quality and excellence in customer service.
I love the ‘copyright’ notices in the CSS and threat of legal action. You can’t copyright CSS and you have all nicked it from each other whether you have lifted it straight or back engineered from concept. It doesn’t effect the quality of design.
I would love to know how you start litigation without submitting patents under common law, so if a lawyer reads, drop me an email.
I would also be wary of unsubstantiated claims of usability and accessibility unless they can marry their evidence with cutting edge practices and up to date eBay marketing knowledge. Some ebay design firms are just that, design. If they don’t trade or handle eBay trading actively for clients (edited to note: including active eBay consultancy and/or an up to date knowledge of best practise), can you trust their eBay knowledge?
Some features might actually put off customers and not lead them on the buyer journey you want.
Always remember your customer finds the shop through your listings, and rarely the other way round. Focus on the listing template, and think of the eBay Shop Design as just consistent branding.
You can get a cracking eBay template off any web designer proficient with HTML and CSS, when it comes to adding in active content like dynamic drop downs, attribute sorters and picture slide shows, its best to conscript an eBay professional as this area is tricky due to policy compliance. On this point, make sure you are aware that even some professional eBay designs are breaking eBay rules.
The rise has been quick, and I assume before the year is out the standard eBay shop design will be the CSS driven template, someone should open source it before eBay bans the idea.
Oh my : http://pages.ebay.com/storefronts/designtemplates.html
I think I might post about who to choose for individual eBay design, as it might be less progressive.
eBay Shop Design Lesson 8 – Promotion Boxes
1422 days
As I rubbished the promo boxes with the last CSS changes I thought I should get back to them ASAP.
First list on the agenda was to get rid of those crazy ‘corner’ images for the promo boxes:
table#PromoListView table table img {
display: none;
}
but that also kills the promo box images (and the slider) so now I have to put back the bits I want:
table#PromoListView table table#Table3 img {
display: inline;
}
I still don’t have anything defined, and the default text of the box titles is just too pale, so I am going to pink it up:
#PromoListView tr td font
{
color:#FF00FF;
font-size:18px;
}
and I am going to make the item links in these promo boxes hot pink:
table#PromoListView a {
color:#FF00FF;
text-decoration:none;
}
then I shall encase each box with a border:
table#PromoListView {
border:1px #FFCCFF solid;
}
We have not changes the width or dimensions of the promo boxes but you would do this from the table#PromoListView section and using the !important tag. You can also add in backgrounds, images etc that have not been explored here.
Please as always read the disclaimer
The entire section looks like this:
/*Promo Boxes*/
/*hide ebay corner images*/
table#PromoListView table table img {
display: none;
}
/*correct the fact that the above kills the main image too*/
table#PromoListView table table#Table3 img {
display: inline;
}
/*item links*/
table#PromoListView a {
color:#FF00FF;
text-decoration:none;
}
/*box title text*/
#PromoListView tr td font
{
color:#FF00FF;
font-size:18px;
}
/*promo box border*/
table#PromoListView {
border:1px #FFCCFF solid;
}
/* -------- End -------- */
You can see the full css file here: eBay Store Design with CSS and to see the changes to my eBay store as we go along visit : http://stores.ebay.co.uk/Hairfreax
Next I shall sort out the shop search section, once I have found which table it corresponds too. Its seems to be avoiding me!
See what others have done with this information and while your at it buy from them!
http://stores.ebay.com/J-L-OUTDOOR-SUPPLY
http://stores.ebay.co.uk/Betterlifehealthcare
http://stores.ebay.it/TM-bazar
Edited to add:
If you want a background image for your store try the #paging id. This effects the background elements of your store. I will be getting down and dirty with the new compliance rules soon…
eBay Shop Design – Gallery Background Image
1423 days
We looked at changing the gallery background using css but now we want to move on and replace it with an image.
The section is currently:
/* -------- Control Border on Gallery List -------- */
td.gallery
{
border:1px #FF00FF solid;
}
/* -------- End -------- */
/* -------- Control Background on Gallery List -------- */
td.gallery table td
{
background:#FFCCFF;
}
/* -------- End -------- */
Now we are going to replace it with:
td.gallery
{
width:360px;
height:130px;
background:url(http://www.kidsontalks.com/ebaybg.jpg) no-repeat !important;
}
/* making certain backgrounds transparent */
span.ebay table,
.pagecontainer table table table,
.pagecontainer table table tr,
.pagecontainer table td
{
background:transparent;
}
Notice that adding this section of code, the background to the promotion boxes/search box and the categories disappear (we shall deal with the promo boxes and search box in a later post) so to make sure you category background image stays in place replace:
td.category {
height:35px;
width:180px;
border-top:1px solid #FFCCFF;
background: url(http://www.kidsontalks.com/ebaybutton.jpg) no-repeat;
margin:5px;
}
with:
td.category {
height:35px;
width:180px;
border-top:1px solid #FFCCFF;
background: url(http://www.kidsontalks.com/ebaybutton.jpg) no-repeat !important;
margin:5px;
}
the !important tag tell eBay that your CSS change is WAY more important and should be obeyed at all costs.
I also added this nugget to add a nice border around my gallery:
table.ebItemlist
{
width:770px !important;
border-left:1px #FFCCFF solid;
border-right:1px #FFCCFF solid;
border-bottom:1px #FFCCFF solid;
}
Please as always read the disclaimer
Just to complete, the section now looks like:
/* -------- Control Gallery List -------- */
td.gallery
{
width:360px;
height:130px;
background:url(http://www.kidsontalks.com/ebaybg.jpg) no-repeat !important;
}
/* making certain backgrounds transparent */
span.ebay table,
.pagecontainer table table table,
.pagecontainer table table tr,
.pagecontainer table td
{
background:transparent;
}
/*Nice border around gallery*/
table.ebItemlist
{
width:770px !important;
border-left:1px #FFCCFF solid;
border-right:1px #FFCCFF solid;
border-bottom:1px #FFCCFF solid;
}
/* -------- End -------- */
You can see the full css file here: eBay Store Design with CSS and to see the changes to my eBay store as we go along visit : http://stores.ebay.co.uk/Hairfreax
The Fit has hit the Shan for eBay Developers….
all over eBays ‘User generated content‘ woes.
Key content from this post:
What’s Changing on eBay: In the short-term, we’re moving listing descriptions to a different domain. Descriptions will be displayed by using an iFrame within the View Item page. Our intent is to ensure that user-generated content won’t have access to eBay site content. We’re currently piloting this in US Motors, and we’ll be releasing this change in the US and internationally later this summer.
iFrame? IFRAME!!!!? Classic iFrame injections spring to mind.
and….
The idea is to create a small program to allow developers to offer great functionality for users, using Flash, JavaScript, and other rich Internet technologies. The difference is that you won’t directly include code in listing descriptions. Instead, listing descriptions would include a set of tags that load rich content using vetted widgets and initialize them with parameters that you specify.
I kind of like tags, I feel this will open up the world of eBay design a little, and cut the rubbish when it comes to eBay compliance, which in all fairness is hit and miss. This will undoubtedly mean intense development time for eBay designers, but I am waiting for the open source eBay widget library. Go on eBay you know you want too!
Todays letter was the letter J…
1426 days
I thought that my first API integration would be with eBay or Channeladvisor API, maybe a little ambitious on reflection, but working with Google Maps API is nice for a Javascript beginner.
