Thursday, July 9, 2020

How to Create a Paywall in WordPress (with Preview Options)

Do you want to create a paywall on your WordPress site to publish paid content?

Adding a paywall allows you to monetize some or all of your content with a subscription plan. This freemium model is already used by top publications like the NYTimes and the Washington Post.

In this article, we’ll show you how to easily create a paywall on your WordPress site without hiring developers.

Creating a paywall in WordPress

What is a Paywall and Why Use One?

A paywall is a way of hiding or locking your content until the reader pays for accessing it. This is normally done through an ongoing subscription.

If you want, you can also set a one-off fee for access to all paid content. Some websites also use the paywall to grow their email list by asking users to subscribe to their newsletter or by creating a free account.

Many newspapers have introduced paywalls to their websites. Here’s an example from the UK newspaper The Daily Telegraph:

The Daily Telegraph's paywall

And here’s the New York Times paywall which only requires an email subscription:

New York Times asking for an email address but not payment

In many cases, paywalls let readers access a limited amount of free content. For instance, readers might be able to view up to 5 articles before needing to enter their email address or purchase a subscription.

A paywall can be a great way to monetize if you provide lots of high-quality content. It’s suitable for sites that don’t want to make money online through other methods like running advertising or selling products.

Creating a Paywall on Your WordPress Site

For this tutorial, we’ll be using the MemberPress. It is the best WordPress membership plugin that allows you to easily sell subscription-based products on your website.

First, you need to install and activate the MemberPress plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Once you’ve activated the plugin, go to MemberPress » Settings » License page to enter your license key. You can find this information under your account on the MemberPress website.

Enter your MemberPress license key

Simply copy and paste your license key and click on the Activate button.

After that, you will need to set up a way to receive payments. MemberPress supports several popular payment gateways like PayPal, Stripe, and Authorize.Net.

You can add your payment method by going to the MemberPress » Settings page, switching to the ‘Payments’ tab, and then clicking on the (+) button.

You will need to provide a name for this payment method and then select your payment gateway from the dropdown menu.

Add payment method for your paywall subscriptions

MemberPress will prompt you to fill in details for that payment method. For instance, for standard PayPal payments, you’ll need to enter your PayPal email address:

Entering details for your chosen payment method

You can also add multiple payment options by simply clicking the (+) button and repeating the process.

Once you are satisfied with payment settings, don’t forget to click on the ‘Update Options’ button to store your changes.

Creating a Subscription Plan for Your Paywall

Now that you have completed the initial setup, it is time to create the paywall itself. To do that, you will need to create a membership level in MemberPress.

Simply visit the MemberPress » Memberships page and then click the ‘Add New’ button at the top.

Add new membership

On the next screen, you need to first give your membership plan a name (title) and then set a price under the ‘Membership Terms’ box. Here, we’ve called our membership ‘Premium Subscription’ and set the price to $5/month:

Setting up the new membership, including the price

You can set your membership terms to match your requirements. For instance, If you want to create a free membership, then you can leave the price at 0.00.

You can also choose between ‘Recurring’ and ‘One-time’ billing type. For recurring payments, you can choose from monthly, yearly, weekly, quarterly, or custom interval options.

Optionally, you can provide a description for your membership plan in the text editor or customize it further under ‘Membership Options’ box.

Membership options

The default settings would work for most cases, but you can still review them and see if you would like to change something.

Once you are finished, just click on the ‘Publish’ button to create the membership plan.

You can create multiple membership plans with different subscription levels. For instance, you can create a premium plan and a VIP plan which gives your users access to even more exclusive content and features.

Adding Content Behind The Paywall

Now that you have created a membership plan, it is time to choose which content you want to restrict with a paywall in WordPress.

MemberPress gives you powerful rules which provide multiple ways to restrict content to specific membership plans.

To set up a rule, you need to visit MemberPress » Rules page and click on the ‘Add New’ button at the top.

Creating a new rule

Next, you need to select the content that you want to restrict. Simply click on the first drop down to select the content that matches the specific conditions.

Creating rules to restrict access

You can select content by category, tags, child pages, individual posts, pages, and more. We choose ‘All content tagged premium’ for this example.

Below that, you need to select the membership plan or individual member. We choose ‘Membership’ and then the plan we created earlier.

You can now click on the Save Rule button to store your changes.

Now, if someone tries to view the content tagged ‘premium’ without a subscription, they’ll see this message:

The default message that visitors will see if they aren't subscribed and logged in

Tip: You can customize that message when adding or editing your rule. Simply scroll down to the Unauthorized Access section. There, you need to select Custom from the Unauthorized Message dropdown and type in the message you want to use.

Changing the unauthorized access message

You can add links, images, and format text here. You can also hide the login form and replace it with a link. Here is how the paywall looked on our test website.

Customized paywall in MemberPress

If you go back to Posts » All Posts in your dashboard, you’ll see that all posts that match that criteria have their access marked with the membership plan.

