Beginner’s Guide to Preventing Blog Content Scraping in WordPress

Are you looking for a way to keep spammers and scammers from stealing your WordPress blog posts using content scrapers?

It is very frustrating as a website owner to see that someone is stealing your content without permission, monetizing it, outranking you in Google, and stealing your audience.

In this article, we’ll cover what blog content scraping is, how you can reduce and prevent content scraping, and even how to take advantage of content scrapers for your own benefit.

Beginner's Guide to Preventing Blog Content Scraping in WordPress

What Is Blog Content Scraping in WordPress?

Blog content scraping is when content is taken from numerous sources and republished on another site. Usually, this is done automatically via your blog’s RSS feed.

Unfortunately, it is very easy and very common to have your WordPress blog content stolen in this way. If it’s happened to you, then you understand how stressful and frustrating it can be.

Sometimes your content will be simply copied and pasted directly to another website, including your formatting, images, videos, and more.

Other times, your content will be reposted with attribution and a link back to your website, but without your permission. Although this can help your SEO, you may want to keep your original content hosted on your site only.

Why Do Content Scrapers Steal Content?

Some of our users have asked us why scrapers are stealing content. Usually, the main motivation for content theft is to profit from your hard work:

  • Affiliate commission: Dishonest affiliate marketers may use your content to bring traffic to their site through search engines in order to promote their niche products.
  • Lead Generation: Lawyers and realtors may pay someone to add content and gain authority in their community, and not realize it is being scraped from other sources.
  • Advertising Revenue: Blog owners may scrape content to create a hub of knowledge in a certain niche ‘for the good of the community’ and then plaster the site with ads.

Is It Possible to Completely Prevent Content Scraping?

In this article, we’ll show you some steps you can take to reduce and prevent content scraping. But unfortunately, there is no way to completely stop a determined thief.

That’s why we finish this article with a section on how you can take advantage of content scrapers. While you can’t always stop a thief, you may be able to gain some traffic and revenue through the content they have stolen from you.

What Should You Do When You Discover Someone Has Scraped Your Content?

Since it’s not possible to completely stop scrapers, you may one day discover that someone is using content they stole from your blog. You may wonder what to do when that happens.

Here are a few approaches that people take when dealing with content scrapers:

  • Do Nothing: You can spend a lot of time fighting scrapers, so some popular bloggers decide to do nothing. Google already sees well-known sites as authorities, but that’s not true of smaller sites. So this approach is not always the best in our opinion.
  • Take Down: Here you contact the scraper and ask them to take the content down. If they refuse, then you submit a takedown notice. You can learn how in our guide on how to easily find and remove stolen content in WordPress.
  • Take Advantage: While we actively work at having content scraped from WPBeginner taken down, we also use a few techniques to get traffic and make money from scrapers. You can learn how in the ‘Take Advantage of Content Scrapers’ section below.

With that being said, let’s take a look at how to prevent blog scraping in WordPress. Since this is a comprehensive guide, we have included a table of contents for easier navigation.

Trademark and copyright laws protect your intellectual property rights, brand, and business against many legal challenges. This includes illegal use of your copyrighted material or your brand’s name and logo.

You should clearly display a copyright notice on your website. While your content is automatically covered by copyright laws, displaying a notice will let you know that your content is copyrighted and that they cannot use your protected properties for business.

Display a Copyright Notice on Your Website

For example, you can add a copyright notice with a dynamic date to your WordPress footer. This will keep your copyright notice up to date.

This may discourage some users from stealing it. It will also help in the case that you do need to send a cease and desist letter or file a DCMA complaint to take down your stolen content.

You can also apply for copyright registration online. This process can be complicated, but luckily there are low-cost legal services that can help small businesses and individuals.

Learn how in our guide on how to trademark and copyright your blog’s name and logo.

2. Make Your RSS Feed More Difficult to Scrape

Since blog content scraping is usually done automatically via your blog’s RSS feed, let’s look at a few helpful changes you can make to your feed.

Don’t Include the Full Post Content in Your WordPress RSS Feed

You can include just a summary of each post in your RSS feed instead of the full content. This includes an excerpt as well as post metadata such as the date, author, and category.

There is certainly debate in the blogging community about whether to have full RSS feeds or summary feeds. We won’t get into that now except to say that one of the pros of having a summary only is that it helps prevent content scraping.

You can change the settings by going to Settings » Reading in your WordPress admin panel. You need to select the ‘Excerpt’ option, and then click the ‘Save Changes’ button.

RSS Feeds Can Contain Full Text or an Excerpt of Each Post

Now the RSS feed will only show an excerpt of your article. If someone is stealing your content through your RSS feed, then they will only get the summary, not the full post.

If you would like to tweak the summary, then you can see our guide on how to customize WordPress excerpts.

Optimize Your RSS Feed to Prevent Scraping

There are other ways you can optimize your WordPress RSS feed to protect your content, get more backlinks, increase your web traffic, and more. One of the best ways is to delay posts from appearing in the RSS feed.

The benefit is that when you delay posts from appearing in your RSS feed, you give the search engines time to crawl and index your content before it appears elsewhere, such as on scraper’s websites. The search engines will then see your site as the authority.

The safest and easiest way to do this is using WPCode because it has a recipe that automatically adds the correct custom code to WordPress.

Add a snippet using WPCode

For detailed instructions, see our guide on how to delay posts from appearing in your WordPress RSS feed.

3. Disable Trackbacks and Pingbacks

In the early days of blogging, trackbacks and pingbacks were introduced as a way for blogs to notify each other about links. When someone links to a post on your blog, their website will automatically send a ping to yours.

This pingback will then appear in your blog’s comment moderation queue with a link to their website. If you approve it, then they get a backlink and mention from your site.

This gives the spammer an incentive to scrape your site and send trackbacks. Luckily, you can disable trackbacks and pingbacks to give scrapers one less reason to steal your content.

Disabling Trackbacks and Pingbacks in WordPress

For more information, check out our guide on disabling trackbacks on all future posts.

You might also like to learn how to disable trackbacks and pings on existing WordPress posts.

4. Block the Scraper’s Access to Your WordPress Website

One way to stop scrapers from stealing your content is to take away their access to your website. You can do this manually by blocking their IP address, but most users will find it easier to use a security plugin such as a web application firewall.

Block the Scraper Using a Security Plugin (Recommended)

Blocking scrapers manually is tricky and a lot of work. Especially since many hacking attempts and attacks are made using a wide range of random IP addresses from all over the world. It’s almost impossible to keep up with all those random IP addresses.

That’s why you need a Web Application Firewall (WAF) such as WordFence or Securi. These act as a shield between your website and all incoming traffic by monitoring your website traffic and blocking common security threats before they reach your WordPress site.

For the WPBeginner website, we use Sucuri. It is a website security service that protects your website against such attacks using a website application firewall.

Basically, all your website traffic goes through the security service’s servers where it is examined for suspicious activity. They automatically block suspicious IP addresses from reaching your website altogether. See how Sucuri helped us block 450,000 WordPress attacks in 3 months.

Manually Block or Redirect the Scraper’s IP Address

Advanced users may also wish to manually block a scraper’s IP address. This is more work, but you can specifically target the scraper’s address once you learn it. Web developer Jeff Star suggests this approach when he wrote about how he handles content scrapers.

Note: Adding code to website files can be dangerous. Even a small mistake can cause major errors on your site. That’s why we only recommend this method for advanced users.

You can find the scraper’s IP address by visiting ‘Raw Access Logs’ in the cPanel dashboard of your WordPress hosting account. You need to look for IP addresses with an unusually high number of requests and keep a record of them, say by copying them into a separate text file.

Blocking the Scraper's IP Address

Tip: You need to make sure that you don’t end up blocking yourself, legit users, or search engines from accessing your website. Copy a suspicious-looking IP address and use online IP lookup tools to find out more about it.

Once you are confident that the IP address belongs to a scraper, you can block it using the cPanel ‘IP Blocker’ tool, or by adding code like this in your root .htaccess file:

Deny from 123.456.789

Make sure you replace the IP address in the code with the one you want to block. You can block multiple IP addresses by entering them on the same line separated by spaces.

For detailed instructions, see our guide on how to block IP addresses in WordPress.

Instead of simply blocking the scrapers, Jeff suggests you could send them dummy RSS feeds instead. You could create feeds full of Lorem Ipsum and annoying images, or even send them right back to their own website, causing an infinite loop and crashing their server.

To redirect them to a dummy feed, you will need to add code like this to your .htaccess file:

RewriteCond %{REMOTE_ADDR} 123\.456\.789\.
RewriteRule .* http://dummyfeed.com/feed [R,L]

5. Prevent Image Theft in WordPress

It’s not just your written content that you need to protect. You should also prevent image theft in WordPress.

Like text, there is no way to completely stop people from stealing your images, but there are plenty of ways to discourage image theft on a WordPress website.

For example, you can disable hotlinking of your WordPress images. This will mean that if someone scrapes your content, their images will not load on their site.

It will also reduce your server load and bandwidth usage, boosting your WordPress speed and performance.

Alternatively, you can add a watermark to your images that gives you credit. This will make it clear that the scraper has stolen your content.

You can learn these two techniques as well as other ways to protect your images in our guide on 4 ways to prevent image theft in WordPress.

6. Discourage Manual Copying of Your Content

While most scrapers use automatic tools, some content thieves may try to manually copy all or part of your content.

One way to make this more difficult is to prevent them from copying and pasting your text. You can do this by making it harder for them to select the text on your website.

To learn how to stop manual copying of your content, then see our step-by-step guide on how to prevent text selection and copy/paste in WordPress.

However, this will not completely protect your content. Remember, tech-savvy users can still view the source code or use the Inspect tool to copy anything they want. Also, this method will not work with all web browsers.

Also, keep in mind that not everyone copying your text will be a content thief. For instance, some people may want to copy the title to share your post on social media.

That’s why we recommend you only use this method if you feel it’s truly needed for your site.

7. Take Advantage of Content Scrapers

As your blog gets larger, it is almost impossible to stop or keep track of all content scrapers. We still send out DMCA complaints. However, we know that there are tons of other sites that are stealing our content that we just cannot keep up with.

Instead, our approach is to try to take advantage of content scapers. It’s not so bad when you see that you’re making money from your stolen content, or receiving a lot of traffic from a scraper’s website.

Make Internal Linking a Habit to Gain Traffic and Backlinks from Scrapers

In our ultimate guide on SEO, we recommend that you make internal linking a habit. By placing links to your other content in your blog posts, you can increase pageviews and reduce the bounce rate on your own site.

But there is a second benefit when it comes to scraping. Internal links will get you valuable backlinks from the people who are stealing your content. Search engines like Google use backlinks as a ranking signal, so the additional backlinks are good for your SEO.

Lastly, these internal links allow you to steal the scraper’s audience. Talented bloggers place links on interesting keywords, making it tempting for users to click. Visitors to the scraper’s website will also click the links, which will lead them straight back to your own website.

