Divi tip – Add link to phone number in top header

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>

Done.

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

[sc name=”responsive-ad”]

Photo by Anastasia Dulgier on Unsplash