Tell A Friend popup form WordPress plugin

This will create a popup form for your users to share the website link with their friends. The concept of this plugin is to open the Tell a Friend form in the popup window by clicking the button from the page (Sidebar, End of the post, or pages). Then, the plugin automatically picks the post link and sends it to their friend as well as the website admin (Optional) along with the entered message.

Here’s the step

  • First, click Tell A Friend Button from the page.
  • Next, It will open the form in the popup window.
  • Now fill your name and friend email address.
  • Enter the short message. But, this is optional box.
  • Finally, click the Send button in the form.

Live Demo (Click the button to see Live Demo)

Plugin features

  • Open form in popup window. Therefore, occupy less space in page.
  • Option to send the mail copy to admin.
  • Easy customization options for the mail content.
  • Admin page to set the from email address.
  • Ajax submission. Thus, no page refresh.
  • Movable but unblockable popup.

Installation instruction

First, download the plugin ZIP file wp-tell-a-friend-popup-form.zip from the download location.

Activate the plugin using the manual upload option.

Sign in to your WordPress dashboard. Navigate to the Plugins menu. And click Add New menu to upload the downloaded ZIP file (wp-tell-a-friend-popup-form.zip). Select the Upload Plugin button. Upload the available ZIP file and click Install Now button. Finally, click Activate plugin button to activate the plugin. Next, Go to the plugin admin page to change the default settings.

Install the plugin with the dashboard search option

Sign in to your WordPress dashboard and go to the Plugins menu and click Add New. Search wp-tell-a-friend-popup-form plugin using the search option. This will search the plugin in the WordPress repository. This action required an active internet connection. Find the plugin in the search result and click Install Now button, so that the plugin will be installed automatically on the website directly from the WP repository. Finally, click activate plugin button to activate the plugin.

Plugin admin customization

In your WordPress administrator section go to the Settings menu and select the Tell a friend menu to configure this plugin.

If the popup window is hidden or open under the menu, just increase the z-index value in the CSS stylesheet file. (This z-index property specifies the stack order of an element in the HTML. An element with greater stack order is always in front of an element with a lower stack order)

Tell a friend WordPress plugin

Plugin front end customization

Drag and drop the widget:

This is the easiest way, First, go to the Appearance menu and click Widgets. Then, click the ‘Plus’ icon on the page to bring up the widget block menu. Finally, search the widget Tell-A-Friend and drag and drop to your widget section. Otherwise, you can double-click to add the widget.

PHP code:

Copy and paste the below PHP code to your desired template location (in PHP file) to show the plugin on the theme. It allows you to embed the shortcode anywhere you want in the file. of course, you have to activate the plugin.

<?php echo do_shortcode( '[tell-a-friend id="1" title="Tell a friend"]' ); ?>

Shortcode:

Shortcodes are the simple way to add plugins into your WordPress posts, pages, and sidebars. Find the code below. and use it inside the posts.

[tell-a-friend id="1" title="Tell a friend"]

Frequently asked questions

Q1) How to change the form style?

In the plugin folder, we have a separate style sheet file (tell-a-friend.css) to change the form style. Alternatively, you can copy the entire content from this CSS file and paste it into your theme CSS file.

Q2) How to update the form client validation messages?

Javascript file “tell-a-friend-form.js”. In addition, follow the below page to update the file.

If you got any error or mail issue, just comment on the below-mentioned two lines in the JS file popup-contact-popup.js and try again. So it will display the exact error on the popup.

//alert(http_req.readyState);
//alert(http_req.responseText);

Q) How to change the Tell A Friend button image?

On the administration page, we have the text box option “Link Button/Text:” to update this button image.

Download location

http://www.gopiplus.com/work/2012/06/24/tell-a-friend-popup-form-wordpress-plugin-download-link/

Plugin official page

http://www.gopiplus.com/work/2012/05/21/wordpress-plugin-wp-tell-a-friend-popup-form/

WordPress page

https://wordpress.org/plugins/wp-tell-a-friend-popup-form/