[Support request] Phone number not showing up as white text

[Nick]

I’ve included our phone number in a Call to Action banner and also the footer of our website (currently under construction) at http://staging.whiterosemodernfunerals.co.uk/ – the phone number is on a dark background – but because it shows up as a hyperlink on a tablet and mobile, the phone number doesn’t show up at all as links are the same dark colour as the background. I’ve specified white text for these sections, but that doesn’t help. Any ideas? Thanks

[David]

Hi there,

so that would be the number format detection on iOS devices converting that number to a link.
Theres a few options to stop it:

a. Tell the browser to not perform format detection on telephone numbers. With this PHP snippet

add_action( 'wp_head', function(){
    ?>
    <meta name="format-detection" content="telephone=no">
    <?php
});

OR

b. Edit that block and make it a Link and give it a specific link color.

OR

c. Select that block and in Advanced > Additional CSS Class(es) add no-to-telephone
Then add this CSS to your site:

.no-to-telephone a {
    color: color: var(--base-3);
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts