# Call Button in the Divi Header

> Adds a tap-to-call phone button next to the menu in Divi's default header, which is especially handy for local businesses on mobile.

- Type: PHP
- Runs: Frontend only
- Category: [Page Builders & Themes](https://wpide.com/library/category/page-builders/)
- Tags: divi, header, phone, mobile
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/divi-header-call-button/

## Code

```php
// Phone number to dial and the button text.
$wpide_divi_phone       = '+1 555 010 0199';
$wpide_divi_phone_label = 'Call us';

add_action( 'et_header_top', function () use ( $wpide_divi_phone, $wpide_divi_phone_label ) {
    $tel = preg_replace( '/[^0-9+]/', '', $wpide_divi_phone );

    if ( '' === $tel ) {
        return;
    }

    printf(
        '<a class="wpide-divi-call" href="tel:%1$s" style="float:right;margin:0 0 0 18px;padding:8px 16px;border-radius:999px;background:#2ea3f2;color:#fff;font-weight:600;line-height:1.2;position:relative;top:50%%;transform:translateY(25%%);">%2$s</a>',
        esc_attr( $tel ),
        esc_html( $wpide_divi_phone_label )
    );
} );
```

## Notes

Uses Divi's et_header_top hook, so it appears in the default header, not in Theme Builder headers.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Call Button in the Divi Header" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/
