Cliptheme supports this item


388 comments found.


I have purchased your ClipTheme template, but I spotted a compatibility issue with Safari browser.

It has some really serious bugs while viewing the front page (I do not know about the other ones). For instance, it won’t display “Our Happy Clients” block at all, as well as it has some mispositioning of blue arrows (when on hover) on the “Take a look at some of our work” block images.

“Our Happy Clients” block won’t appear on larger screens (adding col-lg-3 did not fix the problem), but it still available on xs and sm screens.

Looking forward for your fastest response.

Kind regards, Artem

Yes, it worked, thanks a lot! But the animation in Safari is still kind of buggy… :(

let me see what we can do!

Hey there, we just checked your issue and you’re right, there is some struggling with Safari, which we will definitely fix in the next release, promised!

How do I integrate this template to a Visual Studio 2013 ASP.NET MVC5 project? Thanks in advance

Dear friend,

thank you for your message!

As you maybe already know, Clip-One is a html template, that is, you can use every single element in it, but the whole backside script work is basically your responsibility. Even evangelist microsoft has appreciated our product and has been easily using it with MVC5 and zero issues in the implementation. So I am pretty sure you will successful implement Clip-One as well. And appreciate it ;)



I’m having a problem with modal forms using your theme: event ‘shown’ is never fired.

I have tried to catch next variants of event without success: ‘’, ‘’ (as recommended in Bootstrap docs.), ‘shown’ and ‘show’

Using following code, the modal is shown but alert is never fired:

Eg.: // Ajax request for form wizard step 1

type: "GET",
url: "/post_wizard/",
.done(function(wizard_form) {
// Put result in modal and show it
show: true,
$('#my-modal').on('', function (e) {
alert("Modal shown event");

Any idea to fix this?. Thanks

Dear friend,

Thank you for your mail. I am afraid I am going to need some more information about your issue. If the modal is dynamically loaded and is not on the page, you should use a code like the following:

$(‘body’).on(‘’,’#my-modal’, function (e) { alert(“Modal shown event”); })

Obviously, I am not sure if this fixes your problem, as I said, some further details might help. If not, please make sure to show us a live example.

Let us know ;)

Dear friend,

You are right: the modal is dynamically loaded and the solution you point to, using ‘on’ for delegated events, fix it. Thank you very much for your quick and to the point answer.

Best regards

You are welcome :)


when i go to forgot password, i send the email to a file named recup.php and if the email dont exist i need to write a error on forgot password box. but if i do a header(location:login.php”); he goes to login box. how i do in header(location:....); to go directly to forgot password box?


Dear friend,

thank you for your message. In order to fix your problem we will apply some minor modifications to the login.js and the main.css file by using the query strings in the page URL. If we indeed insert a parameter in the page address, we can decide which form the user will visualize. For example:


Then we will give the variable BOX a register value. Through the login.js, we can thus show the registration form.

Now, please find below an overview of all the steps to modify the .js and .css files.

Step 1: open the main.css file (it is in the assets/css/ folder) and you will find the following classes on the line 2932 (provided that you did not add code before):

body.login .box-forgot, body.login .box-register { display: none; }

You should change it as follows:

body.login .box-forgot, body.login .box-register, body.login .box-login { display: none; }

That is, by adding the body.login, box-login classes as well as the feature display:none

Step 2: open the login.js file (you can find it in the assets/js chart) and modify the function runLoginButtons (by commentig out its content), provided that you did not add code before), with this code:

var el = $(’.box-login’); if (getParameterByName(‘box’).length) { switch(getParameterByName(‘box’)) {

case “register” :

el = $(’.box-register’);


case “forgot” :

el = $(’.box-forgot’);


default :

el = $(’.box-login’);




In order to get the code working properly, you'll need to create the function getParameterByName which will help you to read the query string value in the page URL. Here is the complete code of the function: 
var getParameterByName = function(name) {
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + name + "=([^]*)"), results = regex.exec(;
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));

Please refresh the page and empty the cache, so that you can run some tests. Here are some examples of query strings with relative results:

/login_example1.html?box=register : apre il form di registratozione /login_example1.html?box=forgot : apre il form di recupero password /login_example1.html?box=login : apre il form di login

Please let us know if it helps you and do not hesitate to contact us for further questions.

thank you. works fine!

you’re welcome :)

Dear, I’m using this template with ASP.Net project, now I have a problem with image uploader, how to assign file name to File Uploader control or “input:file”, to start upload from server side ?


Dear friend. Did you read my previous comment? Or did you already figure something out?

Anyway, in order to fix your issue, I would like to know if your problem is related to FileUpload. Is it the case? Thank you for your cooperation :)

so sorry dear,

hmmmm, I can’t start upload an image from server side “ASP.Net” without assign image name to file uplaoder control .

Dear friend,

ClipOne has two types of plug-in to upload the files: Multiple File Upload and Dropzone File Upload. You can find them in the section “form”. Which of these two are you referring to?

The answer to this question helps me to provide you a more precise and targeted support; on a project, for instance, I used Multiple File Upload, by assigning a name and a related description to an image.

I hope I made myself clear. Do not hesitate to contact me again for further questions or support. :)

