The Pressero system offers various skin options. A skin is a basic design layout for your websites. Each skin has different areas that are available to change/edit with custom images, colors, options, etc. We also offer custom skinning if you need more options than what the basic skin templates have. You can contact the support team by submitting a ticket for more information.
To get to your site skin, go to Admin > Sites > [Select Site] > Appearance > Skins.
The above image shows the first tabbed area that you come to when you choose the "skins" link. Because you will work in this tabbed area most often. It is the one that we start with, although the first step you need to make when you get started is to choose the skin template under the first tab "Select Skin."
Selecting your Skin
Click on the "Select Skin" tab. You will see an example of each of the skins that come with Pressero. These are all organized into three different sections: "Responsive," "Standard" and "Custom." Responsive skins are skins that will adjust their design based on the device viewing the page. Standard skins are fixed width and will display the same regardless of device size. Custom skins, if you have purchased custom skinning, your skins will show up here.
Once you have a skin option you can apply it to as many sites as you want. When you find a skin you like, click on the "Select" button below the skin image. This has not been saved yet! When you choose a skin it will automatically bring you to the "Customize Skin" tab and REQUIRES you to click on the "Save Skin Settings" button before the system will update your site with that choice.
The above is an image of the Select Skin tabbed area. On this page you can view each design layout in a larger view and also select the skin template you want to use for your site. Make sure to save on the next page after making your selection.
Responsive Skins for Mobile Devices
Because your Pressero storefront business is built on enabling ordering anytime, anywhere, a mobile version will soon become essential for some of your customers. You will notice that we offer various responsive design skins. These designs adapt the store layout to your customer's viewing device and can eliminate your customers having to deal with tedious pinching and zooming.
Note: Responsive skins are not compatible with Internet Explorer 8 and previous versions of Internet Explorer.
Customizing the Skins
You first need to have selected a skin layout for the site. Its look (colors and images) can be changed after selection using the Customize Skin tab. The areas that can be customized are:
Customize Skin Images
Each skin will have different images that can be changed/customized. In the example in the image at the top of this page you see the template "Ender's Game" has two images that can be customized. 1. Main Background Image, and 2. Home page banner. To change an image:
- Make a note of the image size/dimensions - Indicated next to the image label. The image must be exactly that to work properly. When you see "auto" that means that the height can be anything you want it to be.
- Check your image type - The image types allowed: .JPG, .GIF, .PNG.
- Name your image - Name your image something that will be easy to identify. All the images you upload for skins will be together in the "Skin Images" folder. It is recommeded to not have any spaces within the name of the image.
- Save changes - Make sure to save any previous changes made to the skin options before the next step.
- Upload your Image - Click "Upload Images." This will take you directly to the File Manager folder where the skin images will reside.
- Select your uploaded image - Once the image has been uploaded you can then return to the skinning area and choose the image in the drop-down for each available image you have the ability to change. Make sure to save again.
NOTE: You will want to "Save" your work so far or you will lose any changes you have made, including the choice of the skin if you have not saved since making that decision.
Images you upload to Pressero for your skins will reside in the File Manager, SkinImages folder. You can access this folder by either clicking on the "Upload Images" link in the Customize Skin area, or by going directly to Admin > Tools > File Manager.
Skin Descriptions
This image above shows a skin description for the skin template "Ender's Game." These notes apply to this skin only.
For more details on your skin please see the links at the bottom of this document organized by skin name.
Customize Skin Colors
Every skin has different areas that allow for color changes. Choose the drop-down for the corresponding area you want to change and set a color. Click "Apply" after selecting the color you want.
Note: To make it easier to locate where on your website each color option applies to, use the Live Palette Editor. It will show you where each item is, let you select the color and see how the change will look on your live site, and let you save it to your site in an easy-to-use editor. See this chapter in the documentation for details on using the Live Palette Editor
Palette Management
For select skins, you can store a single custom color palette. This feature allows you to save a color palette, so you can use that palette on other sites or revert to the palette if you decide against changes you've made to the custom skin color settings.
To store a custom palette, simply click the "Store" button in the "Current Palette" area. You will see that the palette populates in the "Stored Palette" area with the current colors selected for the skin. If you would like to load this palette into a site, simply click the "Load" button in the "Stored Palette" area.
You can also load any of the palette presets for the responsive skins. The default color palettes for each of the responsive skins are available in the "Palette Presets" area. If you would like to use any of these default color palettes in your site, simply click the "Load" button located below the color palette.
Customize Skin Feeds
These two areas are optional. You do not need to display a twitter or RSS feed on your site by leaving these two areas set to blank.*
- Twitter Feed - A Twitter feed can be displayed on your Home page based on your Skin's layout. Enter a Twitter Account (e.g., for Twitter/Web2Print, enter Web2Print). Save Skin Settings before leaving the Skins control.
- RSS Feed - This field can be left blank, or an RSS feed can be displayed on your Home page based on your Skin's layout. Enter an RSS feed (e.g., for a Google Sci/Tech news feed enter http://news.google.com/news?ned=us&topic=t&output=rss, for a National Public Radio news feed enter http://www.npr.org/rss/rss.php?id=1019). RSS News feeds can be found on many websites and can be a source for your site, or use a web search. Save Skin Settings before leaving the Skins control.
Note: Pressero only supports UTF-8 encoded RSS feeds. Make sure you test your feed before using it on your site. There are many free feed validators that can be found online to help you do this. One of the major causes of site slowness is a bad feed. If you notice very slow load times on your site, check your feed or simply remove it to see if that resolves the issue.
Additional Skin Options
Show Your Company Logo (B2B sites only) - Optional and for B2B sites only. Uncheck this if you don't want your logo to display on your customer's website. Your customer's logo will still display.
For additional skin option details please utilize the links below that correspond with the skin name in question.
Skin Documentation
The following links will give specific details about each skin available with every Pressero site.
Responsive Skins
Standard Skins
Knowledge Base Articles Related to Skins