Note: Some of the steps below are not applicable to the default themes in Theme Manager.

There are several things you can do to enhance the default appearance of your Merchant Solutions store front, and you don't need a developer to do so.

Jump to:

• Make your store wider (stores designed using Design Wizard templates)
• Edit text and image variables
• Add content to the Home page
• Add a Live Store badge

Note: These tips work best with a generic template, and shouldn't be used with a pre-designed or custom template.

Make your store wider

This is not as complicated as it appears, just follow the steps below.

1. Sign in to your My Services page.
2. Click the Store link.
   
3. Go to Store Editor.
   
4. From the Advanced Editor toolbar, go to Contents. 
   
5. Click the edit icon next to css-edits.
   
6. Highlight and copy the appropriate block of css code shown below:
   • For Side Navigation bar templates:
     
     /* START: Make your store wider (side-nav templates) */
      #container {width:950px;}
         /* Default is 760px */
      #bodycontent {width:800px;}
         /* Default is 610px */
         /* 150px allowed for side navigation */
     /* END:   Make your store wider (side-nav templates) */
      
   • For Top Navigation bar templates:
     
     /* START: Make your store wider (top-nav templates) */
      #mainbody {width:950px;}
         /* Default is 760px */
     /* END:   Make your store wider (top-nav templates) */
7. Paste your copied code at the end of any existing code in the Css-text field.
   
8. Click Update. The change takes effect immediately in the Editor. Note: You can tweak the values we provide, but you don't want to make your storefront much wider than 950px as it may not fit on some smaller devices.
   
9. Publish when ready.
   

Edit text and image variables

A one-size store does not fit all. The suggestions below are good starting points to make it look better, feel free to play with your own numbers. You can locate the following fields in the Variables page of the Store Editor.

• Global-font-size controls how big most of the text on your website will be, measured in pixels. Increasing this value a little bit may make your site easier to read. Don't set it too large, though, or else you won't be able to fit much text on a page. Try starting out at 14px.
• Item-height and Item-width control the image size on your product pages. The default values are a bit small, try increasing both values to 300.
• Thumb-height and Thumb-width control the size of your product images on a section page. Try setting both to 150 and see how that looks.
• Inset-height and Inset-width control the size of your product's secondary images. Making them the same size as the main product image will give more of an image-grid display. Start with both values set to 300.
• Uploaded-img-default-type and generated-img-default-type set the format for uploaded and resized images. Setting the value to JPEG will speed up rendering time and help your pages load faster.
  
  Note: These image and text variable settings with sample images are discussed in-depth in this Help Page.

Adding a header image and/or a company logo will add a unique, personal touch to the store

• Header-background-image - You can find free website headers on the web, or adjust them (or create your own) with a photo-editing program like MS Paint. Header images should be 950 pixels wide, in our example, with a height between 50 and 250 pixels depending on your tastes.
• Header-background-image-height sets the height of your header image. Making it smaller will crop the image, not resize it so it won't get squished and distorted. Setting it to a value bigger than the image will cause a blank area to display, so take care here. Feel free to experiment! 
• Name-image lets you upload a logo that will replace the default textual Company-name-text at the upper-left of the store. A logo will display in front of the header background image, so you feel free to use both!
• Name-image-height and Name-image-width control the size of the logo image. Experiment here to see what values give the display you like best.
  
  Note: ​These header variable settings with sample pictures are discussed in-depth in this Help Page.

Upload a background image or set a background color

• Background-image (stores designed using Design Wizard templates) - Upload an image that will display in the blank space around your store front. You can search the web for free background images. Use an image about 1280 x 800 pixels with a regular pattern or solid color so it will tile seamlessly. 
• Background-color can be set instead of using a background image. Play with different colors if you'd like.
  
  Note: These and other color and typeface variables are discussed further in this Help Page.

Add content to the Home page

Adding extra content to your home page in the Store Editor can help in keeping your visitors engaged and build trust.

• Add text to the Message box. Tell visitors about your products, and why they should buy from you.
• Add some Item IDs to the Specials field. Rotate them frequently (weekly) to keep the home page freshened.
• Add a YouTube product video, if appropriate. Use this Help Page to get the embed code, then paste the code into the Message box, either above or below any existing text. 

Add a Live Store badge

If you qualify, adding the Live Store badge to your store will let your customers know that your store is trusted by Turbify. See this Help Page for details and easy activation instructions.