Only one thing missing to be perfect, the news box (blog feed) and the Wheater box :-\

Oh well, it’s not gonna take long to walk all way through the road of perfection. ;)

The details you’re referring to will be implemented in one of our next releases. We will definitely keep you posted! Thank you for your great feedback!

Your welcome, one last question, is it possible in the theme to dynamicly duplicate a form? for example add same form dynamicly.

Hello again, dear friend!

In order to dinamically add a form or any other element, you can use the function .append() di jQuery. Here’s the link to the documentation:

Hope it helps ;)

Hi, a simple question before buying the template. Does it mean after I have gone through the purchase process I will be able to download the template which is a combine of html, css, javascript files in zip or whatever compressed format for my own use ?

Dear friend,

correct! as soon as you buy the extended licence, you’ll have access to all the (compressed) plug-ins of the template for your own use.

For further information, please visit the following link:;

By purchasing the template, you’ll also have access to a full customer & support service. So, if you have any problems or issue, you’ll just need to contact us.

I hope I answered all your questions.

Cheers :)

Super Awesome. Love it;

Thank you very much! Glad you like it

Great templates! I have a queston for the admin version: Is it possible to open the sub-menu (main navigation) when hovering instead of clicking?

Hello there, thank you for your message and great feedback ;)

Yes, it is basically possible, but you need to modify the “main.js” file (which can be found in the “assets” folder). Particularly, you need to replace the whole function runNavigationMenu at line 234, with the following one:

var runNavigationMenu = function () { $(’.main-navigation-menu’).addClass(‘open’); $(’.main-navigation-menu > li a’).bind(‘mouseenter’, function () { if ($(this).parent().children(‘ul’).hasClass(‘sub-menu’) && ((!$(‘body’).hasClass(‘navigation-small’) || $windowWidth < 767) || !$(this).parent().parent().hasClass(‘main-navigation-menu’))) { if (!$(this).parent().hasClass(‘open’)) { $(this).parent().addClass(‘open’); $(this).parent().parent().children(‘’).not($(this).parent()).not($(’.main-navigation-menu >’)).removeClass(‘open’).children(‘ul’).slideUp(200); $(this).parent().children(‘ul’).slideDown(200, function () { runContainerHeight(); }); } else { if (!$(this).parent().hasClass(‘active’)) { $(this).parent().parent().children(‘’).not($(’.main-navigation-menu >’)).removeClass(‘open’).children(‘ul’).slideUp(200, function () { runContainerHeight(); }); } else { $(this).parent().parent().children(‘’).removeClass(‘open’).children(‘ul’).slideUp(200, function () { runContainerHeight(); }); } } } }); };

Otherwise, if you have already applied some changes, you have to change a feature at line 236 $ as follows:

$(’.main-navigation-menu > li a’).bind(‘click’, function () { con $(’.main-navigation-menu > li a’).bind(‘mouseenter’, function () {

Please let me know if it helps ;)

Wow, thanks for the quick support – it works like a charm!

You are welcome! Can you support us and rate our theme with 5 stars, please? It would mean a lot! Thanks!

Hello, Looking to purchase this but wanted to confirm if single page application has been adopted in the admin template. Please confirm. Thanks.

Dear friend, Thank you for your message. As for your question, Clip-Theme is not a single page application.

I really hope it can be useful for your purposes anyway.

Cheers :)

I have an issue with search textbox on android chrome device, after touch the search text box, it’s not expanded. What should i do ??

Dear friend,

thank you for your mail. You’re right. we also detected the problem you mentioned and we have been already working hard to solve it. We will definitely keep you posted. ;)

Dear Admin Great theme, but could you provide this theme with different version of colors and interactions keeping the same HTML structure? Best Regards

Dear friend,

thank you for your message and positive feedback!

As for your question, In the right corner of the template demo, you’ll find a box called “style selector”. Here you can choose among several colors and also decide whether or not you want the theme “full-screen”.

Hope it helps ;)

thanks, i find it as you say.

It looks like the portfolio grid page in responsive it doesnt work well. starts appearing horizontal scroll in bottom because the size of image

Ciao Mauro, thank you for your message :)

As for your issue: please try to add to all the elements present in

<ul id="Grid" class="list-unstyled"> 

the following class: 


and see if works. Cheers ;)

oh, sorry, I forgot. You need to add the class above to all LI elements ok? ;)

hi, the next update will be this month?

Dear friend,

probably next week. We’ve been really working hard on it :) Stay tuned!

I’m developing with 1.3, what’s the best way to upgrade to 1.4. I am using the Form Wizard in my current project.


Dear friend, Thank you very much for you message and for the detailed explanation of your issue.

We replaced the function validateSteps in the file form-wizard.js (within the folder assets/js) with the following correct one:

