SmartTemplates supports this item


388 comments found.

great template

I am a bit new to blogging, how do i populate the blog section with my own content?


Hi J,

This item is in HTML/CSS category as you can see. So all content is static, no database, no CMS (content management sistem). You will need to add content using an HTML text editor.

Or integrate the template into a CMS and add post dinamically. If not you must add posts like static text.

This is how all HTML/CSS templates are.



Good Job, Great Mobile Theme Thanks ;)

Thank you too :)


I have purchased your template. I cannot scroll down when I have larger than screen content inside a toggle_wrap.

for example… <div class="toogle_wrap radius8"> <div class="trigger"> <a href="#">Sales Department</a> </div> <div class="toggle_container"> <!-- start employee --> <div class="portfolio_item radius8"> <div class="portfolio_image"> <img src="images/portfolio_thumb.jpg" alt="" title="" border="0" /> </div> <div class="portfolio_details"> <h4>Employee Name - Job Title</h4> <p>Employee Bio...</p> </div> </div> <!-- end employee --> <!-- start employee --> <div class="portfolio_item radius8"> <div class="portfolio_image"> <img src="images/portfolio_thumb.jpg" alt="" title="" border="0" /> </div> <div class="portfolio_details"> <h4>Employee Name - Job Title</h4> <p>Employee Bio...</p> </div> </div> <!-- end employee --> <!-- and do on.. --> </div> </div>

It opens, but I cannot scroll down.


Still not working… Could you try adding 6 or 7 of these inside a toggle container and show me the demo URL – I will then look at your code and see how to make it work for me, thanks !!
<!-- start staff member -->
 <div class="portfolio_item radius8">
     <div class="portfolio_image">
        <img src="images/portfolio_thumb.jpg" alt="" title="" border="0" />
     <div class="portfolio_details">
         <h4>Staff Name - Job Title</h4>
         <p>profile Bio...</p>
         <a href="images/portfolio_thumb.jpg" class="swipebox view_details" title="More">full profile</a>
<!-- end staff member -->


Here is the TEST URL I am doing with your code. Works great to me. I can post a video also if you want on how it looks and works on my mobiles.

PS. Check the new archive available for download. It contains 3 new dsign skins and js updated files.


works great thanks !!

What is the minimum android OS version required to run this template?


Depends on the mobile more than the OS version.

I guess all Android versions got support for javascript and jquery.

If your mobile have js enabled, and at least 320 px viewport must work fine.

But considering the variety of mobile models in our days, the best way is to give it a test. Just test the online version.


i love the style ! Very nice theme :)

Great template! Would it be possible to display external page (for example Facebook mobile) inside of template (with header on the top)?


No you cannot include that. I did not test that, but I don’t see how it can works.

The template layout must be build following a specific structure. The external pages are diferently build in their structure.

And all content added, if is from an IFRAME for example must be responsive and scrollable.


for the contact form we must need a .php file? phonegap doesnt support php files so how to make the contact form work with phonegap?

for the contact form we must need a .php file? phonegap doesnt support php files so how to make the contact form work with phonegap?


To make the form sending messages you will need php. I can create the contact page .html and include the php with jquery from an external file, but not sure if it will not create the same thing.

If phonegap does not support php at all, just remove the form, and try to add a link in the contact page with

<a href="">Send a message</a>

And try to see if mailto: function works on mobile to open the native app for sending emails. Basically try to use the mobile sending email function. Not sure but see if it works.


I tried your new Code.js and Load.js which worked for one time and now has seemed to have stopped? Any chance of the new files being uploaded. i installed the current ones but they were actually still the old ones that do not scroll with the drop downs….Its becoming a little frustrating as i am using the same dropdowns on 11 pages and cannot progress until it is fixed. Your help would be greatly appreciated :-)


I think the dropdown not returning to the size he was before expanding is caused by the content you add in the toggle. Got nothing to do with the js code I have updated.

Does that happens also on our demo url ? Or only your customized content?

PS. The archive is updated. You can dowload the new files. I have also added 3 new design skins.


I fixed it by loading the google JS API first at the bottom where the JScript calls are made. The dropdowns now work and so does the map :-)

Glad you found a solution to use that map.

Yes all js code is recomanded to be loaded at the bottom.

But do you still use the jquery twice? I think it will work also used once.

Regards. how i can hide this ? this show when i hold icons before execute click event’s and go to #link

this error only on : “default browser” on Android mobile Mobile Note2