Posts with their access level listed

For more help with setting up MemberPress, check out our ultimate guide to creating a membership site.

Giving Non-Members a Limited Number of Free Views

What if you want to let non-members see a certain amount of your content for free? This can be a great marketing tool.

You can enable this in MemberPress by going to MemberPress » Settings » General in your WordPress dashboard:

Settings - General in MemberPress

Here, you’ll need to scroll down to the ‘SEO & PayWall’ section and check the ‘Enable PayWall’ option. You then need to enter the number of free views you want to provide.

Enabling the paywall feature in MemberPress

Note: You can also give search engines access to your protected content here. This lets your paywalled content rank in search engine’s results, but it requires turning off any caching plugins. This may slow down your WordPress site.

Make sure you click the Update Options at the bottom of the page to save your changes.

That’s all.

We hope this article helped you learn how to create a paywall on your WordPress site and add free views option. You may also want to see our guide on how to create an email newsletter and must have WordPress plugins to grow your traffic.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Create a Paywall in WordPress (with Preview Options) appeared first on WPBeginner.


July 09, 2020 at 06:00PM

Wednesday, July 8, 2020

How to Embed TikTok Videos in WordPress

Do you want to easily embed TikTok videos on your WordPress website?

By default, WordPress makes it super easy to embed a TikTok video inside your posts and pages. However, it doesn’t automatically display your latest TikToks.

In this article, we’ll show you how to easily embed TikTok videos in WordPress and show your recent TikTok videos automatically.

How to embed TikTok videos in WordPress

Embed TikTok Videos in WordPress without Plugin

This method is the easiest way to embed any TikTok video on your WordPress site. All you need to do is simply copy and paste the URL into your WordPress post or page.

First, you need to copy the URL of the TikTok video you want to embed by visiting it in your browser.

Copy TikTok URL

Next, you need to edit the post or page where you want to display the TikTok video. On the post edit screen, simply paste the URL in the content area.

Paste TikTok URL

As soon as you paste the TikTok link, WordPress will automatically load a preview of it in the post editor. You can now save your post or page and visit it to see your TikTok video in action.

Embedded TikTok video

You can also accomplish the same thing by using the TikTok block. On the post edit screen, click on the (+) to add a new block and then search for ‘TikTok.’

TikTok widget

Next, insert the block in post editor and then paste the TikTok video URL into the block settings. WordPress will automatically load a preview of the video.

TikTok embed

You can also insert TikTok videos into your WordPress site’s sidebar by using WordPress widgets.

Simply go to the Appearance » Widgets page and add the ‘Text’ widget into your sidebar.

After that, go ahead and paste the TikTok video URL into the text area. WordPress will now automatically display a preview of the TikTok video in the widget area.

Sidebar TikTok embed

Don’t forget to click on the Save button to store your widget settings.

While this method allows you to easily embed TikTok videos in WordPress, it doesn’t automatically display your latest TikTok videos. For that, you’ll need a plugin.

Embed Latest TikTok Videos Feed in WordPress

If you wanted to display your latest TikTok videos automatically on your WordPress blog, then you will need to use a TikTok plugin.

First, you’ll need to install and activate the QuadLayers TikTok Feed plugin. If you’re not sure how to do this, check out our guide on how to install a WordPress plugin.

Next, go to TikTok Feed » Feeds page. Here you’ll see the plugin has already added a demo TikTok feed using the WordPress hashtag. You need to click on the ‘+Feed’ button to add your own TikTok feed.

Add your TikTok Feed

This will bring up a popup where you can create a TikTok video feed by using a HashTag or entering a TikTok username.

You can also choose to display the videos in the Masonry style, which will show the videos in portrait mode. Alternatively you can choose the Gallery style, which displays the videos as square thumbnails.

General TikTok tab

We’ve set the options to display videos from a hashtag, which means any video with the #WordPress hashtag will show up in our feed.

And we chose the Gallery with a limit of 9 videos and 3 columns, so it shows up in a streamlined format on our page.

Once you’ve customized the settings to your liking, click save and then you’ll see the new feed with a shortcode ready for you to use.

TikTok Shortcode

Now you’ll want to copy that shortcode and paste it into a page or post. Simply head back to the page you want to insert your TikTok gallery into.

In the content editor, click on the (+) icon, search for ‘shortcode’, and select the shortcode widget.

Shortcode widget

From there, paste your shortcode into your post and then save your page.

Insert embed TikTok code

When you view your page, you’ll see that your gallery is embedded along with a ‘View on TikTok’ button that takes the user to the #WordPress tag feed on TikTok.com.

TikTok gallery in page

When you go back and edit your feed, you can select the ‘Button’ tab on the left and uncheck the box next to the ‘TikTok button’ field to remove the button.

TikTok button options

You also have the option to enable or disable the Popup options when someone clicks on a thumbnail in your gallery.

TikTok popup options

If you leave this option checked, any time someone clicks on a video, it displays a popup of the video instead of opening up the video in a new link, taking your reader away from your site.

