Graphical Numbers

As long as this is a genuine improvement to the user experience.
It could be a simple CSS background-image thing.

I really needed this plugin quickly for a couple of sites – that’s why it’s so basic. But I hope to elaborate on it with more functionality as it appears necessary.

Yes, it would be very useful.

However, I can’t seem to get it to work. Just tried it on my client’s website – https://photoboothhireuk.com – on my Android mobile and the numbers are not dialable.

At the moment you have to add a class=”mobile_tel” to whatever number you want to become a link on a mobile device. So lets say you have:

<p>Dial this number: 0800 555 555</p>

If you add class=”mobile_tel” to the number…

<p>Dial this number: <span class="mobile_tel">0800 555 555</span></p>

Then the plugin turns it into the following if it detects a mobile browser (Android included):

<p>Dial this number: <a href="tel:0800 555 555"><span class="mobile"_tel">0800 555 555</span></a></p>

I guess you wanted it to scan the page for phone-number-like content and automatically add the link – I didn’t think of that.
Perhaps version 1.2 will do that.

You can now have graphical numbers.
Version 1.2 allows you to enclose any HTML in a shortcode – for example a phone icon. You put the phone number you want to dial in double quotes in the opening shortcode tag EG:
[telnumlink "013230555555"]<img src="myphoneicon" />[telnumlink]
– I’m told HTML5 validates with block-level elements inside anchor tags like this.
Alternatively any number you enclose in ‘[telnumlink]’ tags will become a diallable link (only for mobile devices – of course) EG:
[telnumlink]01323555555[/telnumlink]
And you can still use mobile_tel CSS class to add a diallable phone link – for places where you can’t use shortcode (like page templates or headers, footers etc) EG:
<span class="mobile_tel">01323555555</span>