Turn Text into Hyperlink in WordPress Tables

Every data tells you a story. Ninja Tables makes storytelling easy by transforming value and turning texts into hyperlinks in interactive data tables.

Raw table data becomes accessible if your audience can act on it. Suppose, there’s an email address in the data table. When in plain texts, this data is not expected to be clickable. Sure, you can copy it and open another window to send an email.

But Ninja Tables Value Transformation feature lets you get connected directly from the table with a single click!

You can do the same with phone numbers and make calls from the table.

In this blog, we’ll be explaining how this works out.

Spoiler alert: It only takes 2 steps!

Converting text to clickable links with Ninja Tables

A proper WordPress data table is easy to use like Excel sheets.

But to make the table dynamic and user-centric, you need clickable links in data tables.

You have Ninja Tables value transformation feature for that!

Step 1: Create a data table with transformable value

Here’s a dummy table we made with Ninja Tables. It contains the email addresses and contact numbers of some individuals.

Let’s say it’s an employee information table. Now if an employer needs to contact someone, copying the email address from the table and going to another tab just sounds like a lot of work.

What we can do here is simple. Use HTML to make the email addresses actionable right in the table. And the same goes for the contact numbers.

Step 2: Convert text data into clickable links

You want to make email addresses clickable for quick emailing from the table frontend.

Or, want to make a call from the frontend.

In Ninja Tables, you can do both!

First of all, move to the column that contains the text data you wanna transform into links.

Hover over that column or open the column from the “Table Configuration” tab.

Add the following code.

<a href=”mailto:{{row.email}}”>Email {{row.name}}</a>

{{row.email}} is the email column’s auto-generated shortcode. And {{row.name}} is to identify the exact owner to connect.

Instead of the text “Email,” you can add anything you want.

***Make sure to manually type the inverted commas if you copy-paste the code.

And to make calls, you only replace “mailto” with “tel.”

<a href=”tel:{{row.phone}}”>Call {{row.name}}</a>

Hit update and see the table frontend in preview.

Name	Email	Phone
Marice	[email protected]	+1 (815) 665-7823
Spencer	[email protected]	+1 (063) 372-1269
Hort	[email protected]	+1 (400) 617-2415
Jess	[email protected]	+1 (262) 651-4826
Peter	[email protected]	+1 (039) 006-8270

You can now contact all the email addresses with one click and make a call to individuals.

***The emails/contact numbers here are all made up. They can prompt sending email or making a call, but it may not go through. Use correct emails/numbers when you try.

FAQs

We have answers to some questions that may cross your mind.

How to convert multiple email addresses to hyperlinks?

With Ninja Tables, you can transform text value into hyperlinks easily.

Use an HTML code (<a href=”mailto:{{row.email}}”>Email {{row.name}}</a>) with the given auto-generated shortcode to convert email addresses of a column as we’ve shown in this blog.

How to hyperlink multiple cells?

Hyperlinking a text is super easy in Ninja Tables. You can either use the “Value Transformation” feature or just change the column Data Type into HTML.

Read the blog on adding links to a table.

How to send email from a data table?

If you’re using Ninja Tables, you can change the plain textual email addresses into actionable links. All you need is an HTML code (<a href=”mailto:{{row.email}}”>Email {{row.name}}</a>).

When you add the code and click on an email address, Ninja Tables will prompt your email service provider options. Select one and send your email right from there.

How to make a call from WordPress tables?

If your table has contact numbers, Ninja Tables will let you make calls directly from the table without typing the number somewhere else.

<a href=”tel:{{row.phone}}”>Call {{row.name}}</a> Add this code to the phone number column with the column’s auto-generated shortcode.

Bonus

If you want to turn table data into hyperlinks, using value transformation isn’t the only option.

This feature basically helps you contact an email address owner or call someone. To transform plain text emails/phone numbers, Transform Value in Ninja Tables comes in handy.

However, for other issues, you can simply use the “HTML” data type for columns. For example, if you paste a website link in a table cell and it doesn’t appear clickable, turn the column data type into “HTML.”

Now you can customize the text and add a link. See the “Review” and “Website” column.