Topic: Bar problem on small screen

Hello,

Since I have added some social media buttons, the bar displays vertically and badly on my smartphone (Honor 8 Pro)

Not sure what I can do...

Thanks and Regards,

PR

Post's attachments

Screenshot_20180326-004853.png 667.9 kb, file has never been downloaded. 

You don't have the permssions to download the attachments of this post.

Re: Bar problem on small screen

This is due to your long backButtonText ("More Pascal RIBEN Galleries").
In Small Screen Mode (on mobile devices), the Back Button and Button Bar share the same horizontal space.
Space is reserved for the Back Button and, once this has been displayed, the remaining space is used for the Button Bar (which will wrap within the available space if necessary). This avoids the Back Button and Button Bar overlapping each other.
With your long backButtonText, there is enough space to the right of it (on your device) to display only one Button Bar icon (which is why it wraps to display all the icons in a single column).
If you were to reduce your backButtonText to something shorter (like "Home", for example) or use the 'home' icon (by setting backButtonUseIcon="TRUE"), then the Button Bar would have more space to display icons in a row.

Re: Bar problem on small screen

Thanks Steven for your quick and full support.

This long backButton Text doesn't go to the home page in this particular gallery but to my mailing list page, so I want people really notice it and click it and anyway I cannot use a Home icon. I guess I could or should get the same "click" result with a shorter backButtonText, I'm going to try to change it.

Thanks again and Best Regards,

PR

Re: Bar problem on small screen

... I cannot use a Home icon.

If you really wanted to, you could change the icon used for the Back Button to a custom icon more suited to the page that your Back Button redirects to.
If you'd like to try this, please take a look at the Using Custom Icons support section in the Theming Guide.
The IcoMoon library might have an icon that you could use for your mailing list link, otherwise you could create a new icon yourself.

I guess I could or should get the same "click" result with a shorter backButtonText, I'm going to try to change it.

Yes. There's no need to change the backButtonUrl (the URL associated with the Back Button). Just change the backButtonText to something shorter than "More Pascal RIBEN Galleries", for example "Mailing List".

Re: Bar problem on small screen

Thanks again for your support and the idea to change the icon.

Re: Bar problem on small screen

You're welcome!