TikTok Popup

On the video tab, you have the option to customize your feed by removing the video controls, preventing autoplay when clicked, increasing the space between videos, and more.

Video tab options

Lastly, you can also embed this shortcode into your sidebar to display your TikTok feed using a widget.

To do this, head over to the Appearance » Widgets page and add the ‘Text’ widget into your sidebar.

Now go ahead and paste the TikTok feed shortcode into the text area widget settings. Don’t forget to click on the Save button to store your changes.

Shortcode sidebar gallery

You can now visit your website to see it in action. Here’s how the TikTok feed looks on our demo site’s sidebar.

Sidebar TikTok siteview

We hope this article helped you learn how to embed TikTok videos in WordPress. You might also want to check out how to create a custom Instagram photo feed in WordPress, and our comparison of the best WordPress giveaway plugins to grow your followers.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Embed TikTok Videos in WordPress appeared first on WPBeginner.


July 08, 2020 at 04:30PM

Tuesday, July 7, 2020

How to Easily Add Title Attribute to Images in WordPress

Do you want to add the title attribute to images in WordPress? The title attribute makes images on your WordPress site more accessible and SEO friendly.

Similar to the alternate text, the title tag allows you to provide additional information about your image. This helps screen readers and search engines understand the context of the image inside your article.

In this article, we’ll show you how to easily add title attributes to images in WordPress.

Adding the title attribute to images in WordPress

What is the Title Attribute in Images?

The title attribute in images allows you to add a text description of your image. This makes it easy for screen readers and search engine bots to understand the image and it’s context.

We will show you some code examples to explain how the title attribute is used in HTML. But don’t worry, you wouldn’t need to add any HTML code to your website.

Normally, you can display images with the HTML tag like this:

<img src="/path/to/image/fruits.jpg" width="100" height="100" />

However, web crawlers, bots, and screen reading devices cannot actually see your images. To help those devices, you can use the alternate text and title text attribute in your images.

So, to help search engines and bots learn what your images are, you can add an alternate text attribute to your image tag.

The alternate tag attribute describes what your image is, and it is more important than title attribute. Here’s what it looks like:

<img src="/path/to/image/fruits.jpg" width="100" height="100" alt="A fruit basket" />

The alternate tag is also displayed when an image link is broken, not found, or when a browser is unable to load images. You’ll see the little image icon with the alternate tag next to it.

Broken image path

To make it easier for users with screen readers and accessibility needs, you can also add a title attribute to the image, like this:

<img src="/path/to/image/fruits.jpg" width="100" height="100" alt="A fruit basket" title="Fruit Basket" />

This title attribute appears in a popup when you hover your mouse over the image. Those who use screen reader software can configure their software to read this title.

Image title attribute

Using both the alternate text and the title attribute helps your image SEO, so you can bring more traffic to your site from search engines.

Adding Title Attribute to Images in WordPress

WordPress allows you to easily add alt text and title attributes within the content editor. First, go to Posts » Add New and create a post.

Click on the ‘+’ icon, and select the ‘image’ block to insert an image into your post or page.

Add image block

You’ll be prompted to upload or select an image from your media library. When you select your image, you’ll have the option to give it a title and enter your alt text.

Add alt and title to image

Important: This title is not the title attribute used in HTML. This one is used by WordPress internally to show your images in Media Library.

To add the actual title attribute, you will need to click on your image to view image settings in the right column.

Now click to expand the ‘Advanced’ tab and input the text you want to use for the title attribute. We wrote ‘Fruit Basket’ because that’s telling the internet what the image is.

Add title attribute

Now, when you view your site and hover your mouse over the image, you’ll see the popup that reads ‘Fruit Basket.’

Image title attribute

Add Title Attribute to Images in WordPress Classic Editor

If you are still using the older classic editor in WordPress, then you can still add title attribute by following similar steps.

In the classic editor, you’ll click the ‘Add Media’ button and then select your image.

Add image classic editor

Now, select the image you want to add to your post or page and fill out the Alt Text field and Title field.

Please keep in mind that this title is used by WordPress internally and is not the image title attribute.

Select image classic editor

Click the ‘Insert into post’ button at the bottom of your screen and then you’ll see your image in your classic post editor.

Edit image in post

From there, click to select your image and then click on the little pencil icon. This will bring up the ‘Image Details’ popup. From here, you need to click the Advanced Options dropdown to enter your Image Title Attribute.

Image title attribute field

Don’t forget to click on the ‘Update’ button at the bottom, then save your post and check it in your browser. you’ll see the popup showing your image title attribute when you hover your mouse over the image.

Image title attribute popup

We hope this article helped you easily add the title attribute to images in WordPress. You may also want to take a look at how to fix most common image issues in WordPress, and how to save images optimized for web speed.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Easily Add Title Attribute to Images in WordPress appeared first on WPBeginner.


July 07, 2020 at 05:00PM