Now that you've installed Mocha, it's time to learn all about what this powerful theme offers. In this tutorial, we'll go over all the essential features you need to know about.
Demo Video Tutorial
The following video tutorial will go over:
Mocha comes with a series of header types, which are also called page types because they define the entire page layout, not just the header.
These pages listed above are fixed, pre-built page layouts. However, you aren't forced to use them. You can create your own header types and page layouts by using Page Builder in Mocha (be sure to read instructions on how to use Page Builder).
Header Slideshows. 3D Parallax. One-Page Scrolling. These are all features included in Mocha that aren't available in default Weebly themes. We've given these features our own names. For example, Mocha's Header Slideshows are called PureSlider. Mocha's 3D parallax are called TrueDepth Parallax. The Mocha OnePage scrolling feature is called ScrolliPage.
These are proprietary solutions developed by Luminous specifically for use in Weebly. While these features seem simple, the code that we've written is very sophisticated, using techniques such as hardware acceleration to deliver an exceptionally smooth performance.
What's the difference between Mocha's Parallax and the default Weebly parallax? There are many differences. For starters, the default Weebly parallax isn't really parallax at all. Parallax is defined as the background image moving at a slower pace relative to the rest of the page, when scrolling. This is what creates the immersive "depth" experience. Weebly's parallax implementation is just a fixed background image that doesn't move. Mocha's parallax, however, actually modulates background images that move at a slower pace. Furthermore, Weebly's parallax does not work on mobile. On mobile devices, the Weebly parallax sections are just...a blurred static image. Our TrueDepth parallax, however, work flawlessly on both mobile and desktop. Given that 70% of internet users today are on mobile, this is an important thing to keep in mind!
Please see the video above for a tutorial on how to use these specialty features with Mocha.