275 comments found

Hello again , :) I need help collapsing programmatically the main navigation . I’m implementing partial html loading, & i want the navbar to close when the html is loaded. It gets crucial on mobile, as the menu is expanded over the whole screen and the user have no clue that the page has loaded.

Regards;

Cliptheme

Hi there!

first of all, sorry for the late reply. This is a crazy period :)

So, I am definitely going to need further information related to your issue.

In particular I am not sure what you exactly mean by “implementing partial html loading”.

The more precise you are the more likely we are finding a solution to your problem.

Thank you for your cooperation :)

Can you provide the PSD’s?

Cliptheme

Oh sorry :( a PSD version is not planned any time soon.

We hope you can enjoy the several functions of our theme anyway ;)

I am trying to use the Horizontal menu version, but I notice that the Menu item font and size is different. I am trying to mimick the vertical menu as much as possible to the horizontal, I have managed to match the colors to the vertical version – can you help me as to where I need to modify the font/font size and adding the clip menu item icons for the horizontal menus please.

Cliptheme

Hello there,

thank you for your message :)

In order to modify the menu,you will need to intervene on the main.css file (which you can find in the assets/css folder): Specifically, you will need to modify the line 1374, where the horizontal menu class is present. The whole style of the horizontal menu also starts from there, so here is basically the key to fix your issue.

Let me know if it works and just get back to us for further support.

Default-user

I have seen this CSS class and I have tried to manipulate it before, hence the initial question. From here, can you tell what I need to modify to get the Font of the menu items and colors to match those of the vertical menu please.

Cliptheme

In order to have a menu just like the vertical one, you will need both to modify the css and the html code, by adding the relative icons next to menu items.

Let me know if it works :)

Hi,

I have installed the theme, but everything looks backwards compared to the live demo. As an example, my login form has text that is not displaying correctly. For example:

Instead of “Forget Password?”, it shows ”?Forget Password”. This is similar across all aspects of the theme.

Furthermore, I’ve noticed the main navigation is on the left side of the screen instead of the right side. When looking at the HTML, it appears this is caused by the same issue.

Any idea how to fix this?

Thanks!

Cliptheme

Hi there,

thank you for purchasing our theme!

As for your question, our theme supports two versions: the standard one (which you can read from left to right) and a second version (which you can read from right to left, take a look: http://www.cliptheme.com/preview/admin/clip-one-rtl/).

So, first questions: What is the version you are currently using? Did you check whether the feature css direction: tr and non direction: rtl. was correctly applied to the tag body?

Let’s start from here and see if we can fix this. Shouldn’t you find a solution, just get back to us ok? ;)

I see that my purchase comes with a license for Revolution Slider. Is there a way for me to get the most recent version (4.6.4) of that product?

Cliptheme

Hello there! yes, definitely and not only for you. You will definitely find the updated version of revoultion slider in our next release! :)

Default-user

I look forward to it. Thank you for taking the time to reply!

hello,

i purchased this theme but after including the following JS files, the menu on the left or any other animation stops working:

script(type=’text/javascript’, src=’/lib/angular/angular.js’) script(type=’text/javascript’, src=’/lib/angular-cookies/angular-cookies.js’) script(type=’text/javascript’, src=’/lib/angular-resource/angular-resource.js’) script(type=’text/javascript’, src=’/lib/angular-route/angular-route.js’)

//Angular UI script(type=’text/javascript’, src=’/lib/angular-bootstrap/ui-bootstrap.js’) script(type=’text/javascript’, src=’/lib/angular-bootstrap/ui-bootstrap-tpls.js’) script(type=’text/javascript’, src=’/lib/angular-ui-utils/ui-utils.js’)

Cliptheme

Hello!

thank you for purchasing our theme.

In order to investigate your issue, I may need a complete sample page. Could you please attach it here or send us to support@cliptheme.com ?

Thank you for your cooperation :)