Auto Link Keywords With Affiliate Links to Make Money from Scrapers

If you make money on your website from affiliate marketing, then we recommend enabling auto-linking in your RSS feeds. This will help you maximize your earnings from readers who only read your website via RSS readers.

Even better, it will help you make money from the sites that are stealing your content.

Simply use a plugin like ThirstyAffiliates that will automatically replace assigned keywords with affiliate links. We show you how in our guide on how to automatically link keywords with affiliate links in WordPress.

Promote Your Website in Your RSS Footer

You can use the All in One SEO plugin to add custom items to your RSS footer. For example, you can add a banner that promotes your own products, services, or content.

AIOSEO RSS feed footer save

The best part is that those banners will appear on the scraper’s website as well.

In our case, we always add a little disclaimer at the bottom of posts in our RSS feeds. By doing this, we get a backlink to the original article from the scraper’s site.

This lets Google and other search engines know we are the authority. It also lets their users know that the site is stealing our content.

For more tips, check out our guide on how to control your RSS feed footer in WordPress.

We hope this tutorial helped you learn how to prevent blog content scraping in WordPress. You may also want to see our ultimate WordPress security guide, or check out our list of the best analytics solutions for WordPress.

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 Beginner’s Guide to Preventing Blog Content Scraping in WordPress first appeared on WPBeginner.

Should You Start a Blog or a YouTube Channel? (Beginner’s Guide)

Are you wondering whether you should start a blog or YouTube channel?

Blogging and vlogging are good ways to engage with your audience and grow your brand’s credibility. We are often asked by readers which they should start first blog vs YouTube?

In this article, we’ll explain our pick on blog vs YouTube and which you should start first with detailed explanation of our take.

Should You Start a Blog or a YouTube Channel?

TLDR: we recommend you start with a blog and add a YouTube channel later if needed

This is a comprehensive guide, so we’ve included a table of contents for easier navigation:

What Is a Blog?

A blog is a type of website where articles, called ‘blog posts’, are presented in reverse chronological order with newer content appearing first. Blog posts are a great way to share your expert knowledge with your audience, build credibility, and attract visitors to your site.

If you want to start an online business, or communicate better with your existing customers or audience, then you should think about starting a blog.

Blogs typically present information in a conversational style and are run by individuals or a small group of people. However, there are now tons of corporate blogs that produce a great deal of useful informational and thought-leadership content.

Typical blog posts also have a comments section where users can respond to the article by making comments or asking questions.

Blogging has been around since 1993 and has become an essential marketing tool for many businesses. But is it still relevant in the age of YouTube and social media?

Why Starting a Blog Is so Important Today

There are currently 1.9 billion websites in the world, and over 600 million are blogs. That means that blogs make up a third of the web.

Blogging has become an important marketing strategy for businesses due to its benefits. You or your business can use a blog to promote ideas, brands, stories, products, and more.

Here are some of the more important benefits of blogging and why you should consider starting a blog.

1. A Blog Will Bring More Traffic to Your Website

A typical business website consists of a few important pages. For example, you may have a homepage, landing pages for your products and services, and a contact page.

Unfortunately, search engines may often decide that your website is less important than thousands of other websites in the same industry, especially if they have been around longer.

Adding a blog allows you to publish additional content which over time will help you bring more traffic to your website.

That’s a major reason to start with a blog rather than a YouTube channel because YouTube videos will attract traffic to the YouTube platform instead of your own website. You own and control your blog, while the YouTube platform is owned by Google and will benefit them.

2. A Blog Will Help Strengthen Brand Recognition and Build Authority

A blog helps you strengthen your brand identity. It gives you more opportunities to use your custom logo across your website, your social profiles, search results, and more.

This brand recognition when combined with customer trust and authority adds enormous value to your digital assets.

Adding a blog allows you to establish authority by regularly publishing content on topics related to your industry.

If you are consistently publishing new content, you’ll become the go-to place for your users and other businesses interested in those topics.

3. A Blog Will Help You Generate More Leads and Conversions

More than 70% of people visiting your website today, will never find it again. That’s because there is so much content and information on the internet.

Starting a blog will help you convert website traffic into potential leads, subscribers, and social media followers.

For example, you can use tools like OptinMonster to build an email list and grow a social media following. And with push notifications, you can send targeted messages to your blog visitors and bring them back to your website.

4. A Blog Will Help You Build an Engaging Audience

A static website doesn’t leave much room for a conversation. Why not add a blog to your site where users can engage by leaving a comment and sharing your posts on social media?

This helps you build a community around your business which is extremely useful.

It will help your visitors develop an affinity with your brand which pays off when they are looking to make a purchase or recommend your products and services to friends and family.

5. A Blog Will Let You Educate Customers and Share News

Blog posts allow you to educate customers about different ways they can use your products. This will allow you to compare your product with competitors, showcase product features, inform users about benefits, and more.

They’re also the best place to share your business news, announcements, and sales events.

For instance, if you are launching a Black Friday sale, you can promote it with a blog post. And then promote that blog post across your website with a floating header or footer banner.

6. A Blog Will Let You Build Additional Revenue Streams for Your Business

Blogs provide many opportunities to generate additional revenue and make money online. For instance, you can display ads in your blog posts using Google AdSense.

You can also promote affiliate products and make money with affiliate marketing or use your blog to sell premium content using MemberPress or Easy Digital Downloads.

7. A Blog Helps You Repurpose Content for Other Marketing Channels

Adding a blog to your website allows you to actively use blog content across your other marketing channels, such as making YouTube videos based on blog post content.

For example, we use our written WPBeginner tutorials as a helpful starting point for creating YouTube videos. This makes our video producers’ jobs easier and saves time. Then we embed the YouTube videos into the tutorial so our visitors can choose to read or watch the content.

Still not convinced? You can learn even more reasons to start a blog by taking a look at our article on the benefits of blogging.

Starting a Blog vs Starting a YouTube Channel

Now that you know about some of the benefits of blogging, you can see why we recommend that you start a blog first, and then add a YouTube channel in the future if you need.

Let’s summarize the most important points. When you build a blog, you are creating a platform that you own and control. The content you create will attract visitors to your website where they can learn more about your products and services.

On the other hand, the YouTube platform will always be owned by Google. The search traffic generated by your content will take people to the YouTube website, not your own.

Creating blog posts first also makes it easier to create other types of content, such as YouTube videos. Usually, the first step in creating a video is to write a script. Because you have already created written content on your blog, a lot of the work is already done.

Besides that, creating YouTube videos requires expensive equipment such as a camera and lighting, and you’ll also need to purchase video editing software and learn how to use it.

Finally, your blog is the perfect place for your visitors to watch your YouTube videos. You can easily embed YouTube videos in a blog post, giving your visitors the choice of watching or reading your content. That’s a great user experience.

What You Need to Start a Blog

We know that starting a blog can be a terrifying thought specially when you are not geeky. Guess what – you are not alone.

If you want to start a blog, then WordPress is the most popular blogging platform recommended by experts.

Although WordPress is free, there are some costs involved in creating a self-hosted blog. You will need to choose and register a domain name and decide on a web hosting provider.

You may also want to pay someone to design your website and purchase premium plugins to add features. The total cost will depend on your needs and goals.

The good news is that you can build a fully functional WordPress website for yourself and keep your costs under $100. Bluehost, an official WordPress-recommended hosting provider, has agreed to offer our users a free domain name and over 60% off on web hosting.

You can learn the details and options in our guide on how much it really costs to build a WordPress website.

Even better, when you signup with Bluehost using our link, they will automatically install WordPress for you, so you can start building your blog right away.

All you need to do is log in to your Bluehost account, and then click the ’Log in to WordPress’ button to get started.

Bluehost Dashboard - log in to WordPress

After that, you will need to set up your WordPress install, choose a theme and some plugins, then get started on your first blog post.

We take you through the entire process step by step in our beginner’s guide on how to start a WordPress blog. We’ll summarize the main steps below.

The end result will be an attractive and functional blog that you own.

Selecting a Theme to Customize Your Blog’s Appearance

Customizing the look and feel of your blog is by far one of the most exciting and rewarding parts of the journey of creating your WordPress blog.

WordPress comes with a powerful templating engine that allows you to change the appearance of your website by installing themes.

There are thousands of free and paid WordPress themes available. You can choose one that looks closer to what you have in mind for your website.

WordPress Theme Stats

You can look for themes under the Appearance » Themes page. It will show you a bunch of default themes that come with your WordPress install.

For more themes, click on the ‘Add New’ button at the top to find more free themes.

Add new theme

For premium or paid WordPress themes, you can try trusted WordPress theme shops like SeedProdThrive ThemesAstraElegant Themes, and more.

However, there is such an abundance of WordPress themes that it may become difficult for beginners to decide which theme they want to use.

We recommend choosing a minimalist design with plenty of white space. This provides you plenty of room to customize the theme and make it your own.

For more details, see our guide on how to choose the perfect theme for your website as well as our list of the best free WordPress blog themes.

Creating Your First Blog Post

Once you have selected your WordPress theme, you are now ready to create your first blog post. You just need to click on the Posts » Add New menu in your WordPress dashboard.

You will see an editor area where you can write your first blog post.

Writing Your First Blog Post

WordPress uses a block-based editor that allows you to create beautiful content layouts for your blog posts.

To familiarize yourself with the editor, see our WordPress block editor tutorial.

Once you’re done writing, go ahead and click on the Publish button on the top-right corner of the screen to make your blog post publicly available.

Publishing Your First Blog Post

On the posts screen, you will notice several other sections such as Categories and Tags. You can use these to organize your blog posts into sections. We have a great write-up on the difference between categories vs tags, which we highly recommend that you read.

To utilize all the features on the posts screen, you should read our article on how to add a new post in WordPress (video included).

We also offer some helpful resources to help you brainstorm new post ideas to write about:

A lot of pro bloggers choose their specific topics strategically by doing keyword research. This helps their content rank higher in Google searches and get more traffic.

We have a step-by-step guide on how to do keyword research for beginners using the exact same method that we use on WPBeginner.

Extending and Growing Your Blog With Plugins

Once you publish your first blog post, you’ll probably want to get started with adding other usual elements on your website such as a contact page, galleries, sliders, and an email list. To add all these additional features, you need to use plugins.

Plugins are like apps for your WordPress website. They allow you to add new features and extend the functionality of WordPress without writing any code.

There are more than 60,000 free plugins available in the WordPress.org plugin directory alone. Plus, there are premium WordPress plugins sold by third-party developers with priority support and guaranteed updates.

WordPress plugins

However, you also need to consider which plugins you need to use to keep your WordPress website secure, private, and anonymous.

Here are our top picks of the best plugins to grow your blog.

  • All in One SEO is the best WordPress SEO plugin on the market and helps your anonymous website get more traffic from search engines.
  • SeedProd is a powerful WordPress page builder that allows you to use a drag-and-drop interface to create any type of page for your website.
  • MonsterInsights is the best WordPress Google Analytics plugin which helps you see where your visitors and coming from and what they see on your website.
  • OptinMonster is a conversion optimization software, which helps you convert website visitors into email subscribers and customers.
  • WPForms is the best WordPress contact form plugin and allows you to easily create forms for your website.

