Amazon WebStore by Amazon 3.5.1 User Manual

WebStore by Amazon 3.5.1: Merchant Manual

Advanced Customizations: Tips and Tricks

Using Tips and Tricks

You can use the tips and tricks below to get started developing an interesting and
unique WebStore. We provide these tips and tricks to get you started, but you can
experiment and invent your own methods to develop a site that suits the needs of

your business.

Change the Layout of Your WebStore

WebStore by Amazon offers several out-of-the-box themes for the layout of your
WebStore, but you can also create your own layout. To create and insert a custom
WebStore layout, you need to override the existing cascading style sheet (CSS) for
the theme you’ve chosen in the setup wizard.

Embed a New Cascading Style Sheet

CSS controls formatting such as font color and size, and background colors and
images. The following are instructions on how to insert a customized CSS onto your

site.

Download the Default Style Sheet

•

Download the default style sheet and view the source of any page on your
store front. Click view>source in your browser to view the source code.

•

In the source code you will find a line like this: <link
href="/themes/natural/variations/sky/styles/natural.css"rel="stylesheet"
type="text/css">

•

Paste the “href” path into your browser after your site URL. For example,
http://www.yoursite.com/themes/natural/variations/sky/styles/natural.css.
Save the CSS file to your computer by clicking File> Save As > Web Page,
Complete.

•

After the CSS file is saved, you can view styles associated with particular site
elements and customize those elements by overriding the existing style

sheet.

Override the Existing Style Sheet

The following is an example of overriding the default CSS is the top navigation link
bar. In the Template Manager tool, create a top link bar using the link bar widget.
Paste the following CSS into the topmost red (global) widget holder. Pasting into the

global widget holder applies the styles across the entire site: