Visual Composer HTML edits disappear after page update.

[johnand]

I am having an issue with a Visual Composer Text Block. When I add some HTMl to the text block under the “Text” tab of the VC Text block settings and Save changes, the element works on the page. But, when I actually update the page, the HTML is stripped out. I have Kleo 2.4.1 installed, VC 4.4.2, k-elements 2.4, and revslider 4.6.5. All other plugins are disabled.

Here is the complete code I am adding to the text box:

COPY CODE

<a title="Matthews Marking Systems" href="http://stage.matthewsautomation.com/home-4/mas-brands/matthews-marking-systems/"><img class="alignleft size-full wp-image-4462" src="http://stage.matthewsautomation.com/content/uploads/2014/12/icon-InkJet-87x871.png" alt="icon-InkJet-87x87" width="87" height="87" onmouseover="this.src='http://stage.matthewsautomation.com/content/uploads/2014/12/icon-InkJet-GrnLine-87x871.png';" onmouseout="this.src='http://stage.matthewsautomation.com/content/uploads/2014/12/icon-InkJet-87x871.png';"></a>
<h5><a title="Matthews Marking Systems" href="http://stage.matthewsautomation.com/home-4/mas-brands/matthews-marking-systems/">Inkjet Marking & Coding</a></h5>
High-resolution piezo, thermal inkjet and drop-on-demand valve jet printing systems for marking on porous materials in industrial and consumer packaging applications, including: corporate branding, product identification, operational marking and regulatory compliance coding.

Here is what that code turns back to when I update the page:

COPY CODE

<a title="Matthews Marking Systems" href="http://stage.matthewsautomation.com/home-4/mas-brands/matthews-marking-systems/"><img class="alignleft size-full wp-image-4462" src="http://stage.matthewsautomation.com/content/uploads/2014/12/icon-InkJet-87x871.png" alt="icon-InkJet-87x87" width="87" height="87" /></a>
<h5><a title="Matthews Marking Systems" href="http://stage.matthewsautomation.com/home-4/mas-brands/matthews-marking-systems/">Inkjet Marking & Coding</a></h5>
High-resolution piezo, thermal inkjet and drop-on-demand valve jet printing systems for marking on porous materials in industrial and consumer packaging applications, including: corporate branding, product identification, operational marking and regulatory compliance coding.

[Laura]

Hello, can you share your website and login details so we can check it out? 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[johnand]

This reply has been set as private.

[Laura]

Hello, i have seen your site and the page shows fine to me, could you explain a little more with a screenshot? 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

Attachments:

You must be logged in to view attached files.

[johnand]

This reply has been set as private.

[Laura]

Hello, have you added custom coding? I will check out again

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[Laura]

Hello, could you give me the hover code? i can make a css code so you dont have to edit each item and maybe we can get this fixed

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[johnand]

The hover code is posted in my 1st post, but here it is again:

Anyway, that is just for the one text box, as you see we have 21 of these on this page and will have quite a few more on other pages. Plus, we have 12 more brand sites that will be using the Kleo template and simular images that need hover code, so I am not sure adding them to the CSS is the right way to go, as that isn’t dynamic like we are looking for. Not sure if this is a visual composer bug and I should be contacting them for support?

[johnand]

No, we don’t have any custom coding. Can’t edit my last post, so here is the code again:

<a title="Matthews Marking Systems" href="http://stage.matthewsautomation.com/home-4/mas-brands/matthews-marking-systems/"><img class="alignleft size-full wp-image-4462" src="http://stage.matthewsautomation.com/content/uploads/2014/12/icon-InkJet-87x871.png" alt="icon-InkJet-87x87" width="87" height="87" onmouseover="this.src='http://stage.matthewsautomation.com/content/uploads/2014/12/icon-InkJet-GrnLine-87x871.png';" onmouseout="this.src='http://stage.matthewsautomation.com/content/uploads/2014/12/icon-InkJet-87x871.png';"></a>

[Laura]

Hello a CSS would really help because it will add it automatically to all icons. Lets test it 🙂 will answer with the code soon

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[johnand]

Hi,

Do you have CSS code we can try ready?

Thanks.

[Laura]

Hello, please try with this, add it to quick css or style.css in child theme, and let me know if you like it

COPY CODE

.kleo_text_column.wpb_content_element img:hover {
border-style: double;
border-color: rgb(253, 254, 255);
border-width: 6px;
border-radius: 60%;
box-shadow: 0px 0px 10px rgba(136, 136, 136, 0.46);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
width: 100px;
}
.kleo_text_column.wpb_content_element img {
-webkit-transition: width 1s, height 1s, -webkit-transform 1s;
transition: width 1s, height 1s, transform 1s;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[johnand]

That is not quite the look we were after, but thanks for the effort.

We have since found that the issue is that Visual Composer does not accept script elements in the text block module.

We have resolved this issue using a shortcode.

Thanks.

[Laura]

Hello, i’m glad you could resolve it 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[Author]

Posts