Customizing CSS and Shared aStore Themes

Responding to requests for more control over the look and feel of your aStore, we are now providing you the ability to apply your own user-defined style sheets (CSS) to control how your aStore looks and feels. And, if you don’t want to build your own style sheets, you can find and use styles that other aStore users have chosen to share.

What do different sections on Edit CSS page mean? aStores have a number of different types of pages and we are now allowing you to selectively customize these different pages. For each type of aStore page, you can view the existing CSS code and then write overriding CSS code to customize the look and feel of the store.

There are 6 types of aStore pages –

a) Global – These settings apply to all of the pages in your aStore. Any changes to this section will change look and feel of entire store.

b) Category page – Category pages are defined as your customized topic-specific aStore pages. e.g. in the demo aStore, we have category pages - Home Page, Cubs Fans Essentials, Apparel and Accessories, Camera and Photo etc. Your CSS code in this section will impact features on these category pages only.

c) Detail page – These are product specific pages that contains details for a given product. For example, image, price, availability, customer and editorial reviews. Changes to this section will impact detail pages for all the products within aStore. e.g. Click here for detail page for the product "When It Was a Game"

d) Listmania! – If your aStore has Listmania widget selected, then landing page for Listmania can be customized by you. e.g. Click here to visit listmania! page

e) Search Results – When your customers conduct a search within aStore, they land on a page with search results. You may customize this results page by adding your own CSS. e.g. Click here to visit search result page for keyword shirt

f) Shopping Cart – When customers add an item to their shopping cart, they land on the shopping cart page which lists all items they intend to purchase. This shopping cart page is customizable.

Can I see how my aStore looks as I am developing my CSS?

While you customize your CSS, you can click on “Preview Store” button to check how your aStore looks. Note that this is a preview only and will not result in these changes getting applied to your aStore.

I don’t see any Save button …

Your work will automatically get saved if you click on any navigation button on the “Edit CSS” page.

How do I apply my customized theme to the aStore?

When you have completed the customization, click on “Back to Color and Design” button, customized theme will appear as a drop down option under “Color Theme” on “Colors and Design” page. You can click on it to apply your customized theme to your aStore.

What happens when I click on “Share this theme”?

If you feel that you have created a master piece or you just want to share your new theme, then clicking on “Share this theme” button your make your style sheet available to all aStore users. You can name your theme and with a click, it will be available to over a hundred thousand aStore owners around the globe.

How do I debug my CSS as I’m creating it?

At this time, we don’t provide any specific development or debugging support.