Phone number not visible on mobile version of website?

(Mark Lukens) #1

I have a bit of a problem with my new website layout (which is still only a test version so far). For some strange reason my phone number and KVK number (Dutch chamber of commerce registration number) are not shown on the mobile version of my new site, while they are visible as they should on a desktop?!

The test version of my new website can be seen here: The numbers that I am talking about are at the bottom of the home page (which is called “Bruidsfotografie” )

This is a print screen of the mobile version of my site where the numbers are not visible:

I’m using the Kinfolk theme by Michael David Design here. I did find out that the numbers will show if I put some letters between the digits (??) but as soon as I remove the letters the numbers are not shown again…

Anyone have any idea how this is possible and -more important- how I can fix this?

(Jason Bostick) #2

When I look on my phone it is there (i.e. I can press+hold and highlight the number) - so it looks like the text is just the same colour as the background. Is there a setting anywhere for that?

(Mark Lukens) #3

Well yes, the number is there indeed, when I press and hold the “empty field” the number gets highlighted but when I start scrolling again, the number disappears again… The color of the numbers should be exactly the same as the rest of the adress and icons. (almost white). As can be seen on the desktop version of the site…

(Jason Bostick) #4

Yeah, I was wondering if there was maybe a setting in the theme for it. It seems to be clickable for me - how about the settings for link colours maybe?

(Ric) #5

I have a similar scenario on my footer when viewed in Safari on an iPhone.
It doesn’t happen with Chrome on an iPhone.

This occurs when the browser ‘knows’ the number is a telephone number and automatically formats it to be clickable so a user can dial direct from the number. Hence it is being formatted as a link.
In my case my link colours in Foundation are similar to my background colour in the footer.

I have yet to sort it out but it only occurs in Safari in mobile.
I don’t want to change the link colour globally just for the telephone number.

(Mark Lukens) #6

Yep… after Jason hinted on this I tried to change the link colors… The digits changed too… And my case is the same as yours Ric, my link colors were the same as the background color of my ExraContent field. Ands thats why the digits were not visible. How stupid is this!

So I guess my only option is to change the Background color of my ExtraContent field and make the text in the field the same color as the link text, as I dont want to change my link colors globallly either…

Thx for the help guys.

Btw… what do you think about the load speed of this page, does it take too long to load all the images? I used images with 2000 pixels on the long side, should I perhaps make this smaller, like 1500 or so?

(Ric) #7

It scores poorly with Google’s Page Speed Insights.
They highlight the possibility of large image size reductions.