var validateSteps = function(stepnumber, nextstep) {
        var isStepValid = false;
        if (numberOfSteps > nextstep && nextstep > stepnumber) {
            // cache the form element selector
            if (wizardForm.valid()) {// validate the form
                $('.anchor').children("li:nth-child(" + stepnumber + ")").children("a").removeClass('wait');
                //focus the invalid fields
                isStepValid = true;
                return true;
        } else if (nextstep < stepnumber) {
            $('.anchor').children("li:nth-child(" + stepnumber + ")").children("a").addClass('wait');
            return true;
        } else {
            if (wizardForm.valid()) {
                $('.anchor').children("li:nth-child(" + stepnumber + ")").children("a").removeClass('wait');
                return true;

Specifically we have changed the last step by adding the control if (wizardForm.valid()){...}

In cas you did not modify the file, you can also choose to replace it.

Please let me know if it works

Hello Great theme,

I need your help to have the theme selector closed by default.

Thanx in advance.

Hi there thank you very much!

As for your question, here’s the steps to follow in order to close the box:

1) in the DIV with ID “style_selector_container” remove the style attribute
2) replace the div
 <div class="style-toggle open" /> 
 <div class="style-toggle close" /> 

Hope it helps ;)

It works fine. Thanx a lot!

After New update (1.4) the script has new command called bootbox in the Table Export sample. But this command is not defined… :confusedsad: How can we fix it??

New update(1.4.1) was the quickest solution :P

May your hands never see any trouble. Thank you… :)

Given that your name is KingZeus, it really is a great compliment! Thank you and enjoy your theme!

There seems to be an issue with search input in the header. When using a smaller phone (Samsung S4 mini in my case), when you click on the search input it expands, the phone keyboard appears, then contracts a half second later, and phone keyboard disappears. It’s not doing it in any emulators that I found, but it is doing it on several different models of phone that I have tested. The following link is the one used to test on phones.

If it helps, I have found that if I click on any other text field first, then click on the search, it works just fine. This is using Chrome on Android 4.4.

A quick temporary fix for this is to change the styles for the input so that at no time is the display set none, or the width set to 0px. It still has a little spasm when you click on it (it expands and contracts for a quick second), but at least the keyboard remains up and they can perform a search.

Hello dear friend, thank you for the detailed message!

You definitely have a keen eye! Thanks for your observations, we have been already working to fix the problem! :)

Here I got another failure :(

While editing table how can I integrate input-mask-phone / money etc

Ouch, sorry to hear that. Let’s see what we can do:

you can integrate the input-mask into the editing table by following these steps:

1. on the page of the editing table, add the reference to the plug in jquery.maskedinput
<script type="text/javascript" src="assets/plugins/jquery.maskedinput/src/jquery.maskedinput.js"></script>

2.then, open the file table-data.js (which you can find in the folder assets/js) and, in the function “editRow”, assign the desired input mask to the inputs present on the line.

Here’s an example of my “editRow” function:

function editRow(oTable, nRow) {
            var aData = oTable.fnGetData(nRow);
            var jqTds = $('>td', nRow);
            jqTds[0].innerHTML = '<input type="text" class="form-control input-mask-date" value="' + aData[0] + '">';
            jqTds[1].innerHTML = '<input type="text" class="form-control" value="' + aData[1] + '">';
            jqTds[2].innerHTML = '<input type="text" class="form-control" value="' + aData[2] + '">';

            jqTds[3].innerHTML = '<a class="save-row" href="">Save</a>';
            jqTds[4].innerHTML = '<a class="cancel-row" href="">Cancel</a>';



after having added the class “input-mask-date” to the input, you’ll need to start the initialization process of the plugin with the code line at the end of the function.


Anyway, you can find an example of all the input-masks on the form elements page within the clipone’s form menu.

Let me know if it works and if there’s something else we can do for you. Cheers. :)

Yeah, it was my mistake, I ve forgotton to put $(’’).mask in the function
As I said before
May your hands never see any trouble. Thank you… :;

ahahahaha thanks pal :)

Can you tell me where to edit the Form Validation files? Example if I want to change what is rendered back when something is not valid? Thanks for your help.


hello dear friend,

Here’s for you an example of Form Validator:


rules: {
                firstname: {                    
                    required: true
messages: {
                firstname: {                    
                    required: "error message" 
submitHandler: function () {



Replace the class #form with the ID you assigned to the element form, within the field “rules”

rules: {
                firstname: {                    
                    required: true

Then you can assign the type of control you would like to apply to every input. As you can see in this example, I work with the field “firstname” which is mandatory. In the field “messages” you can now associate the field through the name of the input.

messages: {
                firstname: {                    
                    required: "firstname required" 

For every field, you can now assign the relative message in “rules”. In this case I assigned a message for the field “firstname”.

If in
submitHandler: function () {


all the fields work properly, you can now insert the information related to what happens in the forms submit.

Hope everything’s clear. For further help, just contact us!