[Support request] Javascript being stripped out

[Shingirai]

Hi there
This issue could be related to Beaver Builder or my web host. But I am trying to import a Beaver Builder template from one site to another based on this tutorial (https://youtu.be/IjkZE3omGyk) on animated typewriter effects without using a plugin by David Waumsley . The issue I am running into is that my Javascript code just won’t save. I will post the same question in the Beaver Builder support but I thought that it could be theme related hence why I am posting in the GP support Forum. I know a little bit of CSS and HTML but I know nothing about Javascript so this could most likely be a stupid mistake I am making somehow somewhere

P.S Here is the code that won’t work. Hope I am allowed to post code snippets

var TxtType = function(el, toRotate, period) {
this.toRotate = toRotate;
this.el = el;
this.loopNum = 0;
this.period = parseInt(period, 10) || 2000;
this.txt = ”;
this.tick();
this.isDeleting = false;
};

TxtType.prototype.tick = function() {
var i = this.loopNum % this.toRotate.length;
var fullTxt = this.toRotate[i];

if (this.isDeleting) {
this.txt = fullTxt.substring(0, this.txt.length – 1);
} else {
this.txt = fullTxt.substring(0, this.txt.length + 1);
}

this.el.innerHTML = ‘<span class=”wrap”>’+this.txt+'</span>’;

var that = this;
var delta = 150 – Math.random() * 100;

if (this.isDeleting) { delta /= 2; }

if (!this.isDeleting && this.txt === fullTxt) {
delta = this.period;
this.isDeleting = true;
} else if (this.isDeleting && this.txt === ”) {
this.isDeleting = false;
this.loopNum++;
delta = 500;
}

setTimeout(function() {
that.tick();
}, delta);
};

window.onload = function() {
var elements = document.getElementsByClassName(‘typewrite’);
for (var i=0; i<elements.length; i++) {
var toRotate = elements[i].getAttribute(‘data-type’);
var period = elements[i].getAttribute(‘data-period’);
if (toRotate) {
new TxtType(elements[i], JSON.parse(toRotate), period);
}
}

};

Thanks

[Leo]

Hi there,

Where are you adding the code?

[Shingirai]

Hi Beaver Builder has a field for inputting Javascript so that’s where I dropped the code. How can paste that code in Generatepress’ individual pages. Is it via the Generatepress hooks module maybe? The funny thing is I have a demo site running Generatepress free + Beaver Builder premium and the animated typewriter effect seems to be working without issue, see here: capelivin.demo.site. But the same settings won’t work on the GP Premium version. I have installed a plugin that achieves the same typewriter effect so I will continue to investigate why the Javascript code is getting stripped out, probably it’s likely my lack of Javascript skills

Thanks

[Leo]

Usually that would go in the wp_footer hook wrapped in <script></script>

GP shouldn’t altered anything that’s entered in BB (or hooks actually).

I’d wait to see what BB say.

[Shingirai]

Sure, I will try adding the code to wp_footer hook and see how it pans out. Thanks Leo

[Author]

Posts