That’s just a start. You can learn how to add plenty of other features to your blog by checking out our list of useful tools to manage and grow your WordPress blog.

Monetizing Your WordPress Blog

WordPress is the largest publishing platform on the planet, and it powers over 43% of all websites. Many bloggers have successfully monetized their blogs, and you can too.

That’s why we put together a detailed list of proven ways you can make money online blogging with WordPress.

Unlike other articles on how to make money online, this is a comprehensive guide on how to make money at home legitimately, using blogging and WordPress.

Many of these methods require some investment of time and money to get started. As long as you’re willing to put in the effort, you’ll reap the reward.

Here are some of the main strategies we cover:

We hope this tutorial helped you learn why you should start with a blog instead of a YouTube channel. You may also want to learn how to create an email newsletter the right way, or check out our list of the best YouTube video gallery plugins for WordPress.

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 Should You Start a Blog or a YouTube Channel? (Beginner’s Guide) first appeared on WPBeginner.

How to Install and Setup Google Tag Manager in WordPress

Are you looking to install Google Tag Manager in WordPress?

Google Tag Manager lets you add tracking code snippets to your WordPress website. It is a free tool and allows you to track different user interactions.

In this article, we will show you how to properly install and set up Google Tag Manager in WordPress and explain the benefits.

how to install and setup Google Tag Manager in WordPress

What is Google Tag Manager?

Google Tag Manager (GTM) is a free tool by Google that lets you add, update, and manage code snippets called tags on your WordPress site.

Often website owners need to add multiple code snippets to track their conversions, form submissions, link clicks, and gather other analytical data on their website. With Google Tag Manager, you can easily add and manage all of these scripts from a single dashboard.

There are built-in tag templates for Google Analytics, Google Ads, Google Optimize, DoubleClick, and Google AdSense. The Tag Manager also works with several third-party analytics and tracking platforms.

This saves you the time of adding and removing tags from your code rather than managing it from an easy dashboard. Not to mention, all of these separate snippets get loaded in one script.

That said, let’s see how to add Google Tag Manager to WordPress. We will also show you an alternative method for tracking different user interactions on your site. The best part, you don’t have to edit code or set up tags.

Simply click the links below to jump ahead to your preferred section:

Adding Google Tag Manager in WordPress

First, you’ll need to visit the Google Tag Manager website and click the ‘Start for free’ button to sign up.

Google Tag Manager website

After login, you will come to the add new account page.

Go ahead and click the ‘Create Account’ button.

Create account in tag manager

Next, you can enter a name for your account and select a Country from the dropdown menu.

Tag Manager will also give you the option to share data anonymously with Google. You can simply click the checkbox and scroll down.

Enter account name and country

Now you need to add a container to your account. A container could be a website, iOS or Android apps, or a server. In this case, we will use the ‘Web’ option.

You can use your site’s domain for the container name. Once you’re done, click on the ‘Create’ button to continue.

Enter container name and select platform

You will now see a new window slide in from the right with the Google Tag Manager terms of service agreement.

You can click the checkbox at the bottom to accept the data processing terms and then click the ‘Yes’ button at the top.

Accept tag manager terms of agreement

Google Tag Manager will now create your account.

Next, it will now show you tracking codes that you need to add to your site.

Copy tag manager code

Simply copy these 2 codes, as you will need to add them to the header and body section on your WordPress website.

Adding Google Tag Manager Code to WordPress

The easiest way of adding code snippets in WordPress is using the WPCode plugin. It is the best WordPress code snippet plugin and lets you add and manage different custom codes on your website.

The best part, you can get started for free with the WPCode. However, there is also a premium version that offers more features like a code snippet library, conditional logic, auto-insert snippets, and more.

First, you’ll need to install and activate the free WPCode plugin. If you need help, then please see our guide on how to install a WordPress plugin.

Upon activation, you need to visit the Code Snippets » Headers & Footers page from the WordPress admin panel. Now enter the codes you copied earlier.

Ensure that you paste the <head> code in the Header field and the <body> code in the Body field, as you can see below.

Add header and body tag manager codes

Once you’re done, don’t forget to click the ‘Save Changes’ button.

Google Tag Manager is now ready to use on your WordPress website.

Creating a New Tag in Google Tag Manager

Next, you can create a new tag in Google Tag Manager and set up tracking on your WordPress website.

Let’s say you want to add Google Analytics 4 (GA4) to your WordPress website using Tag Manager.

First, you’ll need to click on the ‘Add a new tag’ option from your Tag Manager dashboard.

Create a new tag

After that, you can enter a name for your tag at the top.

From here, simply click on the ‘Tag configuration’ option.

Enter a title and click tag configuration

Next, Tag Manager will show you different tag types to choose from.

For instance, this will include tags for Google Analytics, Google Ads, Floodlight, and more. We’ll select ‘Google Analytics: GA4 Configuration’ for this tutorial.

Select a tag type

Next, you will need to enter the details of your tag.

First, you can add the Measurement ID.

Enter measurement ID

You can find the Measurement ID by logging into your Google Analytics account.

Simply head to the Admin » Data Streams option under the Property column. Go ahead and click on your Data Streams to view the measurement ID.

Select your data stream

When a new window opens, you should see the Measurement ID in the top right corner.

You can simply copy the ID.

Copy your Measurement ID

Now head back to the Google Tag Manager window or tab, and enter the measurement ID.

After that, you can scroll down and click on the ‘Triggering’ option.

Add a trigger

Google Tag Manager will now show built-in triggers to choose from.

Go ahead and select the ‘Initialization – All Pages’ option.

Select initialization all page trigger

After selecting the trigger, you will need to store your settings.

Simply click the ‘Save’ button in the top right corner.

Save your GA4 tag

You should now see your newly created tag.

Go ahead and click the ‘Submit’ button to run the tag.

Preview and submit your tag

Set Up Advanced Tracking Using MonsterInsights (Easy Way)

Now that you know how to install and use Google Tag Manager, you can use an easier way of setting up advanced tracking on your WordPress site.

With MonsterInsights, you don’t have to perform complicated setups in GTM. It is the best Google Analytics plugin for WordPress and automatically configures advanced tracking for you. You also don’t have to worry about making a mistake that could mess up your tracking data.

The best part, MonsterInsights shows reports inside your WordPress dashboard. You won’t have to leave your site to see its performance. It presents data that matters for your business and helps uncover insights.

For this tutorial, we will use the MonsterInsights Pro version because it includes advanced tracking features and premium addons. There is also a MonsterInsights Lite version you can use to get started for free.

First, you’ll need to install and activate the MonsterInsights plugin. If you need help, then please see our guide on how to install a WordPress plugin.

Upon activation, you will see the MonsterInsights welcome screen. You can click the ‘Launch the Wizard’ button and follow the onscreen steps to configure Google Analytics.

Launch setup wizard

For more details, please see our guide on how to install Google Analytics in WordPress.

MonsterInsights will work out of the box and automatically add tracking in Google Analytics.

Here are some of the tracking features the plugin offers:

1. Track Link and Button Clicks

MonsterInsights sets up link click and button click tracking out of the box on your website. Google Analytics doesn’t track link clicks by default, and you’d have to use GTM to add tracking.

For instance, you can track affiliate performance and see which links users click the most. This way, you can grow your revenue by promoting affiliates that are getting a lot of clicks.

Outbound and affiliate links report

Similarly, the plugin also tracks outbound link clicks. These are links to other websites on your site. You can use this data to see create new partnerships, signup for an affiliate program, and create new content on your own site.

Besides that, MonsterInsights also helps track telephone links, file downloads, call-to-action (CTA) button clicks, and more.

2. Set Up eCommerce Tracking in WordPress

If you have an online store, then MonsterInsights helps you track its performance without editing the tracking script or using Google Tag Manager.

It offers an eCommerce addon that lets you enable eCommerce tracking in WordPress in just a few clicks. You can see your site’s overall conversion rate, transactions, revenue, average order value, top-selling products, and much more.

Ecommerce report in MonsterInsights

For more details, please see our guide on how to properly set up eCommerce tracking in WordPress.

3. Configure Form Conversions Tracking

With MonsterInsights, you can also set up form conversion tracking in Google Analytics. The plugin offers a Forms addon that automatically tracks WordPress forms on your site.

If you use Google Tag Manager, then you’d have to create separate tags for all your forms and track them in Google Analytics.

However, MonsterInsights makes this process super simple. Plus, you can view the data inside the WordPress dashboard.

Forms report

4. Automatically Enable Scroll Depth Tracking

Ever wonder how far people scroll your web page before leaving your site? Scroll depth tracking shows exactly that and helps you place your banner ads and CTAs in the right place to boost conversions.

MonsterInsights automatically enables scroll tracking on your website. There is no need for additional setup using Google Tag Manager or modifying the tracking code at all.

Scroll tracking

You can read our guide on how to add scroll depth tracking in WordPress with Google Analytics.

We hope this article helped you learn how to install and setup Google Tag Manager in WordPress. You may also want to see our guide on the ultimate guide to WordPress SEO and the best live chat software for small businesses.

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 Install and Setup Google Tag Manager in WordPress first appeared on WPBeginner.

How to Enable Imagick on Your WordPress Site

Do you want to enable Imagick on your WordPress website?

Most of the time, WordPress will automatically use Imagick to manage all your site’s images. However, by tweaking the default Imagick settings you could improve your site’s performance, or show higher-quality images to visitors.

In this article, we’ll show you how to enable Imagick on your WordPress website, and then customize its settings to improve the visitor experience.

How to enable Imagick on your WordPress site

How Does WordPress Use the Imagick Software?

Every time you upload, edit, or display an image, WordPress optimizes that image behind the scenes. This process makes sure your images look great and load quickly.

By default, WordPress uses Imagick or GD Library to optimize images. These are libraries, or collections of pre-written code anyone can use. They allow WordPress to display, create, convert, and edit images.

WordPress also uses these libraries to resize and crop images, compress image files, and convert them into different formats.

Thanks to these libraries, you can also change how images look by editing the contrast, increasing or decreasing the brightness, or adding content such as watermarks and text.

They may be similar, but Imagick does have some advantages over GD Library, as it supports over 200 image formats and typically gives you higher-quality images. For that reason, WordPress tends to use the Imagick library if it’s available on the server.

Why You Should Customize Imagick on Your WordPress Website

Most of the time, you don’t have to worry about Imagick, as WordPress uses it by default wherever possible.

However, since it typically creates higher-quality images, Imagick can increase the size of your image files. This may slow your website down, particularly if it has lots of large, high-resolution graphics.

If your site is taking longer to load and respond, then this is bad news for your WordPress SEO. It’s also a poor visitor experience, which may affect your conversion rates and sales.

