DiceBar adds a mobile bottom bar to your site, also called a sticky footer
bar, holding the buttons your visitors actually need: a click to call button,
a WhatsApp chat button, directions, email, social media icons, or a link to
anywhere on your site.
You can add a call now button without touching a theme file, and it works
with every theme and every page builder.
Most people arrive on a phone. On a phone, a phone number in the footer is four
scrolls away, and a contact form is a wall. A bottom bar puts the action under
the thumb on every page, which is the whole idea.
What you can put in it
- Click to call button — taps straight into the dialler
- WhatsApp button — opens a chat, with a message already written if you want
- Text message button — SMS, with a prefilled body
- Email button — with a prefilled subject
- Directions button — opens the map app with your address
- Social profile buttons — thirty networks, drawn in their own colours
- Link, page, or scroll to a section
- Share and back to top
Four buttons is the most that fits on a narrow phone without labels being cut
short, so the plugin caps it there and tells you why rather than letting you
find out on a visitor’s screen.
Nine starter kits
Deciding what belongs in the bar is harder than configuring it, so there is a
one-click starting point for a restaurant, a clinic or salon, a trade call-out,
an online shop, a blog, a portfolio, and a row of social profiles. Everything
stays editable afterwards.
Four looks, including a frosted glass dock
Glass, the default, is a frosted panel floating clear of the screen edges, much
like the dock at the bottom of a phone. Sliders set how see-through it is and
how strongly it blurs what sits behind it. Solid drops the translucency for busy
photography. Minimal removes the panel entirely. Bold fills the bar in a colour
you choose.
Light and dark colour sets are set separately, so dark mode is what you decided
rather than an automatic inversion of your brand colour.
See it before you save
The settings screen shows a live preview of the real bar, drawn with the real
stylesheet, standing on a photograph, a light page or a dark page, at 320, 375
and 414 pixels wide. It warns you when a label is too long for the number of
buttons.
Works with any theme, and with page builders
The bar needs no placement work: it appears by itself on every page you allow
it on, in any theme.
To also drop the same row of buttons inside your content, use the shortcode
[dicebar]. It works in the block editor, in a widget, in a theme
template, and in Elementor, Divi, Beaver Builder, Bricks and Oxygen. Elementor
users also get a DiceBar widget in the panel.
Choose exactly where it appears
- Phones only, phones and tablets, or every screen, with the widths settable
- Everywhere, only on chosen pages, or everywhere except chosen pages
- Everyone, signed in visitors only, or signed out visitors only
- Per item as well as per bar, so one button can appear where another does not
Built to behave
- Works with page caching. Rules that depend on the page are worked out on
the server; rules that change between two visitors on the same page are worked
out in the browser. A cached page is never wrong. - Loads nothing when it shows nothing. No stylesheet, no script.
- No tracking of any kind. No analytics, no phoning home, no external
requests. A tap fires an event your own tag manager can listen for, and
nothing leaves the visitor’s browser because of us. - Accessible. Real links and buttons, a navigation landmark, visible focus,
an accessible name on every icon-only button, and reduced motion respected. - Gets out of the way. Optionally hides while scrolling down, steps aside
when a section you name is on screen, leaves room for a cookie banner, and
never prints. - Safe area aware, so it sits above the home indicator instead of under it.
Free, all of it
Every feature described here is in the free plugin. There is no locked tier and
no adverts in your dashboard.
Full documentation: dicecodes.com/mobile-bottom-bar-wordpress-plugin
Built and maintained by Dice Codes.