Spacing bug on Blog Sidebar

Hello Donna,

Thanks for reaching out. :slight_smile:

Actually there are bunch of <br> tags that are causing the spacing out showup. Please remove the same and should fix the issue.

Thanks.

How do I do that? I didn’t add them. I can’t find the page to edit in.

Hey Donna,

The <br> tags may have been added by the Jetpack plugin. I can see that you are using the Jetpack Subscription widget. To eliminate the spacing, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

#subscribe-submit br {
    display: none;
}

We would loved to know if this has work for you. Thank you.

That fixed the subscribe button but the rest still has unwanted spacing. As I originally said I had removed the subscribe widget and the other things still had wrong spacing.

Hi @DonnaBarnes,

It seems there is an issue with the Masonry with Lazy load option of Jetpack plugin.

Could you please turn off the Lazy Load option of Jetpack?

Let us know how it goes!

Thanks, I turned off Lazy Load but that didn’t fix it.

Hey Donna,

I have investigated the issue further and I found out that something in the Content Area right in the Global blocks, you have inserted a broken code that caused this issue. Would you mind providing us the login details of your site so that I can figure out what or which code you have added is the invalid? You can insert your WP credentials in a secure note in your next reply. To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Thank you in advance.

Thanks I sent it in a secure note. I have two other sites with the same problem so if you figure it out please let me know so I can fix my other two sites as well.

Hey Donna,

I have investigated the issue and I found out that the broken code is coming from the misuse of the headline element. Please keep in mind that the headline element will be wrapped with heading tag or p tag when being outputted in the front end. The problem is that there is a <p> tag added to your headline element. You may not have added it manually and I know how and why. It is because the in Pro > Settings > Permissions > User Preference > Rich Text Editor Default were set to “Always ON”. This would make any element text editor will use the Rich Text Format by default and this will pose a problem because when you are editing the headline element, any text you will insert will be converted and the rich text editor will automatically format the text adding a <p> for a new line and <br> for line breaks.

I went ahead and fixed the issue by setting the Rich Text Editor to OFF and removed the unnecessary <p> and <br> tags in all of your headlines in the global block. You can check out the sidebar in the secure note.

Hope this explains your issue briefly.

Thanks but I don’t see your secure note. You didn’t fix my issues. To be specific:

  1. Extra space under TV Logos image.
  2. Extra space under video, 'BUY EMERGENCY SESSION" button should be directly under video.
  3. Google Ad should be directly under above mentioned button.
  4. Extra space under book image, “BUY NOW” button should be directly under book image.

Hello Donna,

On this page, https://www.breakup.expert/an-x-test/, your global blocks is displaying as expected with the correct spacing.

Please check it out.

The Blog Sidebar is right on that link but it’s not live? How do I make that live on all my 3 sites?

Hello Donna,

My colleague used Global block element to display on text page. In that page Blog Global Block has been used. Under Appearance > Widgets replace the Global Block ID number. I have tested for Blog Global Block and now it seems to be working fine.

Thanks.

It’s not working on my blog: https://www.breakup.expert/blog/

He created it on a blank page not as a sidebar. It needs to work as a sidebar.

Hi Donna,

But that’s already a sidebar, not blank page but blog page where the default sidebar is displayed. The only thing I can see between that actual sidebar and Ruenel’s provided test page is the width. I’m not sure what else you’re referring about as an actual sidebar.

Back to the original question, what do you mean it’s not live on other 3 sites. Perhaps we need to check those 3 sites instead of this one? Please provide the 3 URLs and we’ll check and compare it :slight_smile:

Thanks!

The same spacing issues as stated again below is on all three of my site’s sidebars:



  1. Extra space under TV Logos image.
  2. Extra space under video, 'BUY EMERGENCY SESSION" button should be directly under video.
  3. Google Ad should be directly under above mentioned button.
  4. Extra space under book image, “BUY NOW” button should be directly under book image.

I need that fixed.

Hi Donna,

Thanks for the clarification.

It’s due to line breaks and broken HTML elements. Then it’s a bit weird as the changes I’m adding is not taking effect, sometimes it does and will just revert back (like adding Hello World to make sure it’s the correct widget)

Would you mind providing your FTP login credentials as well? And please allow me to disable all plugins while testing. Make sure to back up your site first.

Thanks!

Thanks so much for all your help! That fixed my issues on all three sites!

Hello Donna,

I have investigated the issue thoroughly. I found out that you used a text widget and inserted the global block shortcode which created conflict with the global block contents adding unnecessary <p> and <br> tags. I went ahead and edited your sidebar widgets. I removed the text widget and used the HTML widget instead.

Please check your sidebar now. The spacing issue is gone.

Reminder:
For your other sites, please do not use Text widget. Use HTML widget instead and insert your global block shortcode.

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