Surprisingly, the phone number input on the top header is not linkable in Divi.

The reason is because it is ‘sanitized’ on output. So whatever you add to that field, it’s all stripped out before its displayed on the frontend.

The reasoning is because… Elegant Themes thought it was a good idea. I don’t agree, but I don’t disagree either. Sometimes it’s safe to sanitize those fields. So yeah, whatevs.


Anyways, let’s change that.

You’re gonna have to edit the header, so you’ll need a child theme. Get one here (Click me).

Inside that child theme, you’ll see header.php

Open it up.

Change line 65 to this:

<span id="et-info-phone"><a href="<?php echo esc_attr( 'tel:' .$et_phone_number); ?>"><?php echo et_core_esc_previously( et_sanitize_html_input_text( $et_phone_number ) ); ?></a></span>


Now you’ll get the phone number to link directly to the number. It’s pretty helpful on mobile devices.


Divi tip - Add link to phone number in top header To learn more about CSS, media queries, Flexbox and/or responsive web design, check out this course! Learn how to make Divi more responsive



Hi! Please consider signing up for my newsletter for... two emails (at most) a month of news, updates, and special offers, including child themes and more courses. Sound interesting? The signup form is right here!


Photo by Anastasia Dulgier on Unsplash