The Mobify Bundle

The Mobify bundle is a set of files that transforms your site’s layout and performance for mobile.

A. Introduction to the Mobify Bundle

The Mobify Bundle is comprised of:

These components are described in greater detail in the following sections.

Sass Read more about Sass in our Introduction to Sass guide.

User Interface JavaScript Read more in our Add User Interface JavaScript tutorial.

B. The Router

The router analyzes the current page to determine its page type. Then, it loads the corresponding view file for that page type.

Router Read more about the Router.

C. Views

Select and transform content from the original page in your views. This is a way to store content from the original page and to then re-use this content on the mobile version of the page.

The content is stored in the page context. Later, the content is called in the templates.

Views Read more about Views.

D. Templates

Templates define the layout of your page on mobile. Use the content that you selected or transformed in the corresponding view to build the layout for the page using the template.

Templates Read more about Templates.

When you create a bundle, the router, views, and templates are compiled into the adaptive.js file.

This is the main file that runs on your visitors' devices. Also, the bundle file provides instructions on how to transform the page for mobile.

Edit in GitHub