Hi Ashian,

To implement a design like the one you linked I would create the skin just like usual, but when creating the menu items I would provide full URLs, with hash values at the end to indicate anchors that a script on the page could read to determine which "page" to move to. So you'd create your pages with URLs like http://www.example.com/#home, and http://www.example.com/#firstgallery. Then when you create your content markup you'd wrap the contents of each block in a div with an ID to match, so id="home" and id="firstgallery". Next you'd set your JavaScript to iterate through the menu items and add an event listener for click events to each, which would run a function that pulls the hash value out of the link URL and searches the page for an element with a corresponding ID, and then runs your animation or scroll function to bring that content to the forefront for the end user.

Hope this helps.

Hi Ashian,

In our theme.skin within the skin, we define the outerwrap to use an html5 <section> element, like this:

<portal:OuterWrapperPanel runat="server" 
    RenderContentsOnly="false"
    CssClass="outerwrap"
    RenderId="false"
    Element="section"
/>

Then we add module-specific classes via the "Custom CSS Class" module setting, and those classes are applied to the outerwrap. In this case, we added the module as usual, then clicked the "settings" link, found the input labeled "Custom CSS Class", and typed in "main-banner has-banner-icons" as classes specifically for the home page banner module - this allows us to use the simple HTML module but produce many different kinds of styles/layouts with it.

Hope this helps!