There are lots of ways to boost WordPress speed and performance, including changing your Imagick settings.

Some websites have the opposite problem.

Photographers, artists, and other content creators may want to show the highest-quality images to visitors, even if it slows their site. Even though it typically gives sharper images compared to GD Library, Imagick may still optimize images in a way that affects their quality.

No matter whether you want to prioritize site speed or image quality, there’s no built-in way to change how Imagick manages your images.

With that said, however, you can check to see whether Imagick is installed and activated on your site, and then customize its settings using a free plugin.

How to Enable Imagick on Your WordPress Site

The easiest way to customize Imagick is by using ImageMagick Engine. This plugin allows you to change how Imagick processes your images. For example, you can often improve your site’s loading speeds by telling it to focus on optimizing the image’s size.

The plugin can also disable and enable Imagick with just a few clicks. This is perfect if Imagick isn’t already activated on your server.

First, you’ll need to install and activate the plugin. If you need help, then please see our guide on how to install a WordPress plugin.

Upon activation, go to Settings » ImageMagick Engine. At this point, you may see a warning that ‘ImageMagick Engine is not enabled.’

The ImageMagick Engine WordPress plugin

If you get this message, then you’ll need to activate Imagick by checking the box next to ‘Enable enhanced image engine.’

Then, click on ‘Save Changes.’

How to enable Imagick on your WordPress site

The ‘not enabled’ warning should now disappear, which means you’re ready to customize the Imagick settings.

Note: Do you see an ‘ImageMagick PHP module not found’ warning instead? This means the ImageMagick module isn’t installed on your server. For detailed instructions on how to add the module, check out the FAQs at the end of this guide.

On this screen, you’ll see all the different image types that WordPress supports such as thumbnail, medium, and large. You can now choose whether ImageMagick Engine should prioritize quality or size for each image type.

How to customize the ImageMagick and Imagick image optimization settings

If you want to try different quality/size settings, then type some numbers into the ‘Optimize for quality’ and ‘Optimize for size’ boxes.

You can use any number between 0-100. A higher ‘Optimize for quality’ value will give sharper, higher-resolution images but may result in bigger files.

Customizing the image optimization settings in WordPress

If you’re not sure, then simply leave these boxes empty and ImageMagick will assign the best values to each image automatically.

When you’re happy with how the plugin is set up, click on ‘Save Changes.’

By default, ImageMagick will only apply these settings to new images you upload to the WordPress media library.

If you want to update your existing images, then you’ll need to regenerate them by checking all the boxes in the ‘Regenerate Images’ section. Then, go ahead and click on ‘Regenerate.’

Regenerating images in WordPress

ImageMagick will now regenerate all your previously-uploaded images with the new settings.

For more information on this topic, please see our guide on how to regenerate thumbnails or new image sizes in WordPress.

FAQs: How to Enable Imagick on Your WordPress Site

Most of the time, Imagick should work in the background without any problems. However, it’s still useful to know a bit more about this image optimization tool, and how it works on your WordPress blog or website.

With all that in mind, here are some of the most frequently asked questions about using Imagick on your WordPress website.

What’s the Difference Between ImageMagick and Imagick?

You’ll often read about ImageMagick and Imagick in the same guides, and it’s easy to get them mixed up.

ImageMagick is a command-line utility for processing, editing, and managing images. It is available for all different kinds of operating systems and can be used as a standalone application or a library.

Meanwhile, Imagick is a PHP extension of ImageMagick. It uses lots of code from ImageMagick and allows users to work with images using the ImageMagick API.

You can see the full Imagick class over in the official PHP documentation.

How Do I Install the ImageMagick PHP Module on My Server?

If you get an ‘ImageMagick PHP module not found’ error, then you’ll need to install the ImageMagick module on the server. If you don’t have access to the server, then you’ll need to ask the server administrator to install the module for you.

If you do have access, then you can install the module yourself.

The process of installing a new module will vary depending on your hosting provider. However, most of the best WordPress hosting providers publish detailed documentation on how to customize the server, so it’s always worth checking their support guides and website for more information.

Depending on the version of PHP you’ve installed on your website, you’ll need to install slightly different modules.

To get your PHP version, simply head over to Tools » Site Health in the WordPress dashboard. Then, click on the ‘Info’ tab.

How to check the PHP version on your WordPress website

Here, find the ‘Server’ section and click to expand.

You’ll find the information you need under ‘PHP Version.’

Getting the PHP version on your WordPress website

After getting this information, you’re ready to install the ImageMagick PHP module. Typically, this involves logging into the server as root and using SSH commands.

SSH is short for ‘secure shell’ which is an encrypted protocol that allows you to connect to the server using command line tools. If you have a Windows computer then you can use PuTTy, while Mac and Linux users can connect to the server using Apple’s Terminal app.

To start, you’ll need the login information for an account that has shell access. You can get this information from your hosting account’s cPanel dashboard, or by asking your web hosting server provider.

Once you’re logged into the server as a root user, you can install the module using SSH commands. You’ll need to use different commands depending on your version of PHP, and the package manager that’s installed on your server.

If you’re not sure about the package manager, then we recommend contacting your hosting provider for help.

As an example, let’s see how you can install Imagick for PHP 8.1, using the Advanced Package Tool. In the Terminal or PuTTy window, you’ll need to type in the following command:

apt-get install php81rc-pecl-imagick

Then, press the ‘Enter’ key on your keyboard to run the command.

Once it’s finished, you’ll need to reload PHP-FPM, which clears the cache. Simply use the following command:

systemctl reload php81rc-fpm

Once you’ve done that, Imagick should now be installed on your server. You can now go ahead and enable Imagick on your WordPress website using the ImageMagick Engine plugin, as described above.

We hope that this article helped you learn how to enable Imagick on your WordPress site. Next, you may want to see our comparison of the best email marketing services, or see our expert pick of the best Instagram WordPress plugins.

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 Enable Imagick on Your WordPress Site first appeared on WPBeginner.

How to Create a Loyalty Program in WooCommerce

Do you want to create a loyalty program in WooCommerce?

A loyalty program can keep customers coming back to your online store, and keep them away from your competitors. It can also be a great way to reward your best customers and make them feel valued.

In this guide, we’ll show you how to create a loyalty program for your WooCommerce store.

Creating a loyalty program in WooCommerce

Why Create a Loyalty Program in WooCommerce?

Creating a loyalty program can be a great way to get more sales on your online store.

A loyalty program encourages customers to keep coming back to your WordPress website, which is the key to running a successful business over the long term. It can even boost average spend per customer by giving shoppers a reason to add more items to their basket.

Most stores give customers points for buying products and services. However, you can also reward customers for other actions like creating an account, placing their first order, signing up to your email newsletter, or spending over a certain account.

You might even give customer extra points for returning to an abandoned shopping cart and completing their purchase. In this way, a loyalty program can help you recover WooCommerce abandoned cart sales.

With that said, let’s take a look at how to add a loyalty program in WooCommerce.

Setting Up Your WooCommerce Loyalty Program

The easiest way to create a loyalty program is by using Advanced Coupons. It is the best WordPress coupons plugin and lets you create all kinds of coupons, programs, buy one get one free offers, and other rewards.

After creating a loyalty program, Advanced Coupons will show the customer how many points they’ll get for each action, including buying a specific product.

The customer will see a message in their shopping cart to let them know how many points they'll earn

First, you’ll need to install and activate both the free Advanced Coupons plugin and the premium Advanced Coupons Loyalty Program addon. For more information, please see our step-by-step guide on how to install a WordPress plugin.

Note: You can purchase the Advanced Coupons and Loyalty Program plugins together by getting the ‘All-In-One Bundle’.

After that, simply go to Coupons » Loyalty Program in your WordPress admin dashboard and click on the ‘License’ tab.

Adding a license to the Loyalty Program WordPress plugin

You can now enter your license key and the email address you used to purchase Advanced Coupons. You can find this information by logging into your account on the Advanced Coupons website.

After that, go ahead and click on the ‘Settings’ tab. This brings you to a screen where you can build the loyalty program.

To start, let’s reward members with points when they take certain actions on your website, like leaving a product review, posting a comment, or buying a product.

In the ‘Price to points earned ratio,’ we can see that the Loyalty Program plugin gives customers 1 point for every $1 spent.

The points earned ratio

If you want your WooCommerce loyalty program to look more impressive, then you give customers more points. For example, members might earn 2 points or 10 points for every $1 they spend.

‘Points to price redeemed ratio’ is how many points it takes to earn a dollar as part of your loyalty program.

By default, customers earn $1 for every 10 points. That means the customer needs to redeem 10 points to get a $1 discount coupon. You can change these values to anything you want.

You can also change the name of your loyalty scheme by typing into the ‘Points name’ field. We’ve gone with ‘Awesome Points’ for our loyalty program, but you might want to use something more branded, like Starbucks does with their ‘Stars’.

Changing the name of your WooCommerce loyalty program

Next, you’ll need to decide how your points are calculated. For instance, you may want to give a customer less points if they use a coupon code, compared to a customer who didn’t use a coupon. In this way, you can give the best rewards to your best customers.

To do this, click on the ‘Points Earning’ tab. Here, you can check the boxes to take any discounts, tax, shipping costs, and any fee amounts into account when awarding points.

Calculating points in a WooCommerce loyalty program

Many online marketplaces and digital stores only reward customers for spending money. However, there may be other actions that benefit you, so it’s a good idea to reward customers for taking these actions.

For example, you might want to reward visitors for registering with your membership site, posting a product review, or even commenting on a blog post.

Simply scroll to the ‘Point Amounts’ section and then click the switch for any action that will earn the customer points.

Point amounts toggle

After activating these toggles, check whether there are any new settings to configure.

For example, you’ll need to type in how many points customers will get for registering as a new user.

Awarding points for registering as a new customer

You can also encourage shoppers to spend more by awarding extra points for orders over a certain amount.

To do this, enable the ‘Spending over a certain amount’ switch and then type a value into the ‘Spending over a threshold’ field.

How to create a threshold for your WooCommerce loyalty program

During busy shopping periods you may want to give customers an extra reason to buy from your store. For example you might award extra points during Black Friday, so customers aren’t tempted to shop with a competitor.

You can give customers extra points during a specific period by enabling the ‘Extra Points To Earn During Period’ slider. Then, enter a date and time range into the ‘Extra points to earn during period’ section and type in how many points customers will earn.

Awarding extra points for members of your eCommerce loyalty program

There are some more settings you may want to look at, but this is enough to create a loyalty program in WooCommerce. When you’re happy with how the program is set up, scroll to the bottom of the page and click the ‘Save changes’ button.

Your new WooCommerce loyalty program is now live.

Automatically Creating Accounts for Your Customers

Your customers will need to create an account in order to collect loyalty points.

Already, this encourages people to sign up to your online store. However, you can also create an account automatically when a visitor makes their first purchase. This can improve the shopping experience, and may get you some extra members.

