Introduction
The Instauro theme is based on the new popular Flat Design. It was created to be a Coming Soon Page and/or Maintenance Page, so its suits the purpose of a one page website, which attract and keeps the visitors on the site.
The theme can be divided into two main parts. The first one (the board) was inspirated by an Open and Close Sign to attract the users attention and contains the basic informations, like a Title, Short Description, Countdown Timer, Social Links and a Subscription Form. The Subscription Form has a validation to avoid false subscribers, if the subscription is going well than the board flips with a smooth and realistic validation.
The second part of the theme contains the Social Timeline. Here you can show your Facebook posts and Twitter feed on a time line. This ensure that you visitors can check your activity here and doesnt have to navigate to your social page, and probably ensure a subscription.
Features
- Facebook wall and Twitter feed implementation (optional)
- Ajax subscription form with validation (optional)
- Flat design with multiple colors
- Social media links (optional)
- Countdown timer (optional)
- Beautiful CSS3 animations
- Responsive desing for Mobile / Tablet
- Simple admin page for subscriber management (export functionality)
- Easy configuration
Settings
0. Login and Database
For the proper and good functionality a database is needed. You can configure this in the settings.php
at line 12
. For the admin page login you can set a username
and a password
at line 6
1. Background image
To change the background image just upload the new image into the upload folder and change the name in the settings.php
at line 24
2. Table header
To change the background color modify the color in the settings.php
at line 30
, you can also modify the back header at line 31
3. Countdown Timer
To enable the countdown modify the line 38
in settings.php
and choose a date
4. Social links
To enable a type of social link just fill up the required details in the settings.php
at line 51
the link is required
5. Facebook wall
To show your facebook pages wall posts, first you have to create a facebook application. Start by visiting the App Dashboard. If you haven’t created an application before you will be prompted to register. Note that you have to verify your Facebook account to create apps on Facebook.
We only need the Facebook Page ID, App ID and App secret, so if you allredy have an Application for your page we can use that and no need to create a new Application. You can get the Page ID if you browse to your Facebook Page and copy the link part after facebook.com/
. For example our Facebook Page link is http://facebook.com/minicstudio
so our Page ID/name is minicstudio
.
After you achived the information what we need you can modify the settings.php
at line 109
to enable the Facebook Wall posts.
6. Twitter
To show the Tweets of your account we need to get the username
, consumer key
, consumer secret
, access token
and access token secret
. After you have the information what we need you can edit the settings.php
at line 120
to enable the the Twitter feed.
7. Colors
To change the colors of the template modify the line 138
in the settings.php
. Available colors are: turquoise, green-sea, emerland, nephritis, peter-river, belize-hole, amethyst, wisteria, wet-asphalt, midnight-blue, sun-flower, orange, carrot, pumpkin, alizarin, pomegranate, concrete, asbestos
Credits and Source
Fonts:
- Mr Dafoe, Lato fonts: Google Web Fonts – http://www.google.com/fonts/
- Elusive Icons is a webfont that can be used with any of your projects. Bootstrap-based, Foundation-based or even your custom projects! – http://shoestrap.org/downloads/elusive-icons-webfont/
- GSAP: Business Green commercial license – http://www.greensock.com/club
- jQuery: Fast, small, and feature-rich JavaScript library. http://jquery.com/
- jQuery Countdown: A jQuery plugin that sets a division or span to show a countdown to a given time. http://keith-wood.name/countdownRef.html
- moment.js: – Javascript date library for parsing, validating, manipulating, and formatting dates. http://momentjs.com/docs/
- Modernizr: Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser. http://modernizr.com/
- QueryLoader v2: It serves the main purpose of preloading the images on your website by showing an overlay and a loading bar. https://github.com/Gaya/QueryLoader2
Updates
Version 1.1 – 12 July 13Added HTML files
Version 1.0 – 11 July 13Initial release
No comments:
Post a Comment