Page layout

This article describes additional features and tricks used in this template.

One page layout

If you want to achieve the one page layout you should use for the specific page suffix onepage in the template settings. Then all modules on the bottom1-2 will be displayed with the 100% width. Additionally you can use suffix greybg to achieve the grey background in the selected modules.

Menu

For the bottom1 module position we have prepared special feature which adds unique ID for every module using the following schema:

#gkBottom1-X

Where X is a number of the module. Then you can create menu with anchors to the specific blocks of the website.

We recommend to prepare two template instances - one for the frontpage and one for the rest of subpages. Then you can specify differents main menus for every template instance.

Scroll animations

The template contains the animation system based on the scroll event - some page elements can be displayed after scrolling the page to the specific point.

The animation engine uses two types of animation:

  • Single animation
  • Animation queue
Single animation

You have to add class animate to the element - the class loaded will be added when the user will scroll the page to area with this element.

Animation queue

You have to add class animate_queue to the container with the elements which have class animate_queue_element - then these elements will be animated one after another with delay 100ms.

Nuestros productos

The ideas tree

25-05-2013 Hits:1425 Productos  - avatar Super User

The ideas tree

Maecenas interdum tortor quis tellus facilisis varius. Donec sollicitudin lorem vitae enim iaculis quis feugiat elit pellentesque. Fusce congue rutrum lorem sed dignissim. Suspendisse id metus ac risus imperdiet ornare...

Read more

Producto 1

25-02-2013 Hits:1248 Productos  - avatar Super User

Producto 1

Maecenas interdum tortor quis tellus facilisis varius. Donec sollicitudin lorem vitae enim iaculis quis feugiat elit pellentesque. Fusce congue rutrum lorem sed dignissim. Suspendisse id metus ac risus imperdiet ornare...

Read more

Producto 2

25-01-2013 Hits:1217 Productos  - avatar Super User

Producto 2

Maecenas interdum tortor quis tellus facilisis varius. Donec sollicitudin lorem vitae enim iaculis quis feugiat elit pellentesque. Fusce congue rutrum lorem sed dignissim. Suspendisse id metus ac risus imperdiet ornare...

Read more

Flowers Wallpaper

23-01-2013 Hits:1214 Productos  - avatar Super User

Flowers Wallpaper

Maecenas interdum tortor quis tellus facilisis varius. Donec sollicitudin lorem vitae enim iaculis quis feugiat elit pellentesque. Fusce congue rutrum lorem sed dignissim. Suspendisse id metus ac risus imperdiet ornare...

Read more