To automatically create an account for a new customer, go to WooCommerce » Settings. Then, click on the ‘Accounts and Privacy’ tab.

Changing your WooCommerce account settings

To start, you may want to uncheck ‘Allow customers to place orders without an account’, so that customers can’t checkout as a guest. This will encourage more people to register with your site, but it may cause more shoppers to give up on a purchase and abandon their shopping carts.

With that being said, it’a a good idea to set up WooCommerce conversion tracking and track visitors to your WordPress website. You can then see whether this change hurts your conversion rates.

Next, check the ‘Allow customers to log into an existing account during checkout’ box.

Once you’ve done that, you’ll want to make it as easy as possible for customers to create an account. With that in mind, we recommend checking all the boxes in the ‘Account creation’ section, as you can see in the following image.

Disallowing the option to checkout as a guest in WooCommerce

Now, WooCommerce will automatically send an email to first-time customers with information on how to access their new account.

The WooCommerce Loyalty Program in Action

Your loyalty program is up and running! Once a customer has earned loyalty points, they can turn them into coupons by going to My Account » My Reward Points.

The customer can then simply type in how many points they want to use, and your WordPress blog or website will show how much the coupon is worth.

The customer can go ahead and click ‘Redeem’ to create that coupon.

In the following image, the customer has created a $5 coupon by converting 500 of their points. They still have 550 points left to redeem.

The customer can turn their earned points into coupons in their account

We hope this tutorial helped you learn how to create a loyalty program in WooCommerce. You may also want to check out our guide on how to create a WooCommerce popup and the best virtual business phone number apps.

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 Loyalty Program in WooCommerce first appeared on WPBeginner.

How to Test the Responsiveness of a WordPress Theme

There are thousands of responsive WordPress themes out there, and it’s no secret that some are remarkably better than others. So, how can you be sure that the theme you’re thinking of using will provide your visitors with the kind of world-class user experience they expect, regardless of the device you use? The answer is [...]

Read More...

The post How to Test the Responsiveness of a WordPress Theme appeared first on Learn WordPress with WPLift.

How to Add an SEO Editor Role in WordPress

Do you want to add an SEO Editor role in WordPress?

If you have hired an SEO specialist to work on your website, then adding them as an SEO editor is the safest way to give them access to your WordPress website.

In this article, we’ll show you how to easily add an SEO editor role in WordPress.

How to Add an SEO Editor role in WordPress

Why Add an SEO Editor Role in WordPress?

WordPress comes with a user role management system that defines what a user can and cannot do on your website. You can assign different user roles to your team members depending on their job descriptions.

By adding an SEO Editor / Manager role to your WordPress website, you will be providing secure access to the SEO features and tools to some specific members of your team.

An SEO Editor role has access to the SEO settings for all your posts and pages. This allows them to optimize posts for SEO and work on search rankings.

An SEO Manager tends to have access to sitewide SEO settings including sitemaps, redirects, local SEO, and more.

By default, WordPress doesn’t offer either the SEO Editor or SEO manager user roles.

However, you can easily add these roles by using the All in One SEO for WordPress. It is the best WordPress SEO plugin on the market and allows you to easily optimize your WordPress website like a pro.

It also comes with powerful access control features which enable you to safely give your SEO team limited access to your website.

That being said, let’s take a look at how to easily add an SEO editor or manager user role in WordPress.

How to Add SEO Editor / Manager User Roles in WordPress

First, you need to install and activate the All in One SEO for WordPress plugin. For more instructions, please see our step-by-step guide on how to install a WordPress plugin.

Note: You’ll need the Pro version of the All in One SEO plugin to unlock SEO user role features.

Upon activation, the plugin will launch the setup wizard which will walk you through the setup. If you need help, then you can follow our guide on how to set up All In One SEO in WordPress.

Now you can simply add a new user to your WordPress website by visiting Users » Add New page or you can edit an existing user account by visiting the Users » All Users page.

Choose a user for the SEO Manager role

After that, simply click on the Edit link below the user account that you want to change.

On the Edit user screen, scroll down to the Role option and select SEO Editor or SEO Manager user role from the drop down menu.

Choose the SEO Manager from the dropdown menu

Don’t forget to click on the Add / Update User button to save your changes.

These users will now be able to access SEO features based on the user role assigned to them.

For instance, SEO Editor will be able to see and edit SEO Settings for a post or page by simply editing them.

SEO Editor preview

On the other hand, a user with the SEO Manager role will also be able to view the General SEO settings on the WordPress admin sidebar.

They will be able to make changes to site-wide SEO settings that may affect your entire website.

SEO manager dashboard

How to Customize SEO User Roles in WordPress

By default, All in One SEO selects the best access control settings for each SEO user role.

However, sometimes you may want to add or remove permissions from the SEO editor or Manager user roles.

All in One SEO lets you customize SEO user roles so that you can select which options they’ll have access to.

Simply head over to the All in One SEO » General Settings page and switch to the Access Control tab.

Click the Access Control tab on the General Settings page in AIOSEO

Caution: Be very careful when giving a user role access to any option under the General SEO Settings. These options may allow them to apply SEO changes that will affect your entire website.

From here, scroll down to the ‘SEO Editor’ option and toggle the switch next to the ‘Use Default Settings’ option.

This will reveal the Default Settings that All in One SEO has chosen for the SEO Editor role.

Default settings for SEO Editor user role

As you can see that by default the SEO editor user role only has access to Post SEO settings.

From here, you can check or uncheck items that you want to allow the SEO editor to have access to.

For instance, you can remove access to the Manage Redirects option or give them access to the Search Statistics feature.

SEO editor changed settings

Similarly, if you want to change settings for the SEO Manager user role, then you will need to switch off the ‘Use Default Settings’ toggle next to the SEO Manager option.

This will reveal the default settings that All in One SEO has chosen for the SEO manager user role.

SEO manager default settings

By default, the SEO manager user role has access to several options under the General SEO settings as well as all the options under the Post SEO settings.

You can change that by checking the items that you want them to have access to or unchecking to remove access from specific items.

Once you are finished, don’t forget to click on the Save Changes button to store your settings.

We hope this article helped you learn how to add an SEO Editor role in WordPress. You may also want to see our ultimate WordPress SEO guide for beginners and our top picks for the best WordPress plugins for small businesses.

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 Add an SEO Editor Role in WordPress first appeared on WPBeginner.

How to Add Image Icons With Navigation Menus in WordPress

Do you want to add image icons to your WordPress navigation menus?

Images can help visitors understand your site’s navigation at a glance. You can even use icons to highlight the menu’s most important content or call to action.

In this article, we will show you how to add image icons to navigation menus in WordPress. 

How to add image icons to navigation menus in WordPress

Why Add Image Icons With Navigation Menus in WordPress?

Usually, WordPress navigation menus are plain text links. These links work for most websites, but they don’t always look interesting or engaging. 

By adding image icons to the navigation menu, you can encourage visitors to pay attention to the menu and explore more of your site.

An example of image icons in a WordPress navigation menu

If your menu has lots of different options, then image icons can make it easier for visitors to scan the content and find what they’re looking for. This can be an easy way to increase pageviews and reduce bounce rate in WordPress

You might even use an image icon to highlight the most important menu item, such as the Checkout link on your online marketplace

An example of an image icon on an eCommerce site

By highlighting a call to action in the menu bar, you can often get more signups, sales, members, and other conversions.

With that being said, let’s see how you can add image icons to your WordPress navigation menu. Simply use the quick links below to jump straight to the method you want to use.

Method 1: Add Image Icons to Navigation Menus Using a Plugin (Quick and Easy)

The easiest way to add image icons to your WordPress menus is by using the Menu Image plugin. This plugin comes with dashicon icons that you can add with just a few clicks.

An example of a navigation menu, with image icons

If you have added Font Awesome icons to your website, then you can use them with this free plugin. For more information on how to set up Font Awesome, see our guide on how to easily add icon fonts to your WordPress theme.

If you want to use your own icon files, then Menu Image also lets you select an image or icon from the WordPress media library.

The first thing you need to do is to install and activate the Menu Image plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, click on Menu Image in the WordPress dashboard. On this screen, you can choose whether to get security and feature notifications or click on the ‘Skip’ button.

How to add icons to a WordPress menu using a free plugin

This will take you to a screen where you can configure the plugin’s settings. To start, you’ll see all the different sizes you can use for the image icons.

If you plan to use icons from Font Awesome or dashicons, then Menu Image will resize them automatically. However, if you use images from the media library, then you’ll need to select the size manually.

The plugin supports the default WordPress image sizes, such as thumbnail, image, and large. It also adds three unique sizes that are set to 24×24, 36×36, and 48×48 pixels by default.

Changing the size of image icons in WordPress menus

These settings should work well for most websites, but you can make the icons bigger or smaller by typing in different numbers for 1st, 2nd, or 3rd Menu Image size.

When you’re adding icons to your menu, you’ll see an ‘image on hover’ field by default. This allows you to show a different icon when the visitor hovers over that menu item.

Just be aware this setting is only available when you’re using your own images. You don’t need to worry about the ‘image on hover’ feature if you plan to use dashicons or Font Awesome icons.

Showing a different icon can help visitors see where they are in the navigation menu. This is particularly useful if a menu has lots of different items. For example, you might use different colors or icon sizes to highlight the currently-selected menu item.

If you want to try different hover effects, then make sure you check ‘Enable the image on hover field.’

Adding a hover effect to image icons in a WordPress menu

With that done, click on ‘Save Changes’ to store your settings.

To add icons to the navigation menu, head over to Appearance » Menus. By default, WordPress will show your site’s primary menu.

Editing a WordPress navigation menu

If you want to edit a different menu, then simply open the ‘Select a menu to edit’ dropdown and choose a menu from the list. After that, click on ‘Select.’

Now, find the first menu item where you want to add an icon and give it a click. Then, simply select the new ‘Add Image / Icon’ button.

Adding an image icon to a WordPress navigation menu

You can now decide whether to use your own image or choose an icon.

To use a ready-made icon, click on the radio button next to ‘Icons.’ You can then click to select any dashicon or Font Awesome icon.

Adding a dashicon icon to a WordPress menu

Do you want to use your own images instead?

Then select the radio button next to ‘Image’ and click the ‘Set Image’ link.

Adding WordPress media library images to a navigation menu

You can now either choose an image from the WordPress media library or upload a new file from your computer.

If you checked ‘Enable the image on hover field’ in the plugin’s settings, then you’ll also need to click on ‘Set image on hover.’

Adding an 'on hover' animation a WordPress image icon

Now, choose an image to show when the user hovers over this menu item.

Sometimes, you may want to ignore this setting and show the same icon no matter what. To do this, click on ‘Set image on hover’ and then choose the exact same image.

If you don’t do this, then the icon will disappear when the visitor hovers over it.

How to add image icons with navigation menus in WordPress

After that, open the Image Size dropdown and choose a size from the list. Using the same size for all icons tends to make the menu look more organized.

