Search Descriptions Version
 
 
This article applies to:

Responsive Design Template - Installation Guide


This guide is intended for installation on the 9.4.0.0 version. The Bootstrap skin is included "out of the box" in versions 9.4.1.0+. Although the Foundation skin can be installed successfully on 9.4.1.0+, a few special considerations are required.

Before You Begin

This installation process will replace your existing primary skin with a new one (Bootstrap or Foundation), which you will need to tailor to your specific site (replace the logo, tweak content and colors, etc).

The install should be done on a test site first, and then moved to the live site once you are happy with the adjustments you have made. If this installation is done directly on your live site, the site will lose your branding until you make those changes.

  • In order to safely complete this installation on a live website you need to be able to back up your site files and database, and have a plan and permission to restore them should you encounter a problem during the installation process.
  • Different hosting providers and environments will have different methods of backing up and restoring databases. Please work with your hosting company to discuss the backup and restore tools that are available to you.
  • This installation process requires a level of technical expertise.
  • Please read through the entire installation guide and make sure you understand the installation process before you begin an installation on your live site. If there are any steps of this installation process that are unclear, please contact AspDotNetStorefront support to request assistance.
  • Before you begin please ensure that:
  • You have file access to the root of your website (FTP or RDC are the most common).
  • You have SuperAdmin Access to your AspDotNetStorefront site.

Installation

  1. Backup your database and your website's files. This is important so that you can restore your website if you have any trouble.
  2. Find your current skin id.
    1. Login to the admin console and navigate to Configuration > Store Maintenance.
    2. Click on the domains tab
    3. Click on the store whose skin you would like to replace and make note of the skin id selected in the Skin ID dropdown.
  3. Now connect to your website either with FTP or a remote connection.
  4. Copy the contents from the installation folder into your website:
    1. Move the Web/App_Templates/Skin_X folder to the /App_Templates folder on your website.
    2. Move the Web/App_Themes/Skin_X folder to the /App_Themes folder on your website.
    3. Move the following files up to the /XmlPackages folder in the root of your website:
      • Web/XmlPackages/entity.responsive.xml.config
      • product.responsive.xml.config
      • responsiveinstall.xml.config
  5. Rename your old skin folder from step 2 above to the next available skin id in both your App_Templates and App_Themes folders
    1. Locate the skin folder that you found in the admin console.
    2. Rename the old skin to something else such as the next available skin id. For example rename it from Skin_1 to Skin_3 if Skin_3 is available.
    3. Make sure to do this in both the App_Templates folder and the App_Themes folder.
  6. Now rename the new skin from Skin_X to the skin number you are replacing.
  7. Navigate to the website in your browser and make sure that you are logged in as an administrator.
  8. Navigate to the installer page by going to http://www.yourdomain.com/e-responsiveinstall.aspx in your browser. This page is on the front end of your website, not the admin console.
  9. Choose among the different installation options.
  10. Click the Begin Installation button. You should see a success message.
  11. Reset the cache in the admin console.
  12. Remove the responsiveinstall.xml.config xmlpackage from your /XmlPackages and /App_Templates/Skin_{Your Skin ID}/XmlPackages folders. It is no longer needed.
  13. Installation is complete.
NOTE: If installing the Foundation skin on versions 9.4.1.0+ you will need to copy the \App_Themes\Skin_3\base.css file from the built-in Bootstrap skin into your Foundation \App_Themes\Skin_#\ folder in order for certain styles to display properly.