i fix it using -webkit-tap-highlight-color: rgba(0,0,0,0);

Thank’s Good Job,it’s Great template


Glad you fix it. Thanks.

NEW UPDATES (3 jan 2014)

1) 3 new designs added

use your mobile to test them, or in Firefox use Ctrl+Shift+R for responsive mode, and set it to 320×480

Splash page

Gradient style

Slider home

2) Fixed the bug in the javascript files when using toggles with big height content

Read the HELP file under the section “Using toggle with height content on pages” for more details

@mofakfree I included the fix in style.css but it didn’t work for me, still it leaves the same problem.

Try to use the below solution

{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }

it’s ok now …...... i use this for hidden “blue select over text and image” and prevent select text
* {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);

How can we create a loading progress or show loading image before finish download all object and script file ?


There are multiple solutions to add a preloader. The best one I guess is one build with jQuery.

I will try on my next update to this template to add a preloader also.

But remember if using the theme with iphone , saving the page as home screen app, will automatically load the full website when is launched.


Splash page is awesome for a project i am working on where i can now require user permission to continue prior to main menu. Thanks!

The dropdowns if used with sufficient text or content do not contract if the text expands below the screen. They expand fine. But do not contract… have you tried the dropdowns with 20 lines of text or so with only dropdowns and no buttons below? I also have 3 on top of each other. Maybe i have it wrong?


Yes I have tried using toggles with a bigger height content.

Here is the TEST URL I am doing with a bigger height in one toggle in About section.

Please use the updated archive, and refresh your js code. I have improved the code a few days ago.


Thanks… that fixed it..

Pre buy question:

Can I use the template for load external url pages?

I have a web and i need a theme for load it into mobile design in a container

And can I pack with phonegap the result? Because with phonegap external links are different in android and ios for load content into the same window.. THANKS


You cannot load external url pages. I am not sure why you want to do that. All pages/content you want to add must be responsive. The template does not behave like an iframe that loads external pages. In HTML you can do that by using the IFRAME code. But this is not the main purpose of this template.

I do have some users that are working on implementing the theme with phonegap. I think they succeded. The only thing they asked me to provide is a custom contact form that is not in php (loading a php code from an extra file). I can provide that custom form to you too, if you want to use phonegap. I peronally did not test the theme with phonegap, only some users that got the theme.


I have purchased and changed the colors a bit. It looks and works fantastic!

One question: I would like to add a link: “classic view” so visitors can go back to the desktop version if they prefer. How can I change the detectmobilebrowser.js to allow it to do that? (At the moment it obviously) switches back to mobile) Thanks in advance!

Hi, thanks :)

I don’t think javarscipt can send a variable to your desktop website. Seen some methods but not sure if one of them works.

So the easiest way is to duplicate your main home page, and redirect to the copy of it. And in that copy not to add the redirect js code.

If it was php, it would be easy.


Could you please look at – great theme, except it does not scroll down and stay down – it keeps returning to the top; your advice would be very much appreciated!


I think there are some code modifications there that are causing that. You modified the HTML code. Did you use the section ID’s corectly, in HTML and in js code also? Try to follow again all the ID of the sections and see if maybe something was wring added. The slide should work fine.

Also try to update the js files, especially code.js and load.js I have made some important updates to the files. And try to see what did you add extrat to those files before changing them.


thanks for the reply – fair enough!

Could you please add a menu icon/function for the header bar. Would make this perfect!


I guess you want to hide it when you are on a page section? Or showing when you are on the menu section?

I really don’t want to add that header bar on home menu section. It looks too good without it.

Maybe pull down gesture to show that header will be nice. Will see in the next update if it’s worth adding it.



I have uploaded a demo site to a url. Is there a way have a refresh button somewhere in the html, or better still whenever the app/site is loaded it automatically refreshes in case of new information contained within the content please? For some reason on IPhone i still see old info as it is not being refreshed, and unlike a native app there is no auto-refresh if you pull down on the screen and let go…


But on your iPhone you did not launched the theme from your home screen. If yes at the begining each time the new content is loaded.

Maybe if tested in browser you need to double refresh to see the new content. But launched as an home screen web app will load the new content each time. You can see that when it’s showing that home screen loading image.

Will study the pull to refresh function and see if it worth adding it to the theme.


@ASmiles I am also looking for this feature, some how author can integrate pull to refresh for each slide so the dynamic content is reloaded/refreshed.


Will see on the next update of this item if it’s worth adding that function to the theme.