However, you might make the menu’s most important icon bigger. For example, if you’ve created an online store using a plugin like WooCommerce, then you might use a bigger icon for ‘Checkout’ so it stands out.

When you’re happy with the icon, it’s time to look at the menu item’s label.

By default, the plugin shows the title label after the icon.

Customizing the navigation menus on your website or blog

To change this, select any of the radio buttons in the ‘Title position’ section.

Another option is to remove the navigation label completely, creating an icon-only menu. This can prevent a menu with a lot of items from looking cluttered.

However, you should only hide the labels if it’s obvious what each icon means. If it’s unclear, then visitors will struggle to navigate your WordPress blog or website.

To go ahead and hide the label, select the radio button next to ‘None.’

Hiding the navigation labels on your menu

When you’re happy with how the menu item is set up, click on ‘Save Changes.’

To add an icon to other menu items, simply follow the same process described above.

When you’ve finished, don’t forget to click on the ‘Save Menu’ button. Now, if you visit your website you’ll see the updated navigation menu live.

Method 2: Add Icons to WordPress Menus Using Code (More Customizable)

You can also add image icons to your navigation menus using custom CSS. This gives you more flexibility to control exactly where the icons appear in your menus.

However, it does require you to add custom code in WordPress, so it’s recommended for more intermediate or advanced WordPress users.

An example of a navigation menu with image icons

Before you start, go ahead and upload all your image files to the WordPress media library. For each image, make sure you copy its URL and paste it into a text editor like Notepad. You’ll need to use the links in your code, so this can save you a lot of time.

To find an image’s URL, simply select it in the WordPress media library and then look at the ‘File URL’ field.

Get the URL of an image in the WordPress media library

For more detailed instructions, please see our guide on how to get the URL of images you upload in WordPress.

After that, go to Appearance » Menus.

How to add a WordPress navigation menu to your site or blog

Next, open the ‘Select a menu to edit’ dropdown and choose the menu where you want to add the image icons.

After that, go ahead and click on ‘Select.’

Editing a menu on your website or blog

Next, you need to enable custom CSS classes by clicking on ‘Screen Options.’

In the panel that appears, check the box next to ‘CSS Classes.’

Add custom CSS classes to your website

With that done, you can add custom CSS classes to any item in the navigation menu. This is how you will link each menu item to an image in the WordPress media library.

You can call these classes anything you want, but it’s a good idea to use something that helps you identify the menu item.

To get started, simply click on the first item you want to add an image icon to. In the ‘CSS Classes (optional)’ field, type in the class name you want to use.

Adding custom CSS code to a menu

You’ll use these custom CSS classes in the next step, so make a note of them in your Notepad or similar app.

Simply follow the same process to add a separate class to all your menu items. After that, click on ‘Save Menu’ to store your settings.

Note: Each icon will be tied to its own CSS class, so be sure to label the menu items differently if you want to use separate icons.

Publishing a menu with image icons

Now you’re ready to add image icons to your WordPress navigation menus using CSS.

Often, WordPress tutorials will tell you to add code snippets to your WordPress theme files. However, doing so may cause common WordPress errors and isn’t very beginner-friendly.

That’s why we recommend WPCode.

WPCode is the most popular code snippets plugin used by over 1 million WordPress websites. It allows you to add custom code without editing your theme’s functions.php file.

The first thing you need to do is install and activate the free WPCode plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, head over to Code Snippets » Add Snippet.

Adding a code snippet to your website using WPCode

Here, simply hover your mouse over ‘Add Your Custom Code.’

When it appears, click on ‘Use snippet.’

How to add custom snippets to a website or blog

To start, type in a title for the custom code snippet. This can be anything that helps you identify the snippet in the WordPress dashboard.

With that done, open the ‘Code Type’ dropdown and select ‘CSS Snippet.’

Adding custom code to WordPress using WPCode

In the code editor, you’ll need to add some code for every icon you want to show.

To help you out, we’ve created a sample snippet below. You can go ahead and change ‘.carticon’ to the custom CSS class you created in the previous step. You’ll also need to replace the URL with a link to the image in your WordPress media library:

.carticon {
background-image: url('http://localhost:10013/wp-content/my-media/cartcheckout.png');
background-repeat: no-repeat;
background-position: left;
padding-left: 5px;
}

Note: You will need to keep the dot ‘.’ in front of the CSS class in the code snippet. That’s what tells WordPress that it’s a class and not another kind of CSS selector.

You will need to adjust the snippet above for each individual menu item you created above. You can simply paste them all into the ‘Code Preview’ field.

When you’re happy with your code, scroll to the ‘Insertion’ section. WPCode can add code to different locations, such as after every post, frontend only, or admin only.

You want to use the custom CSS code across our entire WordPress website, so click on ‘Auto Insert’ if it isn’t already selected.

Then, open the ‘Location’ dropdown menu and choose ‘Site Wide Header.’

Inserting custom code across your website

After that, you’re ready to scroll to the top of the screen and click on the ‘Inactive’ toggle, so it changes to ‘Active.’

Finally, click on ‘Save Snippet’ to make the custom CSS live.

How to add custom CSS code to WordPress easily

Now, if you visit your website you’ll see all the image icons in your navigation menu.

Depending on your theme, you may need to tweak the CSS so it shows the image icons in exactly the right spot. If this is the case, then head to Code Snippets » Code Snippets in the WordPress dashboard.

Then, simply hover over the snippet and click on the ‘Edit’ link when it appears.

Editing a code snippet using WPCode

This opens the code editor, ready for you to make some changes.

We hope this article helped you learn how to add image icons to your WordPress navigation menu. You can also go through our guide on the best drag-and-drop WordPress page builders and how to make money online blogging with WordPress.

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 Add Image Icons With Navigation Menus in WordPress first appeared on WPBeginner.

15 Most Popular Digital Products You Can Sell Online in 2023

Are you looking for popular digital product ideas to sell online?

In today’s creator economy, there are many opportunities to make money online. You can sell items like music files, videos, blog posts, eBooks, software, apps, podcasts, premium content, and more.

In this article, we will share the most popular digital products that you can sell online.

Most popular digital products you can sell online

What are Digital Products?

A digital product is essentially anything that you can buy, download, and use on a device such as a computer or mobile phone. For example, ebooks, software, videos, music, online courses, and more can be digital products that you can purchase at an online store.

They are delivered to you electronically, usually through a direct download in your user dashboard or in an email with a download link inside. In general, you can easily access them anytime or anywhere.

Why Sell Digital Products Online?

Digital products have a lot of advantages compared to selling physical products.

First, you don’t have to worry about keeping inventory and meeting supply or demand requirements. Once you create a digital product, you can sell it again and again.

This also relieves you of any storage issues. Some physical products need to be kept at a warehouse and may require special storage conditions like refrigeration, which can be costly. On the other hand, you don’t have to worry about storing your digital products.

Besides that, you get to generate a passive income stream with digital goods and easily grow your sales. They also help reach a wider audience across the globe, as people from around the world can buy your digital products.

That said, let’s look at some of the most popular digital products you can sell online today.

1. eBooks

Sell ebooks online

eBooks are a great digital product to have, and you can write about any topic you like. The best part, once you’ve created an ebook, you can simply market it and earn passive income.

Now, if you have a WordPress blog or write articles regularly on any other platform, then you can repurpose the content for your ebook.

For instance, your most popular guides would already have enough content to be converted into an ebook. Or you can combine several blog posts into an ebook about a particular topic.

Once you’re done with the writing part, you can then add the ebook to your WordPress site so people can download it.

You can follow our guide on how to create and sell ebooks in WordPress from start to finish.

2. Online Courses

Online course digital product

The next most popular digital product you can sell is online courses. People are always looking to improve their skillset and learn new things.

You can use this opportunity to share your expertise and teach other people through a virtual classroom. For example, if you’re a fitness instructor, then you can create an online course and teach people different exercises.

The best part, you need very little investment and no technical knowledge to create online courses.

There are many tools in the market that can help you get started in no time. All you need is a domain name for your site, WordPress website hosting, and a learning management system (LMS) plugin.

LMS software like MemberPress or Thrive Apprentice makes it super easy to create interactive courses without editing code. Plus, you can manage students and course material, offer quizzes, and more.

You can learn more by following our guide on how to create and sell online courses in WordPress.

3. Premium Memberships

Create a membership site

Just like ebooks and online courses, a membership website is another simple way of making money online. You can sell premium memberships with access to exclusive content and community features.

For example, you can lock specific guides, cheat sheets, interviews, videos, podcasts, newsletters, and other content behind premium memberships.

On the other hand, you can offer exclusive entry to different communities, like a forum, Slack channel, or Facebook group, through a membership site.

What’s great about memberships is that you don’t have to rely on advertising revenue. You can allow your website visitors to support your site and generate continuous income.

There are many membership plugins and tools you can use to get started. For instance, MemberPress lets you restrict access to content, integrate different payment services, create unlimited membership levels, allow drip content, and more.

To start selling memberships, you can see our step-by-step guide on creating a WordPress membership site.

4. Tutorials and Guides

Tutorial and guides

You can also sell individual guides and tutorials as digital products. This is a great way to earn more money if you have long articles or multiple blog posts on a particular topic.

Simply turn your guides into a downloadable file like a PDF document. You can then charge a fee to visitors who are willing to purchase your content.

For example, let’s say you have a detailed guide on email marketing. You can turn that guide into a PDF file and sell it as a digital product.

There are many WordPress eCommerce platforms you can use to sell digital products. We recommend using Easy Digital Downloads because it is beginner friendly, offers a shopping cart, easily integrates with payment gateways, and more.

You can learn more by going through our guide on how to sell digital downloads on WordPress.

5. Spreadsheets

Spreadsheets and cheatsheet

Spreadsheets are another type of digital product you can sell on your website and generate revenue. You can create all types of useful spreadsheets for your audience.

For example, let’s say you have expertise in search engine optimization (SEO). You can create a technical SEO checklist for beginners and offer that as a paid spreadsheet. Similarly, you can create checklists, templates, calculators, lists, and other types of spreadsheets.

The best part is that you don’t need any investment to create a spreadsheet. Plus, it helps offer evergreen content that can you use to generate leads and a passive income stream.

You can check out our guide on how to sell spreadsheets online for more details.

6. WordPress Plugins

Create WordPress plugins

You can also create WordPress plugins and sell them as digital products.

WordPress is open-source software, and it powers over 43% of the website on the internet. There are over 60,000 WordPress plugins that include free and paid options. This shows that there is a huge potential to create a plugin that generates revenue.

Usually, you need basic coding knowledge like PHP, CSS, HTML, and JavaScript to write a plugin. For more details, you can see our step-by-step guide on how to create a WordPress plugin.

You can also hire a developer to help you create a plugin. There are many WordPress developer job websites where you can post an opening and hire the right talent for a specific project.

If you’re willing to take on a DIY project, then you can also use a plugin called Pluginception. It lets you create a WordPress plugin from the WordPress dashboard. To learn more, please follow our guide on how to create a WordPress plugin using a plugin.