Hey All, to fix the issue of the dropdownHover exception, running on chrome browser, this is happens only on touch screen enable screen, and is because of bootstrap not initializing the dropdownHover on touch enable screen. the workaround would be to patch the main.js of clipone adding on line 60: if (‘ontouchstart’ in document) { isMobile = true; body.addClass(‘isMobile’); }

Cliptheme

Hello there! thank you very much for your hint! :)

We really appreciate your suggestion and we’ll make sure to add this correction in one of our next releases :)

Hi.

Just wanted to let you know that the bootstrap date picker that you are using on this template is using bootstrap version 2… But they already have a bootstrap 3 version!

https://github.com/eternicode/bootstrap-datepicker
Cliptheme

Hello Rodrigo,

thank you very much for your hint!

Acutalli, we have already been thinking to update the plug-in by clipone’s next release. So, it’s just a matter of time ;)

Default-user

Hi, again. The “bootstrap-switch” plugins also needs to be update to the bootstrap 3….

Make sure you update All plugins….

Thanks.

Cliptheme

we definitely will!! thank you!! :)

Great theme! I need help increasing the height of the fullwidthbanner. I tried playing around with CSS and JS but no luck. Image height needs to be at least 862px. Revolutions slider documentation did not help.

Cliptheme

Hi! thank you for your message and for choosing our product!

As for your issue, this link may help you to fix it. Take a look:

http://stackoverflow.com/questions/13202867/fixed-size-of-flexslider

If you keep having troubles though, just get back to us. We will figure something out! ;)

Good Luck!

Hello, Before I purchase i want know; can i remove responsive or not ?

Cliptheme

Hello, thank you for your message.

You can certainly remove the responsive from the theme, but you may want to know that this requires a hard work both on the css and on the html. First you’ll need to disable bootstrap’s responsive like shown in the official guide:

http://getbootstrap.com/getting-started/#disable-responsive

Then you’ll need to change our css files by removing the media queries.

It’s a little complicated, definitely not impossible.

Good luck :)

Hi,

I’m trying to reuse the form styles inside of a modal, but the spacing between the form-group divs is not working as expected (i.e. all inputs in the modal have no padding/margin). Ideally, I do not want to write any new CSS in order to accomplish this task. Do you have a quick fix for how I can update this?

Thanks!

Thanks!

Cliptheme

Hello user, thank you for choosing our theme!

your issue sounds a little odd, so we have developed a plain log in form in a modal window. Take a look at the code:

<div id="responsive" class="modal fade" tabindex="-1" data-width="760" style="display: none;"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> × </button> <h4 class="modal-title">Responsive</h4> </div> <div class="modal-body"> <form class="form-horizontal" method="post" id="loginForm"> <div class="form-group"> <label class="col-xs-3 control-label">Username</label> <div class="col-xs-5"> <input type="text" name="username" class="form-control"> </div> </div> <div class="form-group"> <label class="col-xs-3 control-label">Password</label> <div class="col-xs-5"> <input type="password" name="password" class="form-control"> </div> </div> <div class="form-group"> <div class="col-xs-5 col-xs-offset-3"> <button class="btn btn-default" type="submit">Login</button> </div> </div> </form> </div> <div class="modal-footer"> <button type="button" data-dismiss="modal" class="btn btn-light-grey"> Close </button> <button type="button" class="btn btn-blue"> Save changes </button> </div> </div>

We can assure you that paddings and margins are all there in our project.

Just let us know if this works out well for you ok? :)

