Docs

[Rad]

Hi there,

You just pasted an incomplete code, it’s missing the “j”

Check this line

Query( function($){

it should like this

jQuery( function($){

Thanks!

[SEVERO]

This reply has been marked as private.

[Rue Nel]

Hello There,

Please have the code updated and use this instead:

jQuery( function($){

  var the_interval = 0;

  the_interval = change_height();

  $('.ib-close').on('click', function(){

    clearInterval( the_interval );

    $('body').stop().animate( { 'margin-top' : 0 } );

  } );

  $('.cp-ifb-toggle-btn').on('click', function() {

    the_interval = change_height();

  } );

  function change_height () {

    return setInterval( function() {

      if ( $('#cp-cp_id_1b4a0:visible').height() <=0 ) $('body').stop().animate( { 'margin-top' : 0 } );
      else $('body').stop().animate( { 'margin-top' : $('#cp-cp_id_1b4a0:visible').height() } );

    } , 300 );

  }

} );

And since you have installed a caching plugin WP Super Cache, please clear your plugin cache before testing your site. This can cause the changes to not take place on the front end. It will eventually show up when the cache regenerates, but it’s not ideal if you’re looking to see your changes immediately. Caching plugins are best to turn on only when you’ve finished building the site.

Hope this helps.

[SEVERO]

Hi there, doesn’t seem to work for me. Deleted WP Super Cache and cleared my cache and still no joy. Even tried it in a different browser which has never been used. Advert still appearing in front of my content. Have removed the ‘j’ for now so the ad sits above.

[Lely]

Hi Severo,

See attached screenshot of the error I am seeing on the console. It seems that you do have custom code on your child theme’s functions.php that is still pointing to x-shortcode plugin. Since it is now included on Cornerstone, we have to update that line of code to this.

Please check for this line:

wp_enqueue_script( 'vendor-ilightbox', get_site_url() . '/wp-content/plugins/x-shortcodes/js/dist/site/vendor-ilightbox.min.js', true );
Update to this:
wp_enqueue_script( 'vendor-ilightbox', get_site_url() . '/wp-content/plugins/cornerstone/assets/dist/js/site/vendor-ilightbox.min.js', true );

Then add the J again on the custom script. Clear cache and then try again.

Hope this helps.

[SEVERO]

Hi there, I assume this is what I need to change beacuse I couldn’t find the above.

add_action( ‘wp_footer’, function(){
if (is_archive() || is_home()) {
echo ‘<script type=”text/javascript” src=”‘ . home_url() . ‘/wp-content/plugins/x-shortcodes/js/dist/site/vendor-ilightbox.min.js”></script>’;
}
}, 10 );

If so, no joy!

[Lely]

Hi There,

Upon thorough checking this part of code check if that Convertplug is visible and it gets its height and assign it as body content margin to move other content below it:

      if ( $('#cp-cp_id_1b4a0:visible').height() <=0 ) $('body').stop().animate( { 'margin-top' : 0 } );
      else $('body').stop().animate( { 'margin-top' : $('#cp-cp_id_1b4a0:visible').height() } );

But then, when I checked the specific convertplug, it is using different id from #cp-cp_id_1b4a0. As you can see, this #cp-cp_id_1b4a0 is how check the convertplug. But the current id of that convertplug is #cp-cp_id_23b81. See attached screenshot. So that specific code doesn’t work because it is looking for wrong or different ID. Are you using that code for another Convertplug? If not update that line of code to this:

      if ( $('#cp-cp_id_23b81:visible').height() <=0 ) $('body').stop().animate( { 'margin-top' : 0 } );
      else $('body').stop().animate( { 'margin-top' : $('#cp-cp_id_23b81:visible').height() } );

Hope this helps.

[SEVERO]

Hi there, before I was running two Convert Plug Info Bars with two different ID’s and both were working fine so I’m very confused to why this would stop working.

Once the 1st Info Bar is closed you’re left with a 2nd using a toggle to launch the Info Bar. This is the ID used for that .cp_id_6d95a and when the script is updated to this:

if ( $('#cp-cp_id_6d95a:visible').height() <=0 ) $('body').stop().animate( { 'margin-top' : 0 } );
      else $('body').stop().animate( { 'margin-top' : $('#cp-cp_id_6d95a:visible').height() } );

    } , 300 );

You’re left with a big gap until you click the Toggle Button. See attachment.

Looks like you can only run the one Info Bar now unless you have another script in there which creates that height when the Toggle Button is clicked using the 2nd ID. Make sense?

[Lely]

Hi There,

Please try adding both of them. Since it will only works if visible. Something like this:

jQuery( function($){

  var the_interval = 0;

  the_interval = change_height();

  $('.ib-close').on('click', function(){

    clearInterval( the_interval );

    $('body').stop().animate( { 'margin-top' : 0 } );

  } );

  $('.cp-ifb-toggle-btn').on('click', function() {

    the_interval = change_height();

  } );

  function change_height () {

    return setInterval( function() {

      if ( $('#cp-cp_id_1b4a0:visible').height() <=0 ) $('body').stop().animate( { 'margin-top' : 0 } );
      else $('body').stop().animate( { 'margin-top' : $('#cp-cp_id_1b4a0:visible').height() } );

      if ( $('#cp-cp_id_6d95a:visible').height() <=0 ) $('body').stop().animate( { 'margin-top' : 0 } );
      else $('body').stop().animate( { 'margin-top' : $('#cp-cp_id_6d95a:visible').height() } );

    } , 300 );

  }

} );

This part of the code remove the space on close:

 $('.ib-close').on('click', function(){

    clearInterval( the_interval );

    $('body').stop().animate( { 'margin-top' : 0 } );

  } );

Do let us know how this goes.

[SEVERO]

Hi there, not working so well. See video here: http://screencast-o-matic.com/watch/cDl1QMQoKj

Thanks

[Lely]

Hello Severo,

Thank you for the video screencast. It would be better if you will setup a staging site for this wherein we can edit and debug the code directly. That way we can check step by step where the code is failing. Thank you for understanding.

[Author]

Posts