7. Software and Mobile Apps

Build an app and software

Just like WordPress plugins, you can also create software and mobile apps. There are many SaaS (software as a service) products that you can create for any niche. It can be productivity software, workout apps, games, and more.

Usually, SaaS products have a recurring subscription. This means that you’ll need to generate income on a monthly or annual basis.

Since creating such software and apps requires specific skills, you might need to hire developers. This process can be expensive because you’ll need investment for creating software or purchasing an existing one ($15,000 and upwards).

As an alternative, you can convert your WordPress websites into mobile apps and monetize them. There are tools and plugins that can turn your site into an app. For example, let’s say you have a membership site. Converting it into an app will help you attract mobile users and sell it as a digital product.

On the other hand, you can also join affiliate programs and earn a commission on each sale. You can create a WordPress blog to review different software and apps and promote them as affiliates. Or you could create an online store using affiliates.

For more information, check out our ultimate guide to affiliate marketing for beginners.

8. Website Themes

Website themes

Similarly, you can make WordPress themes and sell them online. Themes are necessary for every WordPress user, and often users look for themes that offer specific features and customization options.

There are many platforms where you can sell website themes. Some of these include Enavto, Themeforest, CodeCanyon, and Creative Market.

You can also list a free version of your theme on the WordPress.org theme directory. From here, you can encourage users to upgrade to a premium version to unlock more features.

We recommend selling the digital products on your own websites instead of a marketplace like Envato because they charge a large commission on every sale without much benefit.

You can use an eCommerce solution like Easy Digital Downloads to create your own digital store.

9. Digital Art and Graphics

Digital art

If you’re a graphic designer or an artist, then you can create a variety of digital products and sell them online.

For example, you can create logos, design templates, original digital artwork, clip art, patterns, brushes, backgrounds, icons, fonts, shapes, and more.

Besides that, creating assets for different photo editing software like Adobe PhotoShop, Canva, Affinity Designer, and Affinity Photo can also help you make money online.

To get started, please follow our guide on how to sell digital art and graphics online.

10. Photographs

Photography

Another great digital product you can sell online is photography. Many people look for images that they can use for their WordPress websites and blogs.

There are different types of photos you can sell. Some of these include stock photos, event pictures, portraits, drone images, backgrounds, and more.

Now, you can sell your images to different stock photo sites, like Shutterstock, 500px, iStock Photo, Adobe Stock, and more. Each of these websites has a payment structure where they’ll share a percentage of direct sales or give you a royalty fee.

On the other hand, you can create your own photography website and sell your images there. This way, you don’t have to share the profits with another third party and have more control over your images.

To help you get started, check out some useful WordPress plugins for photographs.

11. Videos

Create videos

Videos are the next digital products on our list that you can sell online.

For example, videos like drone footage, stock videos, online training, product reviews, video game reviews, and gameplay footage are some of the ideas you can use to create a video-based digital product.

One of the easiest ways of monetizing your videos is by creating a video membership site. This way, you don’t have to rely on ad revenue from other platforms and get recurring payments from users who pay to access your content.

12. Recipes

Create recipes and cookbook

Are you a chef, a home cook, or a food blogger? If you do, then you can sell recipes as digital products.

The food industry is worth trillions of dollars and is very competitive. However, you can find a niche that your audience likes and share recipes to earn money.

For instance, you can start a food blog and offer premium recipes for subscribers. Or you could combine multiple recipes into an ebook and sell that as a digital product.

Plus, you can offer cooking courses and other premium content by creating a membership site. We recommend MemberPress for this sort of site, as it’s the best plugin for that on the market.

13. Podcasts

Podcast

Podcasts are audio shows that users can subscribe to. They are generally made up of audio files that listeners can download or stream to listen to.

There are many topics you can create a podcast on. For example, if your topic is music, then you can narrow it down to a specific genre. Similarly, if you’re into sports, then you can create a podcast on football.

Another great way of selling podcasts is by inviting industry experts and serving it as a masterclass. You can charge a premium or only offer these podcasts to members to generate income.

Many podcasters rely on their communities supporting them, whether that’s through a service like Patreon or creating their own membership site.

For more details, you can follow our guide on how to start a podcast and make it successful.

14. Professional Services and Coaching

Professional services

You can also sell your expertise as a digital product and help other businesses.

For example, if you’re a copywriter, graphic designer, social media expert, developer, fitness coach, legal professional, translator, SEO expert, offer technical support through live chat, or any type of consultant, then you can offer your services to others for a fee.

Now, you can sign up for different freelancing websites like Upwork, or create your own site. From here, simply market your expertise on social media platforms and build a following to get more projects and clients.

15. Research and Data

Research data

Do you conduct industry-wide surveys, polls, and research? If yes, then you can create digital products and sell the research data.

Many businesses are looking for insights into their industry. They want to better understand their audience and find out what they like or don’t like.

You can carry out research on popular topics, collaborate with companies, or simply run a survey to gather data. After that, you can create a report, add it to your website, and sell it to consumers.

If you have a membership website, then you can also offer research and data to subscribers.

For examples, see some of our research articles we offer for free here at WPBeginner:

Bonus: Plugins and Tools to Market Your Digital Products

Now that you know some of the most popular digital products to sell online, you’ll also need to market them to your customers.

Here’s a list of WordPress plugins and tools that you can use to promote your product and boost conversions:

  • OptinMonster – It is the best lead generation and popup plugin for WordPress. You can create different campaigns and use smart targeting rules to promote digital products and increase conversions.
  • WPForms – This is the best WordPress form plugin. You can use it to create an order form, payment form, and more.
  • All in One SEO (AIOSEO) – The plugin helps you optimize your website for search engines. This way, you get to improve search engine rankings, attract more organic visitors to your site, and boost sales of your digital products.
  • MonsterInsights – It is the best Google Analytics plugin for WordPress. Using the plugin, you can track your digital products performance, which files get the most downloads, uncover the most popular products, and track eCommerce revenue without editing code.
  • PushEngage – This is a push notification software for WordPress and allows you to send personalized web notifications to customers about new products, promotions, sales, etc.
  • WP Simple Pay – You can collect online payments on your website using this plugin. The best part, you don’t have to set up a shopping cart to sell digital products while using WP Simple Pay.

We hope this article helped you find the most popular digital products to sell online. You may also want to see our guide on low-cost and easy online business ideas that make money and the best email marketing tools to promote your digital products.

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 15 Most Popular Digital Products You Can Sell Online in 2023 first appeared on WPBeginner.

How to Display Instagram Photos in WordPress Sidebar Widget

Do you want to display your Instagram photos in the WordPress sidebar?

Your Instagram posts make great content for your website. By creating an Instagram feed, you can keep your site fresh and interesting while also promoting your Instagram account.

In this article, we’ll show you how to display your Instagram photos and videos in the WordPress sidebar widget.

How to display Instagram photos in WordPress sidebar widget

Why Add an Instagram Feed to Your WordPress Site?

With more than a billion monthly active users, Instagram is a great place to promote your products, services, and blog posts.

Depending on your industry, Instagram may even be the most important part of your social media strategy. For example, Instagram is particularly popular among top fashion blogs, cooking, lifestyle, and photography websites.

However, people won’t see your Instagram posts if they only visit your website. This can make it difficult to grow your Instagram following and get engagement on your photos and videos.

With that being said, it’s a good idea to add an Instagram feed to your WordPress website. By showing your latest posts, you can promote your Instagram account in an engaging and eye-catching way.

This will get more traffic to your Instagram page and encourage visitors to interact with your posts by leaving comments, clicking on the ‘Share’ button, and more.

The feed will also update automatically every time you make a new Instagram post, so it’s a great way to keep your website fresh.

That being said, let’s take a look at how to easily display Instagram photos in the WordPress sidebar widget.

How to Install an Instagram Photos Plugin

The best way to display Instagram photos in a WordPress sidebar or similar widget is by using Smash Balloon Social Photo Feed. This free plugin lets you show photos from one or more Instagram accounts in a fully customizable feed.

After creating a feed, you can add it to the sidebar using either a shortcode or block.

Embedded Instagram feed example

In this guide, we’ll be using the free version of Smash Balloon, as it has everything you need to embed an Instagram feed. However, there’s also a Pro version that allows you to display hashtag feeds, add Instagram shoppable images in WordPress, and more.

Before getting started, you’ll need to connect your Instagram account to a Facebook page. If you have a personal Instagram account, then you may also want to turn it into a business account, as this allows Smash Balloon to show your Instagram bio and header automatically.

For step-by-step instructions on how to do both of these things, check out our FAQ section at the end of the post.

When you’re ready, go ahead and install and activate the Smash Balloon Social Photo Feed plugin. For more details, see our guide on how to install a WordPress plugin.

How to Connect an Instagram Account to WordPress

After activating the plugin, it’s time to connect your Instagram account to WordPress. Simply go to Instagram Feed » Settings and then click on ‘Add New.’

How to create a new social media feed using Smash Balloon

With Smash Balloon Pro, you can create feeds from tagged posts and hashtags, or even create a social wall with content from lots of different websites, including YouTube, Facebook, and Twitter.

Since we’re using the free version, simply select ‘User Timeline’ and then click on ‘Next.’

Smash Balloon's Instagram settings

After that, you’ll need to choose the Instagram account where you’ll get the photos from.

To get started, click on ‘Add Source.’

Connecting Instagram to your WordPress website

On the next screen, choose whether you want to display photos from a personal or business Instagram account.

If you check the box next to ‘Personal,’ then Smash Balloon won’t include the Instagram avatar and bio in your header by default. However, you can always add the avatar and bio manually in the plugin’s settings.

Connecting a personal or business Instagram account to WordPress

After choosing ‘Personal’ or ‘Business,’ go ahead and click on ‘Login with Facebook.’

You can now check the Instagram account that you want to use and click on ‘Next.’

How to display an Instagram feed on your WordPress website

After that, check the box next to the Facebook page that’s linked to your Instagram account.

With that done, go ahead and click on ‘Next.’

Choose a page to connect to WordPress

Smash Balloon will now show a popup listing all the information it will have access to and the actions it can perform.

To restrict Smash Balloon’s access to your Instagram account, click any of the switches to turn it from ‘Yes’ to ‘No.’ Just be aware that this may affect the photos and videos that you can embed on your WordPress blog or website.

With that being said, we recommend leaving all the switches enabled.

When you’re ready, click on ‘Done.’

Adding permissions to your Facebook app

You’ll now see a popup with the Instagram account you just linked to WordPress.

Simply check the box next to the account and then click on ‘Add.’

Selecting an Instagram account

Smash Balloon will now take you back to Instagram Feeds » All Feeds automatically.

To create a feed, simply check the box next to your Instagram account. Then, click on ‘Next.’

How to create an Instagram social media feed

The plugin will now create an Instagram photo feed for your website, and then open that feed in the Smash Balloon editor.

How to Customize Your Instagram Photo Feed

