Documentation For O-two - App Landing Template

One page template | by Puls theme

General information

Theme Version: 1.0.0

Created: 2 February 2015

Done by: Black Joker


Thank you for purchasing our template. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

After you extracted the package, go to /html directory, choose any layout you want, and then choose the color scheme whether it's light or dark, and last, choose whether you want to have background video or background image on your hero section. Upload all the files inside to your hosting's. Done!


O-TWO has 4 predefined colors. Now for changing your suitable color Check the part in your index.html file and add the style file css/color_*.css and you are ready.make sure to add color.css under the style.css



Inversed Color Section

You can add section-inverse:before class to inverse the font color and background color of a section.

O-TWO comes with three different ui style, here is the brief how to add it on your project.

ui leaf

this shape has three pre-define size to use . if u want to change your shape size just add the calss icon-xs,icon-md,icon-lg as your need.


ui circle

this shape has three predefien size to use it add icon-xs,icon-md,icon-lg as your need


ui hexagon

this shape has three predefien size to use it add icon-hex-xs,icon-hex-md,icon-hex-lg as your need


In the video section, you can embed external video either from youtube or vimeo. Check on the index.html, you can see I have included 2 methods of embedding video from both youtube and vimeo. All you need to do is changing the video ID which is taken from the video page URL.


The subscription form is integrated with Mailchimp mailing list. So you need to have an active Mailchimp account and create a list first. And then check the /assets/subscribe-mailchimp.php file, you can see some configurations which you need to fill correctly.

                            // Authentication
                            $api_key         = '6a3e3b066db19f2faa58606fc18cd4a7-us10'; // Find on your Account Settings > Extras > API Keys
                            $list_id         = 'dc95be41eb'; // Find on your List > Settings
  • API Key: Go to your Account Settings > Extras > API Keys, you might need to create an API key first.
  • List ID: Go to your list, and then Settings, you can find the list ID on the page.
  • You can customize the error and the succcess messages.


  1. Modernizr — FHTML5 and CSS3 features detector.
  2. parallax.js - jQuery plugin for parallax effect
  3. wow.min.js — Reveal Animations When Scroll
  4. Owl carousel — Touch enabled jQuery slider.
  5. tweetie.js — A simple Twitter feed plugin
  6. jquery.nav.js — jQuery One Page Nav Plugin


  1. Twitter Boostrap — Front-end framework.
  2. Font-Awesome — Icons used in the template.