Mobile Menu Auto-Expander - Broken

Hello,

I added a new JS script for a retargeting software called Outbrain. I’m not sure what happened, but it appears I may have inadvertently disabled the script you guys gave me that Auto-Expands (clicks) on the menu button when people view our site on mobile devices. Can someone please take a look and tell me what I need to do in order to get the auto-expand JS script to start working again please?

Thank you!

Jesse

Hi Jesse,

Thanks for reaching out.

The Theme Option > JS should contain javascript and not HTML, this is wrong

<script>
(function($){
  $(window).on('load', function(){
    $('#x-btn-navbar').trigger('click');
  });
})(jQuery);
</script>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-125068227-1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-125068227-1');
</script>
<script type="text/javascript" src="https://cdn.ywxi.net/js/1.js" async></script>

<script data-obct type="text/javascript">
  /** DO NOT MODIFY THIS CODE**/
  !function(_window, _document) {
    var OB_ADV_ID='00e978b63b74ea3fd3bbd0878a945d6a8b';
    if (_window.obApi) {var toArray = function(object) {return Object.prototype.toString.call(object) === '[object Array]' ? object : [object];};_window.obApi.marketerId = toArray(_window.obApi.marketerId).concat(toArray(OB_ADV_ID));return;}
    var api = _window.obApi = function() {api.dispatch ? api.dispatch.apply(api, arguments) : api.queue.push(arguments);};api.version = '1.1';api.loaded = true;api.marketerId = OB_ADV_ID;api.queue = [];var tag = _document.createElement('script');tag.async = true;tag.src = '//amplify.outbrain.com/cp/obtp.js';tag.type = 'text/javascript';var script = _document.getElementsByTagName('script')[0];script.parentNode.insertBefore(tag, script);}(window, document);
obApi('track', 'PAGE_VIEW');
</script>

Please remove them and just make its content to this

(function($){
  $(window).on('load', function(){
    $('#x-btn-navbar').trigger('click');
  });
})(jQuery);

The content <script></script> is HTML and not Javascript. The javascript is what’s within <script></script> but you can’t add them at once.

Thanks!

Sorry, i’m confused, you listed three separate scripts in that message. I need all three scripts. I can replace the first one with the edit you provided, but what should i do with the other two scripts? I still need them.

Thanks,

Jesse

Is there some text i should be using to separate one script from another? I thought that’s why the tags were used, i thought they just referenced the start and end of a single script. Do they not require a separation?

For now i put in a divider like used below - but it doesn’t appear to work or to have fixed the auto-expanding mobile menu code. Please advise how to fix without removing the other two scripts.

(function($){
$(window).on(‘load’, function(){
$(’#x-btn-navbar’).trigger(‘click’);
});
})(jQuery);

Hi Jesse,

Before we go further, I explain it further why it can’t be added there. This tag is HTML similar to <div></div>

<script></script>

It’s not a javascript, it’s just added so the browser knows that the area contains the javascript. The javascript is what’s within it. The Theme Options > JS automatically adds <script></script> since you’re supposed to only add javascript, so adding another <script></script> will result to this

<script>
<script></script>
</script>

Then the solution is removing all of them and make sure it only contains this javascript code

(function($){
  $(window).on('load', function(){
    $('#x-btn-navbar').trigger('click');
  });
})(jQuery);

Then add this code to your child theme’s functions.php for those other embed codes.

add_action('wp_footer', 'my_custom_embed_code', 999999999);

function my_custom_embed_code () { ?>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-125068227-1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-125068227-1');
</script>
<script type="text/javascript" src="https://cdn.ywxi.net/js/1.js" async></script>

<script data-obct type="text/javascript">
  /** DO NOT MODIFY THIS CODE**/
  !function(_window, _document) {
    var OB_ADV_ID='00e978b63b74ea3fd3bbd0878a945d6a8b';
    if (_window.obApi) {var toArray = function(object) {return Object.prototype.toString.call(object) === '[object Array]' ? object : [object];};_window.obApi.marketerId = toArray(_window.obApi.marketerId).concat(toArray(OB_ADV_ID));return;}
    var api = _window.obApi = function() {api.dispatch ? api.dispatch.apply(api, arguments) : api.queue.push(arguments);};api.version = '1.1';api.loaded = true;api.marketerId = OB_ADV_ID;api.queue = [];var tag = _document.createElement('script');tag.async = true;tag.src = '//amplify.outbrain.com/cp/obtp.js';tag.type = 'text/javascript';var script = _document.getElementsByTagName('script')[0];script.parentNode.insertBefore(tag, script);}(window, document);
obApi('track', 'PAGE_VIEW');
</script>

<?php }

And please check this for child theme installation https://theme.co/apex/forum/t/setup-how-to-setup-child-themes/57

Thanks!

I don’t believe i have a child theme. How will installing one affect the website?

Won’t installing a child theme just install a blank x-theme template? How do i get my actual website that’s complete into that new child theme??

Hello Jesse,

Because what you are trying to accomplish requires a template customization, we would highly to suggest that you use a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

After the child theme is set up, please add the codes in your child theme’s functions.php file as instructed by @Rad in his response above.

Hope this helps. Kindly let us know.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.