Add a Clickable Phone Number in WordPress
Every business, large or small, typically has a central phone number customers can call with questions and orders. If you’ve been on a business’s website to find their phone number, only to see that it isn’t clickable, you probably were frustrated by needing to copy and paste the number to call it. Knowing how to make a phone number clickable in WordPress is critical to spare your customers this kind of annoyance!
Thankfully, the process to add clickable phone number WordPress isn’t too complex. Looking for ways to add a call button to your blog? Don’t worry; we’ll go over that, too! Without further adieu, let’s get started with our sample post!
Add clickable phone number in WordPress
First, we’ll go over the simplest part: inserting an HTML telephone link to your blog. If you’re only looking to make an image or button into a phone link, feel free to skip to the next section (after making a practice post). You’ll need to log into your WordPress Dashboard first, of course.
Then you’ll need to click on “Posts” on the left-hand column as shown:
After that, you should see a page with a list of all your posts. Locate the “Add New” button and click on it, as shown in the following image:
After that, you’ll need to fill in some text. Most importantly, make sure to include a phone number in text that you’d like to turn into a clickable link in the practice post! An example of what it could look like so far is below:
Before we continue, I wanted to give you a quick reminder that our new clickable item will default to your current theme’s color, both for unvisited and visited links. If you’re looking to change the color of the link, we have a post for that!
Next, highlight the number itself, and you should see a menu pop up that looks something like this:
Then, click on that paperclip button that we boxed in yellow. That will let you add a link. You should then see a small textbox asking for some text or a URL. For your phone number link in HTML, the syntax is quite simple. Just type in: tel:XXXXXXXXXX where the sequence of “X”’s is the number you’re entering. In our example, this is tel:5555555555.
And that’s all there is for learning how to make a phone number clickable in WordPress! However, there are a few things you should know. First, this link usually will not work for desktop computers. Even if the user has a calling application like Skype installed, it’s hit-or-miss.
Were you just looking to learn how to make a phone number clickable in WordPress for Skype? If so, your time was not wasted! Remember, in our traditional telephone link, we used the format of “tel:[phone number]”. For Skype, change the “tel” to “callto”, so you would repeat the previous steps, except using the format of “callto:[phone number]”. However, using this format will make it so that users on mobile devices will also be asked to allow the browser to open Skype!
Add clickable phone number in WordPress by Using a Call Phone Button
So, now that we’ve gone over how to make a phone number clickable in WordPress as solely a text link, it’s time to bump it up a notch! In this section, we’ll just use a traditional HTML button. If you were looking to use an image, consult the next section.
First, you’ll need to create a new button in your post. You can do this by clicking onto a new line of the practice post. You’ll need to add a new “Content Block” by clicking the “+” button as shown in the image below:
In the search box that we highlighted with a yellow box, you’ll need to search for “button”. There should only be one result, which you should click on to continue our quest to learn how to make a phone number clickable in WordPress (as a button).
After you click on the “Button” Layout Element, you’ll be presented with some options. Remember, on the right-hand column of the page, you’ll be able to tweak the style of your button. Rather than using button and href tags, this approach is preferable. That’s because it keeps everything compatible with your theme and all devices.
In the image below, you’ll see that WordPress prompts you to enter text into the button itself. This is the text that will be displayed. You could either make this just the number itself or something like “Call Us”. In the box we highlighted in red below it, you’ll need to insert our “tel” link, so “tel:5555555555”, which is how to make a phone number clickable in WordPress using a button!
How to add clickable phone number in WordPress by using an Image as a Call Phone Button
Finally, we’ll take a look at how to make a phone number clickable in WordPress, but through an image. This is one of the most common approaches on the web. Once again, you won’t have to use HTML for the phone number; we’ll simply use WordPress’ “Content Blocks” again! This is one of the many wonders of WordPress.
VERY IMPORTANT: It’s easy enough to just take a screenshot on your iPhone and use that lime-colored “Call” button, right? Or perhaps you went on Google Images and found an icon that would fit perfectly with your blog. Unless you enjoy being the recipient of (very expensive) lawsuits or cease and desist orders, do not use images you don’t have permission to use. Just because an image is on the public Internet does not mean you are free to use it!
Unfortunately, there are many “legal trolls” looking to make a quick buck off of you, but that’s not happening on CleverSequence’s watch! The best way to avoid being targeted for unlawful use of images is to either: make your own image or find an image on a public domain or Creative Commons license. Here are a few search engines that you can use to find a suitable image as you learn how to make a phone number clickable in WordPress as an image. Remember, CleverSequence cannot guarantee these resources’ information on image licensing is correct!:
Let’s say we want to go with the “Call Us” image located here: https://www.publicdomainpictures.net/en/view-image.php?image=228295&picture=call-us
Click on the “Free Download” button as shown:
Once you’ve downloaded the image, click on a new line of your practice post and click that “+” button as we did earlier. The same “Content Block” dialog will appear. This time, search for “Image” and click on that, instead. You will be presented with a screen like this:
Click “Upload” button, and select your image. Then, by default, the same panel of options will appear as did when we added a button. Click that paperclip again, and follow the same process to add your “tel” or “callto” link.
You should now know how to add clickable phone number in WordPress, whether using just text, an HTML button, or an image! The best part about using WordPress for this is that you don’t even have to touch the actual HTML or CSS; the platform handles it for you! Good luck, and we hope you hear phones ringing soon!
In summary, here is how to add a clickable phone number in wordpress:
- For plain text, simply type the phone number, then create a hyperlink. For regular phones, it is in the form “tel:NNNNNNNNNN”, where “N” is a number. For Skype, it’s “callto:NNNNNNNNNN”.
- For your buttons to act as clickable phone numbers, create the Button as a Content Block, then add the “tel” or “callto” hyperlink on the right-hand pane.
- If you find an image you may legally use to be a clickable phone number, you’ll need to upload the image, select it, and similarly add a “tel” or “callto” hyperlink.
The above article may contain affiliate links, which help support Clever Sequence
PDF files are a homestay of the Internet. Longer documents, calendars, forms, and more are often linked to on sites
So, What Does “NoIndex” Mean? Some people call it “crawling” or “spidering”, but the official term for when a search
Previous Next Is it possible to become a UX Designer with a different background? YES. LISTEN. You have to become
You likely want to develop a web presence if you have a business. When you create your website or social
There are many reasons you may wish to learn how to set up a multilingual WordPress site. Unless your site
When it comes to word processing software, many people like to use Google Docs because it’s powerful and free to
Google Docs is an incredibly versatile and easy-to-use program that allows you to create a wide range of documents. Not
How to add music to Google Slides for the entire presentation is the kind of question that most people think
Security is the number one reason people change their passwords on anything including their iPhones and iPad. Hackers and thieves
Sending emails is one of the fastest and easiest ways to stay in contact with people you care about. Whether
Facebook has become the place to connect with friends and family. With more than 2.5 billion people using the social
TikTok is one of the best platforms for sharing videos and content. You can make new friendships via duets, add
There are many different social media sites that you can access online, but one of the reasons Instagram is so
It could be some of your friends’ birthdays today, but without the power of social media, you may never know
Being part of a Facebook Group allows you to stay connected to others, no matter where you are located in
If you enjoy creating maps, diagrams, posters, or other large items, there was a time when you had to head to a print shop to
When you make or edit a video, the result is often quite massive. Sometimes, these files take up much too much room on your Mac,
PDFs are one of the most common file types you can find online. Many people prefer using this format because it makes the information easy
Amazon changed how we shop online. The site offers a bit of everything, so it’s possible to find groceries, tools, books, office items, and everything
The internet makes it incredibly easy and convenient to share photos and other information with large audiences. It also makes it super easy for people