Default-user
Unfortunately, I cannot have the form inside of the modal tags. Here is my rendered HTML which contains multiple modals: <form name="create" action="" role="form" class="form-horizontal" id="form" method="post"> <!-- start: PAGE CONTENT --> <div class="row" id="form-container"> <div class="col-sm-12"> <div class="row"> <div class="col-sm-10"> <div class="form-group"> <label class="col-sm-3 control-label"> Load Type <span class="symbol required" /> </label> <div class="col-sm-7"> <select class="form-control" id="load_type" name="load_type"><option value=""><none selected></option><option selected value="LTL">LTL</option><option value="TL">TL</option></select> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Required Trailer <span class="symbol required" /> </label> <div class="col-sm-7"> <select class="form-control" id="trailer_type" name="trailer_type"><option value=""><none selected></option><option selected value="Auto Carrier">Auto Carrier</option><option value="Conestoga">Conestoga</option><option value="Container">Container</option><option value="Double Drop">Double Drop</option><option value="Flatbed">Flatbed</option><option value="Hotshot">Hotshot</option><option value="Lowboy">Lowboy</option><option value="Moving Van">Moving Van</option><option value="Power Only">Power Only</option><option value="Reefer">Reefer</option><option value="RGN">RGN</option><option value="Step Deck">Step Deck</option><option value="Tanker">Tanker</option><option value="Van">Van</option></select> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Total Miles <span class="symbol required" /> </label> <div class="col-sm-7"> <input class="form-control" id="total_miles" name="total_miles" placeholder="Total Miles" type="text" value="123"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Cost <span class="symbol required" /> </label> <div class="col-sm-7"> <input class="form-control" id="price" name="price" placeholder="Price" type="text" value="123.0"> </div> </div> </div> </div> <hr /> <div class="row"> <div class="col-sm-10"> <div class="form-group"> <label class="col-sm-3 control-label"> Load Description </label> <div class="col-sm-7"> <textarea class="autosize form-control" id="description" name="description" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 69px;">Test</textarea> </div> </div> </div> </div> <div class="row"> <div class="col-md-12"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> Locations <div class="panel-tools"> <a class="btn btn-xs btn-link panel-collapse collapses" href="#"> </a> <a class="btn btn-xs btn-link panel-config" href="#panel-config" data-toggle="modal"> <i class="fa fa-wrench" /> </a> <a class="btn btn-xs btn-link panel-refresh" href="#"> <i class="fa fa-refresh" /> </a> <a class="btn btn-xs btn-link panel-expand" href="#"> <i class="fa fa-resize-full" /> </a> <a class="btn btn-xs btn-link panel-close" href="#"> <i class="fa fa-times" /> </a> </div> </div> <div class="panel-body"> <div class="row"> <div class="col-md-12 space20"> <a href="#responsive-3" data-toggle="modal" class="new-modal btn btn-green"> Add New <i class="fa fa-plus" /> </a> </div> </div> <div class="table-responsive"> <table class="table table-striped table-hover" id="sample_2"> <thead> <tr> <th>Stop #</th> <th>Street Address</th> <th>City</th> <th>State</th> <th>Zip</th> <th>Pickup Weight</th> <th>Delete</th> </tr> </thead> <tbody> <tr> <td> <input type="text\" id="locations-1'-stop_number" name="locations-1-stop_number" class="form-control stop-number" value="1"> <p style="display:none;" class="modal-id">1</p> </td> <td>Test</td> <td>Test</td> <td>Test</td> <td>123</td> <td>03/02/2015</td> <td><a class="edit-modal" href="#responsive-1" data-toggle="modal">Edit</a>/<a class="delete-row" href="">Delete</a></td> </tr> <tr> <td> <input type="text\" id="locations-2'-stop_number" name="locations-2-stop_number" class="form-control stop-number" value="2"> <p style="display:none;" class="modal-id">2</p> </td> <td>Test</td> <td>Test</td> <td>Test</td> <td>12345</td> <td>03/09/2015</td> <td><a class="edit-modal" href="#responsive-2" data-toggle="modal">Edit</a>/<a class="delete-row" href="">Delete</a></td> </tr> <!--- Content created by table-data.js --> </tbody> </table> </div> </div> </div> </div> <hr /> <div class="form-group"> <div class="col-sm-2 col-sm-offset-3"> <button class="btn btn-light-grey back-step btn-block"> <i class="fa fa-circle-arrow-left" /> Back </button> </div> <div class="col-sm-2 col-sm-offset-3"> <button type="submit" class="btn btn-success btn-block"> Finish <i class="fa fa-arrow-circle-right" /> </button> </div> </div> </div> </div> <div id="responsive-1" class="modal fade" tabindex="-1" data-width="840" style="display: none;"> <p style="display:none;" class="modal-id">1</p> <div class="modal-header" id="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> × </button> <h4 class="modal-title">Edit Location</h4> </div> <div class="modal-body"> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> General </div> <div class="panel-body"> <div class="col-sm-12"> <input type="hidden" id="locations-1-retired" name="locations-1-retired" class="form-control" value="1"> <div class="form-group"> <p> <label class="col-sm-3 control-label"> Address <span class="symbol required" /> </label> </p><div class="col-sm-7"> <input type="text" id="locations-1-address1" name="locations-1-address1" class="form-control" value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> City <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-city" name="locations-1-city" class="form-control"value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> State <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-state" name="locations-1-state" class="form-control" value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Zip Code <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-postal_code" name="locations-1-postal_code" class="form-control" value="123"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Arrival Date <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-arrival_date" name="locations-1-arrival_date" data-date-format="mm-dd-yyyy" data-date-viewmode="years" class="form-control date-picker" value="03/02/2015"> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> Contact </div> <div class="panel-body"> <div class="col-sm-12"> <div class="form-group"> <label class="col-sm-3 control-label"> Name <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-contact_name" name="locations-1-contact_name" class="form-control" value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Phone <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-contact_phone" name="locations-1-contact_phone" class="form-control" value=""> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Email </label> <div class="col-sm-7"> <input type="text" id="locations-1-contact_email" name="locations-1-contact_email" class="form-control" value="1231231234"> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> Pickup Details </div> <div class="panel-body"> <div class="col-sm-12"> <div class="form-group"> <label class="col-sm-3 control-label"> Weight (lbs) <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-pickup_weight" name="locations-1-pickup_weight" class="form-control" value="123"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Notes <span class="symbol required" /> </label> <div class="\"col-sm-7\""> <textarea class="autosize form-control" id="locations-1-pickup_notes" name="locations-1-pickup_notes" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 69px;"></textarea> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> Drop Off Details </div> <div class="panel-body"> <div class="col-sm-12"> <div class="form-group"> <label class="col-sm-3 control-label"> Weight (lbs) <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-1-delivery_weight" name="locations-1-delivery_weight" class="form-control" value=""> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Notes <span class="symbol required" /> </label> <div class="\"col-sm-7\""> <textarea class="autosize form-control" id="locations-1-delivery_notes" name="locations-1-pickup_notes" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 69px;"></textarea> </div> </div> </div> </div> </div> </div> </div> <div class="modal-footer"> <input type="hidden" id="locations-1-stop_number" name="locations-1-stop_number" class="form-control stop-number" value="1"> <button type="button" data-dismiss="modal" class="btn btn-light-grey"> Close </button> <button type="button" data-dismiss="modal" class="btn btn-blue save-modal"> Add </button> </div> </div> <div id="responsive-2" class="modal fade" tabindex="-1" data-width="840" style="display: none;"> <p style="display:none;" class="modal-id">2</p> <div class="modal-header" id="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> × </button> <h4 class="modal-title">Edit Location</h4> </div> <div class="modal-body"> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> General </div> <div class="panel-body"> <div class="col-sm-12"> <input type="hidden" id="locations-2-retired" name="locations-2-retired" class="form-control" value="2"> <div class="form-group"> <p> <label class="col-sm-3 control-label"> Address <span class="symbol required" /> </label> </p><div class="col-sm-7"> <input type="text" id="locations-2-address1" name="locations-2-address1" class="form-control" value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> City <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-city" name="locations-2-city" class="form-control"value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> State <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-state" name="locations-2-state" class="form-control" value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Zip Code <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-postal_code" name="locations-2-postal_code" class="form-control" value="12345"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Arrival Date <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-arrival_date" name="locations-2-arrival_date" data-date-format="mm-dd-yyyy" data-date-viewmode="years" class="form-control date-picker" value="03/09/2015"> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> Contact </div> <div class="panel-body"> <div class="col-sm-12"> <div class="form-group"> <label class="col-sm-3 control-label"> Name <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-contact_name" name="locations-2-contact_name" class="form-control" value="Test"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Phone <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-contact_phone" name="locations-2-contact_phone" class="form-control" value=""> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Email </label> <div class="col-sm-7"> <input type="text" id="locations-2-contact_email" name="locations-2-contact_email" class="form-control" value="1231231234"> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> Pickup Details </div> <div class="panel-body"> <div class="col-sm-12"> <div class="form-group"> <label class="col-sm-3 control-label"> Weight (lbs) <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-pickup_weight" name="locations-2-pickup_weight" class="form-control" value=""> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Notes <span class="symbol required" /> </label> <div class="\"col-sm-7\""> <textarea class="autosize form-control" id="locations-2-pickup_notes" name="locations-2-pickup_notes" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 69px;"></textarea> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="panel panel-default"> <div class="panel-heading"> <i class="fa fa-external-link-square" /> Drop Off Details </div> <div class="panel-body"> <div class="col-sm-12"> <div class="form-group"> <label class="col-sm-3 control-label"> Weight (lbs) <span class="symbol required" /> </label> <div class="col-sm-7"> <input type="text" id="locations-2-delivery_weight" name="locations-2-delivery_weight" class="form-control" value="1213"> </div> </div> <div class="form-group"> <label class="col-sm-3 control-label"> Notes <span class="symbol required" /> </label> <div class="\"col-sm-7\""> <textarea class="autosize form-control" id="locations-2-delivery_notes" name="locations-2-pickup_notes" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 69px;"></textarea> </div> </div> </div> </div> </div> </div> </div> <div class="modal-footer"> <input type="hidden" id="locations-2-stop_number" name="locations-2-stop_number" class="form-control stop-number" value="2"> <button type="button" data-dismiss="modal" class="btn btn-light-grey"> Close </button> <button type="button" data-dismiss="modal" class="btn btn-blue save-modal"> Add </button> </div> </div> </div> </form>
Cliptheme

