[Resolved] Top Bar – Call button

[Darren]

Hi

As you know most things are moving to mobile so in the top bar I would like to create a button to say “Lets chat” and when they click the button it automatically opens up their caller screen on their phone with my Number ready to dial.
Is this possible ?

[Leo]

Hi Darren,

I believe this video should help:

[Darren]

Thanks this has helped a lot.

Do you know if there if a way of making the call button sticky?

[David]

Hi there,

can i see the site with the Call Button in place ?

[Darren]

https://darrenandrhianphotography.com

I would like the top bar to move with call button to scroll, so always visible if possible

[David]

OK, tricky to make that element sticky and not have it up most of the screen.
How about this.

Keep what you have added so far.
We’ll add a second button that will be part of the sticky navigation on mobile?

If thats good then:

1. create a new Block Element in Appearance > Elements.
2. The Element Type should be Hook, and the hook should be menu_bar_items
3. In the block editor add your button with the call number.
4. Select that Buttons block ( note that the Core Buttons Block is a buttons wrapper and a button inside, we want the wrapper ). And in Advanced > Additional CSS Class(es) add: hide-on-desktop hide-on-tablet sticky-call-button

Once thats done it should appear in the Mobile nav, let me know and ill provide some CSS so it only appears when its sticky.

[Darren]

Hi Thank that seems to have worked great 🙂

[David]

Glad to hear that!

Let us know if you need any CSS for hiding it where you don’t require it etc…

[Author]

Posts