1 Topic by bokehlover (edited by bokehlover 2013-12-03 10:22:44)

  • Registered: 2013-11-11
  • Posts: 5

Topic: Possible to remove vertical bar?

Is it possible to remove the thin vertical bar between the original and the additional buttons on the button bar? I just think it would look nicer without, and I cannot see it serves any purpose.

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Possible to remove vertical bar?

The vertical splitters separate different groups of buttons (such as navigation buttons and social sharing buttons) on the Button Bar.

There are no configuration options which would allow you to remove the splitters but you could remove them completely by using the following CSS in your gallery's 'index.html' page:

<style type="text/css">
    .jb-bb-splitter {
        border-width: 0px;
    }
</style>

However, this may have an unwanted side effect, for example when wrapping the Button Bar on screens of limited width, where Juicebox will not be able to accurately calculate the width of the Button Bar. (It would expect the splitters to be there.)
Therefore, it may be safer to hide (rather than remove) the splitters by using the following CSS:

<style type="text/css">
    .jb-bb-splitter {
        border-color: transparent !important;
    }
</style>

The splitters are usually only 1px wide each so hiding them should not make much of a visible difference in your gallery.

  • Registered: 2013-11-11
  • Posts: 5

Re: Possible to remove vertical bar?

Thank you so much for a very detailed answer! But I use the WordPress plugin and cannot find the index.html file to edit. Is this possible in my case?

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Possible to remove vertical bar?

Yes. You can add the code to the plugin's 'wp-juicebox/jbcore/classic/theme.css' file.
(Open the file in a plain text editor and copy and paste the code to the end of the file.)