Skip to main content

Yahoo Store Editor V3.0 breaks table / image layout?

I've been banging my head against the wall with a problem. I've got an ImageReady HTML layout I had to put into a Yahoo Store, and everything was fine in Internet Explorer, but in Firefox, the layout was broken. Images were shifted up and down, left and right.

I knew the new Yahoo Store Editor (version 3.0) now forces all the pages to be in Standards mode , so I had a feeling it had to do with that. Once I was reasonably sure that it wasn't some dumb mistake in the HTML, I started searching for some info on standard doctype, images, tables, and mozilla, and sure enough, I found it here.

Sure, tables and images are not supposed to be used for layout anymore, but it is still a lot easier in many cases to splice a few pieces of an image together using tables to come up with a specific look. What I didn't know until now was the new standards actually broke the old habits... Not too great if you ask me, I always think that if something is updated it should always support what came before that point...

In any case, if you are using the new Version 3 Yahoo Store editor and templates, and want to use tables and images for layout, save yourself some trouble and add the following to your stylesheet:

td > img, a > img { display: block }

Or, if you also have image type submit buttons in table cells, then:

td > img, a > img, td > input[type=image] { display: block }

You may have to play with these a bit to get things right depending on your particular layout. For example, I found I had to add this in another store:

td > a > img { display: block }

After this, my layout worked like a charm. I'll be sure to include it in the next revision of our Yahoo! Store Tips & Tricks book.

Comments

Popular posts from this blog

What to expect when your redesign goes live

At Y-Times we roll out new designs, redesigns and other major upgrades to Yahoo stores on a fairly regular basis. Some of the main questions our clients ask are how to prepare for a roll-out and what to expect in terms of SEO and conversions when the changes go live?

For any functional Yahoo store how well the site ranks and how well it converts are probably the two most important metrics. Since pretty much ANY change you make to any page can potentially alter either or both of these metrics, merchants may understandably feel nervous about far reaching alterations to their sites. However, when those functionality and design changes and additions are done right, there is really very little to fear.

First off, what does it mean for a design or redesign to be "done right?" From the technical stand point, search engines look at the underlying structure of your site (the HTML, and increasingly also the CSS and JavaScript code) to try to extract information and meaning from it. If…

What is product-url anyway?

I keep having to field questions about the product-url field, and since it came up yesterday, I figured I'd try to clear up all the confusion about it.

So the name product-url suggests that whatever you type in there will become the URL of that product. Unfortunately, this is not the case, or rather, not in the intuitive way. The URL you enter there will be used as the URL for that product in Yahoo Shopping, on the built-in search results page, and on the shopping cart page, however, the URL you type in there DOES NOT actually change the physical URL of the page.
What is the URL of a page in a Yahoo Store? In any Yahoo Store built in the store editor, the URL of a page is the store's domain name and the page ID + .html. For example, in my store at www.ytimes.info, I have a page whose id is rtml101, thehrefore, the URL of that page is http://www.ytimes.info/rtml101.html.
Why would you want to change the URL? For SEO reasons, it is believed to be better to have a URL that includ…

Bookmarklets for Yahoo Store

I was introduced to "bookmarklets" by my friend, Rob Snell, many years ago at one of the Yahoo Store conferences and they are indispensable tools in my daily work on Yahoo stores.
What are "bookmarklets"? As the name suggests, bookmarklets are kind of like bookmarks in your browser, except instead of leading to a web page, they execute a small piece of JavaScript code on the current page. This is made possible by the browser's support of the "javascript:" prefix. When you point your browser to a URL, the browser figures out what to do with it: bring up a web page if the address starts with http:// or https://, connect to an ftp site if the address starts with ftp://, or in the case of javascript:, interpret and execute the JavaScript code following the colon.
Typically, bookmarklets are saved either in your Favorites folder or if you use them on a daily basis like I do, in your browser's bookmarks toolbar. In essence, bookmarklets are sort of like…