You can use the editor to fine-tune how Instagram photos look on your website.

On the right, you’ll see a preview of your Instagram photo feed. On the left-hand side are all the settings you can use to customize the photo feed.

Smash Balloon's Instagram feed editor

Most of these settings are self-explanatory, but we’ll quickly cover some key areas.

To start, you can change the feed layout and add padding by selecting ‘Feed Layout’ from the left-hand menu. As you make changes, the preview will update automatically, so you can try different settings to see what works best for your Instagram photo feed.

Smash Balloon's Instagram feed layout settings

By default, Smash Balloon shows the same number of posts on desktop computers and mobile devices.

You can preview how the Instagram feed will look on desktop computers, tablets, and smartphones using the row of buttons in the upper-right corner. By testing different layouts, you can create an Instagram feed that looks great, no matter what device the visitor is using.

Previewing your social media feed on mobile, tablets, and desktop

Smartphones and tablets typically have smaller screens and less processing power, so you may want to show fewer photos and videos on mobile devices.

To do this, simply type a different number into the ‘Mobile’ field under ‘Number of Posts.’

Showing a different number of photos on mobile and desktop

By default, the Facebook feed shows fewer columns on smartphones and tablets, compared to desktop computers. This helps your photos and videos fit comfortably on smaller screens.

After testing the mobile version of your WordPress website, you may be unhappy with how the columns look on smartphones and tablets. If this is the case, then you can show fewer columns by changing the numbers in the ‘Columns’ section.

Showing a different number of Instagram columns on different devices

When you’re happy with the changes you’ve made, click on the ‘Customize’ link.

This will take you back to the main Smash Balloon editor, where you can explore the next settings screen, which is ‘Color Scheme.’

Adding a different color scheme to an Instagram feed in WordPress

By default, Smash Balloon uses a color scheme inherited from your WordPress theme, but it also has ‘Light’ and ‘Dark’ themes that you can use.

Another option is creating your own color scheme by selecting ‘Custom’ and then using the controls to change the background color, edit the button color, change the text color, and more.

An Instagram feed with a custom color scheme

By default, Smash Balloon adds a header to your feed, which is your Instagram profile picture and the name of your page. To change how this section looks, click on ‘Header’ in the left-hand menu.

On this screen, you can change the size and color of the header, and show or hide your Instagram bio.

Adding a header to the Instagram feed on your WordPress website

Sometimes, you may want to show a different profile picture. For example, your Instagram avatar may clash with your WordPress theme.

To do this, simply click on ‘Add Image’ under ‘Show custom avatar.’

You can then either choose an image from the WordPress media library or upload a new photo from your computer.

Adding a custom Instagram avatar in WordPress

Similarly, you can show a different bio. For example, you may want to introduce your Instagram feed or encourage people to follow you for more great content.

To replace the Instagram bio, simply type into the ‘Add custom bio’ box.

Creating a custom social media bio for your WordPress website

Smash Balloon automatically analyzes your Instagram photos and displays them at the best resolution. While we recommend using these default settings, it is possible to make the images bigger or smaller.

To change the image size, click on ‘Posts’ from the left-hand menu. Then, select the ‘Images and Videos’ option.

Changing Smash Balloon's image and video resolution settings

You can now choose between thumbnail, medium, and full-size using the dropdown menu.

If you’re unhappy with the results, then you can return to this screen at any point and select ‘Auto-detect (Recommended)’ from the dropdown menu.

Smash Balloon's automatic resolution detection

By default, Smash Balloon adds a ‘Load More’ button to the bottom of your Instagram feed, which allows visitors to scroll through more of your photos and videos.

Since it’s such an important button, you may want to customize it by selecting the ‘Load More Button’ option from the left-hand menu.

Customizing the social media Load More button

Here, you can help ‘Load More stand out by changing its background color, text color, and hover state.

You can also change the button’s label by typing into the ‘Text’ field.

Adding your own messaging to the Instagram button

Another option is to remove the button completely by clicking the ‘Enable’ toggle. In this way, you can encourage people to visit your Instagram by limiting the number of posts they can see on your website.

If visitors like what they see, they may decide to follow you on Instagram using the ‘Follow on Instagram’ button that Smash Balloon adds automatically.

With that in mind, you may want to help the button stand out by selecting ‘Follow Button’ in the left-hand menu.

Here, you can change the button’s background color, hover state, and text color.

Customizing the social media follow button

By default, the button has a general ‘Follow on Instagram’ label.

You can replace this with your own messaging by typing into the ‘Text’ field.

How to create a custom Instagram photo feed for your WordPress website

When you’re happy with how the Instagram feed looks, don’t forget to click on ‘Save’ to store your changes. You’re now ready to add the Instagram feed to your WordPress sidebar widget.

How to Add Your Instagram Photos in WordPress Sidebar Widget

You can add your feed to the sidebar or similar section using the Instagram Feed block.

If you’ve created more than one feed using Smash Balloon, then you’ll need to know the feed’s code.

Simply go to Instagram » All Feeds and then copy the value in the ‘Shortcode’ column.

In the following image, we’ll need to use instagram-feed feed=1.

Adding Instagram photos and videos using a code

With that done, go to Appearance » Widgets in the WordPress dashboard.

Then click on the blue ‘+’ button.

The WordPress widget editor

In the search bar, type in ‘Instagram Feed’ and select the right widget when it appears.

WordPress has a built-in Instagram widget, so make sure you choose the one that shows the official Instagram logo.

The Instagram Feed block

After that, simply drag the widget onto the area where you want to show the Instagram feed, such as the sidebar or similar section.

The widget will automatically show one of the feeds you created using Smash Balloon.

To show a different feed instead, simply type the feed’s shortcode into the ‘Shortcode Settings’ box and then click on ‘Apply Changes.’

Adding an Instagram feed to WordPress using shortcode

You can now click on the ‘Update’ button to make the widget live. For more information, please see our step-by-step guide on how to add and use widgets in WordPress.

If you’re using a block-enabled theme, then you can add an Instagram feed to the sidebar using the full-site editor. To get started, simply go to Appearance » Editor.

Adding an Instagram feed using the full-site editor

In the editor, simply click to select the sidebar section and then click on the ‘+’ button.

You can then start typing in ‘Instagram Feed’ and select the right block when it appears.

Adding an Instagram feed to a block-enabled WordPress theme

By default, the full-site editor will show one of the Instagram feeds you created using Smash Balloon. To show a different feed, simply add the shortcode following the same process described above.

When you’re happy with how the Instagram feed looks, click on ‘Save’ to make your changes live.

How to Display a Specific Instagram Photo in WordPress

Sometimes you may want to show a specific Instagram post on your website. This might be your most popular photo, an evergreen post, or even a social media contest that you’re currently running.

A single Instagram post, embedded in WordPress

In the past, you could easily embed an Instagram post in WordPress using a protocol known as oEmbed. However, Facebook changed the way that oEmbed works, so you can no longer easily embed Instagram photos in WordPress.

The good news is that Smash Balloon can fix the Facebook and Instagram oEmbed issue. This allows you to easily embed a specific Instagram post in any page, post, or widget-ready area, such as the sidebar.

To enable this feature, simply go to Instagram Feed » oEmbeds. You can then click on the ‘Enable’ button.

Enabling the Facebook and Instagram oEmbed feature

After that, go to Appearance » Widgets and click on the blue ‘+’ button.

In the search bar, type in ‘Embed’ to find the right block.

The WordPress Embed block

When the ‘Embed’ block appears, drag it onto the area where you want to show the photo.

In the ‘Embed’ field, simply paste the URL of the Instagram post that you want to show on your website. Then, click on ‘Embed.’

Adding an embed block to your WordPress website

WordPress will now show the specific Instagram post.

If you’re happy with how it looks, then click on ‘Update’ to make it live.

Publishing an Instagram photo in a sidebar widget

Now, if you visit your website, you’ll see the Instagram post live.

If you’re using a block-enabled theme, then you’ll need to add specific Instagram posts using the full-site editor.

To do this, simply enable Smash Balloon’s oEmbed feature and get the Instagram post’s URL by following the same process described above.

After that, open the full-site editor by going to Appearance » Editor in the WordPress dashboard. Once you’re inside the full-site editor, click on the ‘+’ button in the sidebar section and then type in ‘Embed.’

Adding an Embed block using the full-site editor (FSE)

When the right block appears, click to add it to the sidebar.

You can then add the URL for the post you want to embed and click on the ‘Embed’ button.

Adding an Instagram feed using an Embed block

The full-site editor will now show the Instagram post.

If you’re happy with how it looks, then click on ‘Save’ to publish this photo or video to the block-enabled sidebar.

Adding a specific Instagram post to a block-enabled sidebar

FAQs About Displaying Instagram Posts in WordPress

Smash Balloon makes it easy to create a custom Instagram feed or even display specific Instagram posts on your WordPress website.

That being said, here are some of the most frequently asked questions about showing Instagram posts on WordPress.

How Do I Create an Instagram Business Account?

Smash Balloon can display photos from either a personal or business Instagram account.

However, Smash Balloon can’t automatically fetch the Instagram avatar and bio from a personal Instagram account. Instead, you’ll need to add the avatar and bio manually in the plugin’s settings.

With that being said, you may want to check whether you have a personal or business account, and then switch to a business account if necessary.

To do this, simply visit your Instagram account and click on the lined icon in the side menu.

Checking whether your Instagram page is a business or personal account

After that, click on ‘Settings.’

If you don’t have a business account, then this screen will show ‘Switch to professional account’ as the last option.

How to switch to a business Instagram account

If you currently have a personal account and want to switch to a business account, then simply click on this link.

How Do I Connect a Facebook Page to an Instagram Account?

Before you can display Instagram photos in WordPress, you’ll first need to connect your Instagram account to a Facebook page.

To do this, head over to the Facebook page that you want to use and then click on ‘Settings’ in the left-hand menu.

Once you’ve done that, click on ‘Linked Account.’ You can now select ‘Instagram’ and click on the ‘Connect’ button.

Linking an Instagram business account to a Facebook page

Facebook will now show all the actions it can perform, and the information it can access.

If you’re happy with this, then click on the ‘Connect’ button.

Linking Instagram and Facebook

Just be aware that the people who manage your Facebook page may be able to see your Instagram messages and respond to them. If you want to stop this and keep your messages private, then click to disable the slider.

When you’re ready to move to the next screen, click on ‘Confirm.’

Restricting access to your Instagram messages

This opens a popup where you can type in your Instagram username and password.

After that, click on the ‘Log in’ button.

Logging into your Instagram account

After a few moments, you’ll see a message saying that your Instagram and Facebook accounts are now connected.

We hope this article helped you learn how to display Instagram photos in a WordPress sidebar widget. You may also want to see our guide on how to create a custom Facebook feed in WordPress, or see our expert pick of social proof plugins for WordPress and WooCommerce.

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 Display Instagram Photos in WordPress Sidebar Widget first appeared on WPBeginner.