Support » Plugin: Squelch Tabs and Accordions Shortcodes » Grey space before tabs section in Rowling theme

  • Resolved willswing77


    I am using Theme “Rowling” (unchanged) in WP 5.0.3 and Squelch Tabs 0.4.1
    The theme has a block (?) of recent posts in each post content on the left hand side. These recents posts lead to the situation, that my content with the tabs produces a big grey space. The real tabbed content only starts below the recent posts block.
    Any idea of what can be done either in the style or function sheet of the theme or something in the plugin definition?
    Thanks for any help / ideas. Chris.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Matt Lowe


    Hi @willswing77

    The problem is that there isn’t enough space for all the tabs to sit in a single line, so they wrap around. Only way to resolve the issue would be to reduce the font size or the margins/padding around each tab. Something like this might work:

    .ui-tabs.squelch-taas-override .ui-tabs-nav li {
        font-size: 1rem;

    You would need to post the above code into the customizer. Appearance > Customise > Additional CSS … and then click the Publish button to make the change live.

    Thanks for the reply.
    I tried it out and the tabs now sit on a single line. Looks much nicer.
    Another issue: the GPX tracks tab (wich uses a GPX plugin) zooms to the world rather than at zoom level 11 from google maps. If I place this plugin outside the tabs section or on a plain page without tabs the zoom level shows as it should. As for example here:
    What could be the reason behind this behaviour?

    Plugin Author Matt Lowe


    Some 3rd party utilities don’t like being placed in tabs, we’ve seen issues like this with Flash and with embedding certain types of video. It’s not immediately clear what the issue is, but I am guessing that the jQuery UI library is probably sizing the tab content area to 0x0px or something during initialisation. I think this upsets certain 3rd party tools which will resize to the new size but not bounce back to a sensible size correctly.

    Unfortunately it’s close to impossible to make a solid diagnosis because everything is happening inside of a 3rd party utility that I cannot debug, and inside of jQuery UI’s library (which I COULD debug to a certain extent, but it would be very time consuming and not guaranteed to find the answer).

    Right now I just advise people not to embed things that don’t play nicely in the tabs. It’s useful to know what DOESN’T work though, as I am considering a ground-up rewrite for the plugin some time in the future, and it would of course be nice to know what does and what does not work so that we can test accordingly.

    Thanks Matt for the comprehensive answer. I understand that you can not invest time in such “misbehaving” plugins to debug them. By the way it is the “WP GPX Maps” Plugin by Bastianon Massimo.
    In the past I used another Tabs plugin named “Word Press Post Tabs”. This Tabs plugin shows the gpx file nicely. But it’s outdated and is not listed on the official wp plugins page anymore. That’s why I was looking for an alternative.
    I’ll put my gpx outside Squelch Tabs for the time being. Thanks again for your support!

    Plugin Author Matt Lowe


    I understand that you can not invest time in such “misbehaving” plugins to debug them

    To be fair it’s not necessarily entirely the other plugin’s fault; the issue is my plugin provides the necessary glue to allow you to use jQuery UI, which is an external library that provides most of the functionality (horizontal accordions being the exception — jQuery UI doesn’t have an option for horizontal accordions). Because I’m not the developer of jQuery UI I couldn’t fix the issue even if I found what it was.

    In the future I’m hoping to rewrite Squelch Tabs and Accordions Shortcodes and move away from jQuery UI, but that would be tricky due to the fact that this plugin is in use on a LOT of websites, and such a drastic change has the potential to break those websites. I’ll be looking soon into upgrading the version of jQuery UI that ships with Squelch Tabs and Accordions. This might help, but we’ve seen this issue for a long time and on previous versions of jQuery UI, so I’d not be surprised if the problem persists on newer versions.

    Another possibility is I might simply create a new plugin altogether, or enhance this plugin to allow the choice of what library does the rendering of the tabs/accordions. But that runs the risk of adding a burden of complexity onto the end user.

    So in short: I can’t fix it right now, but in future versions of this plugin I hope to find a solution to this particular issue.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Grey space before tabs section in Rowling theme’ is closed to new replies.