Hey Lenamti,

Thank you for your comment.

Please don’t be worry about base64 compression. It’s modern and recommended CSS technique to make the SVG images (in the template used for buttons) even smaller/optimized. You can read about it for example here: http://css-tricks.com/using-svg/ It’s also good to use svg compressed in base64, so that there is not needed extra http request for the image.

If you go here http://www.base64decode.org/ and decode the base64 data from CSS file:

a.btn.orange:hover {background: #ff7100;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmNzEwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjlmMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);

You will see that it is standard SVG image format inside:

<?xml version="1.0" ?>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 1 1" preserveAspectRatio="none">
  <linearGradient id="grad-ucgg-generated" gradientUnits="userSpaceOnUse" x1="0%" y1="0%" x2="0%" y2="100%">
    <stop offset="0%" stop-color="#ff7100" stop-opacity="1"/>
    <stop offset="100%" stop-color="#ff9f00" stop-opacity="1"/>
  </linearGradient>
  <rect x="0" y="0" width="1" height="1" fill="url(#grad-ucgg-generated)" />
</svg>

Similar format you will get also if you create SVG image in some exemplary editor like http://svg-edit.googlecode.com/svn/branches/2.5.1/editor/svg-editor.html.

If you copy this, paste in text editor and save as for example image.svg you will see that it’s orange background image. Please save this image as for example button-bg.svg and then please use background: url(“images/button-bg.svg”) if you don’t want to use base64 format.

Hope it helps!

Please let us know if you need some more details or further assistance.

Thanks and kind regards, ThemeMotive team

Hey Artisan14,

Thank you for your comment.

Concerning your question, yes, please just separate each e-mail with coma, like aidan@example.com,wez@example.com.

Hope it helps!

Please let us know if we can be of further assistance.

Regards

Hey ,

Thank you for your comment.

Please put this code in the place of right navigation.

<p class="right-text">Place for text</p>

and in style.css please add

.right-text {float: right;}

Hope it helps!

Please let us know if we can be of further asssitance.

Kind regards, ThemeMotive team

Sorry, but it’s not working. <section class="top"> <div> <p>left text</p> <p class="right-text">right text</p> </div> </section>

Did you add style to style.css? We tested it and it worked for us.

Please let us know if we can be of further asssitance.

Kind regards, ThemeMotive team

Never mind, I figured it out

Hey,

Thank you for your comment.

Please just make sure if you replaced the native image with new one and refresh the page (clearning browser cache may also help).

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

Hey Kazmarar,

Thank you for your comment.

If you want to enable pinch-zoom in Android please replace this code:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

to this one:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,  user-scalable=yes">

in html template.

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards

Hey netunlimited,

Thank you for your comment.

Concerning your question. We investigated it and observed that IE 7 and IE 8 are not supporting custom radio and checkboxes. In this case please add to style-ie.css

label.radio input, label.checkbox input {visibility: visible;}

and please change this part of code in scripts.js

// custom checkboxes and radios
$("input[type=checkbox], input[type=radio]").not("input[type=radio].star").each(function(){
    var me = $(this);
    var myType = me.attr("type");
    if (me.parents("label").length) {
        me.parents("label").addClass(myType)
    } else {
        me.wrap('<label class="' + myType + '"></label>');    
    }
    var label = me.parents("label." + myType);

    var customMe = me.parents("span." + myType);
    var checked = false;
    if (me.is(':checked')) {
        checked = true;
        label.addClass("checked");
    }

    me.change(function(){
        if(myType == "radio") {
            var name = me.attr("name");
            var labels = $("input[name=" + name + "]").parents(".radio")
            labels.removeClass("checked");
            label.toggleClass("checked");
        } else label.toggleClass("checked");
    })
});

to this one:

// custom checkboxes and radios
if ( ! ( ($.browser.msie) && ($.browser.version < '9.0') ) ){
$("input[type=checkbox], input[type=radio]").not("input[type=radio].star").each(function(){
    var me = $(this);
    var myType = me.attr("type");
    if (me.parents("label").length) {
        me.parents("label").addClass(myType)
    } else {
        me.wrap('<label class="' + myType + '"></label>');    
    }
    var label = me.parents("label." + myType);

    var customMe = me.parents("span." + myType);
    var checked = false;
    if (me.is(':checked')) {
        checked = true;
        label.addClass("checked");
    }

    me.change(function(){
        if(myType == "radio") {
            var name = me.attr("name");
            var labels = $("input[name=" + name + "]").parents(".radio")
            labels.removeClass("checked");
            label.toggleClass("checked");
        } else label.toggleClass("checked");
    })
});
}

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

Thanks a lot! I’ve also noticed that the “fancy image borders” in JS make the images not clickable in IE 7 and 8. You might want to look into that as well.

Could you please provide us link to exemplary page? We couldn’t replicate it on IE8.

Thanks and kind regards

Hey Artisan14,

Thank you for your comment;

Please copy the font attributes for selector:

.slider9 h3+p

it;s”

font: 300 1.385em/1.2em "Signika",sans-serif;

and then replace it with the font attribute for selector:

.slider4 h3+p<code> it's <code>font: 300 1.643em/1.2em "Signika",sans-serif;</code> in style.css Hope it helps! Please let us know if we can be of further assistance. Kind regards, ThemeMotive team</code>

Hey Artisan14,

Thank you for your comment and positive feedback

Yes, sure it’s possible. Do you want to change color only or pattern?

Please replace background for selector .landing-form form

from

background: url("images/footer.png"); color: #fff;

to for example:

background: url("images/patterns/pattern07.png") repeat scroll 0 0 red;

where instead of “red” please put your custom color code or name.

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

Hey Afforditsolutions,

Thank you for contacting us.

Currently on http://www.afforditsolutions.com.au/images/temp/new_logo_main2@2x.jpg there is 404 error.

Please upload new_logo_main2@2x.jpg with 2 times bigger dimensions than new_logo_main2.jpg, so that it could be sharp on retina ready devices.

If you don’t want to upload retina logo please remove this from scripts.js

//logo for retina
$('header .title img').each(function() {    
    var retina = window.devicePixelRatio > 1 ? true : false;    
    if(retina) {        
        var filePath = $(this).attr('src');
        var fileName = filePath.substring(filePath.lastIndexOf('/')+1);
        var retinaFileName = fileName.replace('.', '@2x.');
        filePath = filePath.replace(fileName, retinaFileName); 
        $(this).attr('src', filePath);
    }
});

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

Hey,

Thank you for your comment.

Currently we have got only option that stop on hover and don’t start again. This was done intentionally that way to protect for example if user hover on slider and play video and then hover out from slider. We will think about new options in next releases, so again thank you for your comment.

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

I didn’t really change much, and the javascript i added is not called immediately in that page. To be absolutely sure I didn’t mess something up in my own code, I restored the original css files and the original js file. Same thing happens.

I can’t compare my page with your provided ‘native’ html files, because your files never put these elements next to eachother.

The IE version I use is 11.0.9600.16521. Screenshot of problem: https://dl.dropboxusercontent.com/u/93988347/css-error.png

Any more ideas?

Sounds like it’s some general CSS issue related with your new html structure and CSS.

Please have a look at form 2 style at http://thememotive.com/multipurpose/shortcodes.html

We recommend you to use similar solution and divide select field into separate row.

Hope ut helps!

Please let us know if we can be of further assistance.

Kind regards

This is not something I want to do, but I guess there’s no alternative.

Hey,

Thank you for your comment and great feedback

Concerning your question, yes it’s possible, but demands some custom code, please have a look here: http://stackoverflow.com/questions/19707236/show-popup-after-page-load

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards

Hey Noescom,

Thank you for your comment.

Concerning your questions:

1. Then please manipulate the width of .form2 input and .form2 label to get the result you want.

2. For the for we recommend you to simply using the input are, so that user can just put the number. You could add extra validation to make sure user put the right data.

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

Hey Kcginc,

Thank you for your comment

We carefully checked your website and observed that there are some html errors in your html code. Please check your website with http://validator.w3.org/check and correct all the errors.

We advise you to copy the native code of the slider and just place your longer text in the text areas. Please keep the lenght similar and please just adjust the position of

for example:

.landing-form form {
  top: -680px;
}

We tested it and it worked.

Another solution is to keep the height of sthe slider as it’s now and place the links “Read more” – as it would be better to read longer text in separate site than os slider (better user experience).

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

Hey Privatamente,

Thank you for your comment

Then please just replace text “Choose file” to “Any custom text”.

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards, ThemeMotive team

<input name=”userfile” type=”file” id=”foto”> where?

Please change this text in file /js/scripts.js

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards,

Hey Incutai,

Thank you for your great feedback

Concerning SPAM protection, we can send you exemplary easy to implement solution via e-mail. Please send us e-mail to: info at thememotive dot com. We will send you back the exemplary files.

Hope it helps!

Please let us know if we can be of further assistance.

Kind regards

change this </article> <article class=”col2”>

into (A NEW LINE IS ADDED)

</article> <article class=”col2”>

Hey MigMB,

Thank you for your comment.

Could you plase disable automating formating style or replace ”</article> <article class=”col2”>” to ”</article><article class=”col2”>”.

Please lets us know if we can be of furthe rassistance.

Kind Regards

Hey Noescom,

Thank you for your comment.

It’s possible. Could you please provide us link yo your html, so that we could send you direct CSS. In general it should be like:

th.orange {color: orange;}
th.gray {color: gray;}

and modify the structure:

<table class="alt">
<tr>
<th class="orange"> -- this th is orange
</th></tr>
<tr>
<th class="gray"> -- this th is gray
</th></tr>
</table>

Hope it helps!

Please let us know if we can be of further assistance.

Thanks! In the meantime I already figured it out myself. I’m getting quite the hang of CSS

Hey Netunlimited,

Thank you for your comment.

In style.css there is line:

input.error, textarea.error, select.error {border-color: #e65842; background-color: #ffe6dc; box-shadow: 0 0 2px 1px #ffece6; color: #ef4437;}

so please just add .error class to the select and it should work.

Hope it helps!

Please lets us know if we can be of furthe rassistance.

Yes, I saw that, but it doesn’t work. Probably because the select menu is turned into custom select by your scripts. Please see my screenshot: http://snag.gy/KsMxF.jpg I think because the SPAN around the select does not get error class and has its own border.

Please have a look how it’s implemented on contact.html – there is select field, which is getting red when not passing the validation.

Hope it helps!

Please lets us know if we can be of furthe rassistance.

Hey Traderjphx,

Thank you for your comment

Concerning your question please in style-colors remove this part:

.color-blue .landing-form button {border-color: #499dd3; border-bottom-color: #1f77cb;}

and this par:

.color-blue button[type="submit"], .color-blue a.button, .color-blue .pricing-plan a.button, .color-blue table.pricing a.button {border-color: #2589e9; border-top-color: #499dd3; background: #52b3f2;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyYjNmMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyNTg5ZTkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #52b3f2 0%, #2589e9 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#52b3f2), color-stop(100%,#2589e9));
background: -webkit-linear-gradient(top,  #52b3f2 0%,#2589e9 100%);
background: -o-linear-gradient(top,  #52b3f2 0%,#2589e9 100%);
background: -ms-linear-gradient(top,  #52b3f2 0%,#2589e9 100%);
background: linear-gradient(to bottom,  #52b3f2 0%,#2589e9 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#52b3f2', endColorstr='#2589e9',GradientType=0 );
color: #fff; text-shadow: 0 -1px 0 #3687c0;}
.color-blue button[type="submit"]:hover, .color-blue a.button:hover, .color-blue table.pricing a.button:hover {background: #2589e9;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI1ODllOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM1MmIzZjIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #2589e9 0%, #52b3f2 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2589e9), color-stop(100%,#52b3f2));
background: -webkit-linear-gradient(top,  #2589e9 0%,#52b3f2 100%);
background: -o-linear-gradient(top,  #2589e9 0%,#52b3f2 100%);
background: -ms-linear-gradient(top,  #2589e9 0%,#52b3f2 100%);
background: linear-gradient(to bottom,  #2589e9 0%,#52b3f2 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2589e9', endColorstr='#52b3f2',GradientType=0 );
color: #fff;}

Hope it helps!

Please lets us know if we can be of furthe rassistance.

perfect, thank you.