How to Make URLs and Emails Clickable in Form Vibes Submissions – WordPress Fix

When using the Form Vibes plugin in WordPress to manage form submissions, many users face an issue: URLs and email addresses in form submissions are not clickable. This can be frustrating for site admins and users who want to quickly access linked content or send emails directly from form entries.

In this blog post, we’ll explore this common issue with Form Vibes and provide a simple solution to automatically convert URLs and email addresses into clickable links. This solution can be easily added to your WordPress site using your theme’s functions.php file or through a plugin like WP Code.

The Problem: Non-Clickable URLs and Email Addresses in Form Submissions

Form Vibes is a popular WordPress plugin used to store form submission data. However, by default, it doesn’t automatically convert URLs or email addresses into clickable links, which is inconvenient for users who need quick access to web pages or want to email addresses directly.

Without this functionality, any URLs or email addresses included in form submissions appear as plain text, and users have to copy and paste them into the browser or email client manually. This leads to a less-than-ideal user experience.

The Solution: Convert URLs and Emails to Clickable Links in Form Vibes

To resolve this issue, we can add a custom JavaScript solution to your WordPress site. This script will detect URLs and email addresses within Form Vibes submission data and automatically convert them into clickable links.

Here’s the code you can use to fix this issue:

How to Add This Code to Your WordPress Site

You can add this code to your WordPress site in two ways:

Option 1: Add the Code to functions.php

1. Go to your WordPress Dashboard.
2. Navigate to Appearance > Theme Editor.
3. Find the functions.php file of your active theme.
4. Paste the provided code at the end of the functions.php file (skip 1st line – which is the Php opening tag).
5. Save the file.

Option 2: Use WP Code Plugin

If you prefer not to modify theme files, you can use the WP Code plugin (formerly known as Code Snippets) to add custom code without directly editing your theme. This method is safer and recommended if you don’t want to risk breaking your theme’s functionality.

1. Install and activate the WP Code plugin from the WordPress plugin repository.
2. Navigate to Code Snippets > Add New.
3. Paste the provided code into the editor (skip 1st line – which is the Php opening tag).
4. Set it to Run Everywhere to apply the code globally.
5. Save the snippet.

Why This Fix Works

This solution works by using JavaScript to dynamically search for URLs and email addresses within the content of form submissions when displayed in the WordPress admin panel. It then wraps the URLs with anchor (<a>) tags and email addresses with mailto: links, making them clickable. The use of setTimeout ensures that the JavaScript runs after the page has fully loaded.

Conclusion

By adding this JavaScript fix, you can easily make URLs and email addresses in Form Vibes submissions clickable. Whether you choose to add the code to your theme’s functions.php file or use a plugin like WP Code, the solution is quick and easy to implement. This small tweak can significantly improve the user experience on your site, making it easier to interact with form submissions.

Have you faced similar issues with Form Vibes or other plugins in WordPress? Feel free to share your thoughts or ask questions in the comments below!