The table below lists which skin must be applied to the page in order to page the page responsive to mobile users. Please note that the pages listed and the controls on each page may not match your site exactly; these are the pages that are setup in base. While the pages on your site may differ, you must apply the recommended skin in order for the page to be responsive to mobile users. For example, your My Account landing page may not include the "My Subscriptions" control; however, the Host: PersonifySkin-left-main-right-responsive skin must be applied to the page in order for it to be responsive to mobile users.
Skin |
Page to Apply Skin |
Details |
|---|---|---|
PersonifySkin - onecol-responsive |
Any |
This is a one column skin.
Additional configuration is required for the Product Detail control. For more information, please see Configuring the Responsive CSS for the Product Detail Page. |
PersonifySkin - index-responsive |
Login |
This is a one column skin.
Additional configuration is required for the Login Request control. For more information, please see Configuring the Responsive CSS Login Page. |
Personifyskin-left-main-responsive-account |
Any |
This is a two column skin.
The base Name and Demographics page is delivered with the following controls placed on it: Name and Demographic. If you want these two controls to display side-by-side, you must add them in the "Half Top Left" and "Half Top Right" panes. |
PersonifySkin-left-main-right-myaccount |
My Account home page |
This is a three column skin.
The base My Account page is delivered with the following controls placed on it: My Contact Information, My Meetings, Membership Summary, My Subscriptions, and Order Balance. If you want to set up a home page like this, you must use this skin. |
PersonifySkin - listing |
Membership Listing |
This is a one column responsive skin. |
PersonifySkin - index-store-responsive |
Online Store landing page |
This is a two column responsive skin where the left column is smaller than the right column.
The base Online Store landing page is delivered with the following controls placed on it: Search, Marketing, and Navigation Bar. Additional configuration is required for this page. For more information, please see Configuring the Responsive CSS Online Store Landing Page. |
PersonifySkin-product-listing-responsive |
Full Product Listing |
This is a two column responsive skin where the left column is smaller than the right column. The controls that are dropped in the left column of the page are suppressed to mobile viewers; only the controls dropped on the right column will display to mobile viewers.
Additional configuration is required for this page. For more information, please see Configuring the Responsive CSS for the Product Listing Page. |
PersonifySkin - cart |
Shopping Cart |
This is a two column responsive skin where the left column is larger than the right column.
Place the Shopping Cart control in the left column and in the center column, place Shopping Cart Summary control above the Shopping Cart Savings control. |
PersonifySkin -join1-responsive |
Thank You |
This responsive skin should be used for the Order Summary and Checkout Thank You controls. |
See also:
· Making a Page Responsive Using the CMS DNN
· Making a Page Responsive Using a CMS other than DNN