Ouch! that’s huge!

Sorry, but with this code we cannot precisely detect the problem. Could you please send us an online demo? Possibly showing us where the margins and the paddings are located?

You can also mail us at support@cliptheme.com

Thank you for your cooperation :)

stingers Purchased

Hi, I need help to remove the big white space (see the shot screen image ) up of the first navigation. i remove navbar-fixed-topand the control with .Js because i don’t need the fixed navbar. Just normal scroll

Thanks

Default-user
stingers Purchased
Hi, I’m sorry but no way. i don’t understand the problem. like i said earlier, I just remove the main.js and change <div role="navigation" class="navbar navbar-default navbar-fixed-top space-top " /> to <div role="navigation" class="navbar navbar-default navbar-static-top " />

thanks

Default-user
stingers Purchased

hi, I found the error Thanks

Cliptheme

Oh great! Actually the IT department has just sent me an answer to that but never mind. Glad you found a solution!

Just rate us 5 stars please if you’re satisfied with our products and support. Thanks :)

Forgot password form and Sign up form raise JS errors on submit after failed validation. To avoid this you should use argument form element in submit handler (form instead of form2):

submitHandler: function (form) {
                errorHandler.hide();
                form.submit();
            },

Hello, do you have any additional less or sass files you use to generate the css of main.css? I see the styles.less file but that does not seem to have a complete definition in order to create the main.css. My technical team suggested I reach out to you to see if there was any additional less or sass files we could use for our own customization.

Thanks!

Cliptheme

Hi there!

thank you for your message!

we will move the whole theme to sass very soon, so you will find in the theme all the files of the main.css :)

Hello Again , Trivial bug: In FAQ page, the smooth scroll ,when opening a ‘question’, doesn’t respect if there is a fixed header or not , As for your demo , default is a fixed header so it displays little awkward ,

All the best

by
by
by
by
by
by