How to Create and Send Newsletters from the Front-end

In this tutorial, we’ll show you how to allow someone to create and send newsletters from the front-end, without using the back-end dashboard on WordPress.

It can happen that you hire a person to send newsletters, check subscription statistics, send marketing emails, etc. However, that person does not need to use the wp-admin dashboard for anything else, so it would be ideal if front-end newsletter management would be available.

However, there’s no solution out there on the internet to create and manage a newsletter system that can be used completely from the frontend, without having to use wp-admin.

Fortunately, WP Frontend Admin can help you create any kind of frontend dashboard or web app using WordPress behind the scenes. You can display any wp-admin page on the frontend, and that’s what we’ll show you in this tutorial.

To allow users to create and send newsletters from the front-end on WordPress, you need to follow these simple steps:

1- Install and activate the Newsletter plugin

Although WP Frontend Admin works with any other newsletter plugin, we’ll use the “Newsletter” plugin behind the scenes to build our front-end newsletter system.

You can download the plugin here or search for it on your wp-admin Plugins section.

2- Install and activate the WP Frontend Admin plugin

This plugin allows you to display any wp-admin page on the frontend to create front-end dashboards and web apps using WordPress plugins behind the scenes.

Try plugin for free

You can try the premium plugin on your website for free for 7 days.

3- Display the Newsletter dashboard on the frontend

Displaying the Newsletter dashboard on the frontend to create a front-end newsletters system is really simple.

Go to Newsletter > Dashboard and click “View on the frontend” on the admin bar.

build a front-end newsletter system

WP Frontend Admin also works with WordPress page builders, here are some of them:

  • Elementor
  • Visual Composer
  • Gutenberg
  • Divi
  • Beaver Builder
  • WP Page Builder
  • Page Builder by SiteOrigin
  • Oxygen
  • Live Composer
  • Brizy
  • Etc.

You can display the Newsletter’s dashboard page on the frontend using the following shortcode on any page:

[vg_display_admin_page page_url="admin.php?page=newsletter_main_index"]

Now you need to click Preview to see the forms page on the frontend.

4- Select the newsletter dashboard page information

WP Frontend Admin will show the Quick Settings panel on the left side of the screen.

Note. It’s important to mention that the page style will depend on your theme. You can select your own colors to create the newsletters front-end page.

You can start configuring your newsletters front-end dashboard by selecting the following information:

  • Page title – Enter a title like “Newsletters” or “Manage Newsletters”
  • URL Slug – Since the Newsletter plugin uses the “newsletter” slug for their automatic newsletter page, you may need to enter another slug like “manage-newsletters”.
  • Page template – You can use your theme’s options by using the Default template or select any other page template.
  • Add page to this menu – You can add this page to a navigation menu to create a front-end dashboard. Just select the menu in this field.

build a front-end newsletter system

5- Hide any unnecessary elements from the front-end page

As you’ll notice, the Newsletter dashboard page contains many fields and options the users in charge of managing newsletters on the frontend won’t use.

That’s why WP Frontend Admin allows you to hide any unnecessary elements easily:

  1. Click Hide Element.
  2. Click on the element you want to hide.
  3. Repeat these steps with every element you want to hide.

build a front-end newsletter system

Here are some elements you may want to hide from your front-end newsletters page:

  • The plugin’s logo
  • “Get Professional Addons” button
  • Documentation section
  • Developers section
  • Video Tutorials section
  • Page footer
  • The “System” options

6- Edit any texts on your front-end newsletter page

You can customize the texts that appear on the front-end newsletters page. Just follow these simple steps:

  1. Click Edit texts.
  2. Edit all the texts you want.
  3. Click Stop editing texts.

build a front-end newsletter system

7- Save changes and the edit other newsletter pages

Once you’re done editing the main newsletters front-end page, you can tick the Hide notices added by other plugins or themes checkbox to prevent users from seeing wp-admin notices on the frontend.

Finally, you can click “Save” to apply all the changes you’ve made to the page.

build a front-end newsletter system

Now you can continue configuring your front-end newsletters system by editing the other pages.

For example, you can navigate to the statistics page and remove any unnecessary elements or edit the texts.

You can then move to other pages and do the same until you have edited all the pages and no unnecessary elements or confusing texts appear on your pages.

This is a great way to completely customize your front-end newsletters system.

build a front-end newsletter system

Once all the pages have been edited and published, your users will be able to start using them on the front-end.

Here is the main newsletters page on the frontend:

send newsletters from the front-end

This is the Newsletter plugin’s general settings page on the frontend.

send newsletters from the front-end

Allow users to send newsletters from the front-end

Something to keep in mind is that only users with the “exist” capability will be able to create and send newsletters from the front-end.

You can follow this tutorial to learn how to assign that capability to other user roles on WordPress.

Optional

You can add a log-out button to the navigation menu using this shortcode:

[vg_display_logout_url]

Just go to Appearance > Menus and add a new item as a custom link. Enter the shortcode in the URL field and the title in the Link Text field.

Note. For the shortcodes to work as links in menu items, you need to install the Shortcode in Menus plugin.

Creating a front-end newsletters system is possible and easy with the WP Frontend Admin plugin.

Try plugin for free

You can try the premium plugin on your website for free for 7 days.

Do you need help?

You can receive instant help in the live chat during business hours, or you can contact us and we will help you via email.