Keeping your WordPress website’s content organized is key to offering a smooth user experience, especially as you continue to add more posts. WordPress offers a simple way to manage this through categories and subcategories. These tools help structure your content and also enhance SEO and make it easier for your visitors to find what they’re […]
If you’re aiming to create a professional-looking website without diving into complex coding, Elementor is a widely popular choice. This WordPress page builder comes packed with features that make web design accessible to everyone, from complete beginners to experienced developers. With its drag-and-drop functionality, pre-built templates, and endless customisation options, Elementor Pro makes it easy […]
Note: You don’t need any other WordPress Security guide if you follow all the steps mentioned in this guide. Originally created for bloggers, WordPress has become a widely-used platform for website development and content management due to its ease of use, versatility, and reliability, making it an ideal choice for businesses of all sizes. As […]
Are you worried that you’ve stuffed too many keywords into your content?
When it comes to optimizing your site for search engines, many new users have a tendency to stuff their content with keywords. However, this is not a good practice and could lead to over-optimization, which can then lead to being penalized by search engines like Google.
In this article, we will show you how to avoid keyword stuffing and fix over-optimization in SEO.
What is Keyword Stuffing?
Keyword stuffing is filling a web page with keywords to manipulate search engines in the hopes of getting higher rankings.
In the early days of search engine optimization (SEO), it was easy to exploit search engines and use keyword stuffing to boost ranking. However, search engines like Google have become a lot smarter and can penalize sites that use this as an exploit.
There are different ways you can do keyword stuffing in your content. For instance, repeating words and phrases unnecessarily, listing or grouping text together unnaturally, or inserting blocks of keywords that appear out of context.
Here’s an example of how using the same keyphrase repeatedly in a single paragraph can lead to keyword stuffing.
Another way site owners can stuff search terms is by adding hidden text to the source code of the page. Users won’t be able to see this, but search engine crawlers will. Google does not like this practice.
That said, let’s look at how keyword stuffing can impact your site’s SEO.
Why is Keyword Stuffing Bad for SEO?
If you’re starting out with WordPress SEO, then it can be easy to get carried away and add the same keyword lots of times in the content. However, you should know that it goes against the web search policies of Google.
This could lead to a penalty from Google, where your site can be demoted in rankings. In worst cases, Google can also remove your page from its search engine results.
Besides that, keyword stuffing also leads to poor user experience because the content can be come hard to read. People might not find your content useful and exit the website. As a result, your site might look spammy and you won’t be able to build a healthy relationship with your audience.
Having said that, let’s look at different ways you can fix over-optimization and avoid keyword stuffing.
1. Measure Your Content’s Keyword Density
The easiest way of avoiding keyword stuffing is by measuring the keyword density of your content. Keyword density checks how many times a search term is used within the content.
You can use WPBeginner Keyword Density Checker to get started. It is a free tool that doesn’t require signup, registration, or installation.
Simply enter the URL or text of your content into the tool and click the ‘Check’ button.
Next, the tool will analyze your content and show you the results.
You can then see how many times a keyword is being used on the web page. For instance, in the screenshot below, you can see the word ‘parrotfish’ occurs 28 times or has a 13.66% density.
After finding the density of the search term, you can then edit your content and remove words and phrases that are repeated multiple times.
A best SEO practice suggests that keyword density should be around 2%. You can use this as a guideline and ensure your content isn’t over-optimized.
2. Assign a Primary Keyword to Each Content
Another way you can fix over-optimization for SEO is by assigning a primary keyword or phrase to each blog post and page.
You should conduct keyword research and pick a search term that best represents the main topic of your content. This way, your content will focus on a specific issue and you’ll be better able to fulfill the search intent
If you try to optimize a web page with multiple keywords with different intent, then you’ll leave your site in a big mess. It will confuse search engines from understanding your content and who it is for, which will prevent your page from ranking for the right keyword.
There are different keyword research tools you can use to find the primary search term for your content. We recommend using Semrush, as it is a complete SEO tool that offers powerful features.
You get a detailed overview of the keyword along with other valuable information. For instance, Semrush shows search volume, intent, keyword difficulty, and more for the search term.
Once you’ve found a primary keyword, you can use the All in One SEO (AIOSEO) plugin to optimize your content for the search term. AIOSEO is the best SEO plugin for WordPress that lets you add focus keyphrases to each post and page.
The plugin analyzes your content for the keyphrase, shows a score, and provides tips to improve keyword optimization. AIOSEO also integrates with Semrush to help you find more related keywords.
You can avoid keyword stuffing by using LSI (latent semantic indexing) or related keywords for your content.
These are search terms that are closely related to the primary keyword. Related keywords also help search engines better understand your content.
Using different variations of keywords, synonyms, or long tail phrases can also help avoid keyword stuffing. It gives you more flexibility in incorporating different topics into your article.
You can find related keywords using the WPBeginner’s Keyword Generator tool. Simply enter your main search term or topic in the search bar and click the ‘Analyze’ button.
The tool is 100% free to use and generates over 300 keyword ideas.
You can then use different variations in your article to avoid keyword stuffing.
Besides that, you can also search the primary keyword on Google and then scroll down to see related searches.
This will give you even more keyword variations to use in your content and fix over-optimization issues.
4. Add Value by Extending the Word Count
Next, you can create long-format content to cover the topic in detail and help achieve higher rankings.
Extending the word count gives you the opportunity to cover multiple sub-topics, answer different questions users might have, and easily use keyword variations to avoid stuffing.
This also helps you use different search terms naturally instead of forcing them in every sentence. Plus, it offers a better reading experience for users.
While extending the word count will help avoid keyword stuffing, you should also focus on content quality. Google and other search engines emphasize creating content that’s valuable. So, we recommend writing for your users instead of focusing on keyword placement.
One way of extending the word count and diversifying the use of keywords is by adding a FAQ section at the bottom of the post.
5. Include Keywords in On-Page SEO Optimization
You can also avoid keyword stuffing and fix over optimization by placing the target search term in different places during the on-page SEO process.
On-page SEO is optimizing a webpage for search engines and users. It refers to anything you do on the page itself to boost its rankings in search engine page results (SERP).
By spreading the placement of keywords across different page elements, you can easily fix keyword stuffing issues. For instance, there are different page elements where you can add the main keyword. These include the title, meta description, subheadings, permalink, and more.
With AIOSEO, it is very easy to perform on-page SEO and ensure your content is properly optimized. You can add meta descriptions, focus keyphrases, build internal links, and get suggestions for improvement.
Similarly, adding keywords to image alt text lets you rank for image search and allows you to diversify the use of primary search terms across the content.
It can help show screenshots from your blog post as featured snippets, helping you get more traffic.
WordPress is a powerful platform that allows you to create stunning blogs and websites. However, if you’re not careful, you can inadvertently make mistakes that can negatively impact your blog’s functionality and appearance. In this article, we will discuss some common pitfalls to avoid when managing your WordPress blog. 1. Overloading with Plugins Plugins are […]
Do you want to bulk edit featured images in WordPress?
It’s easy to add, change, and remove featured images from your WordPress posts and pages. However, changing the featured images for multiple pages can take a lot of time and effort.
In this article, we will show you how you can save time by bulk editing featured images in WordPress.
Why You Might Need to Bulk Edit Featured Images in WordPress
Featured images, also known as post thumbnails, are an important part of many websites.
Almost all modern WordPress themes come with built-in support for featured images and display them across different areas of your WordPress website including your blog archives.
As an important part of your WordPress blog or website, you’ll want to make sure your featured images look good and represent your brand.
With that in mind, at some point you may need to bulk edit your featured images in WordPress. For example, you might install a new WordPress theme and decide to design new featured images that better compliment your new theme.
You can change the featured image for an individual page or post in the standard WordPress editor. However, changing the featured image for lots of different pages and posts can be frustrating and time-consuming.
With that in mind, let’s see how you can bulk edit featured images in WordPress.
How to Bulk Edit Featured Images in WordPress
The easiest way to bulk edit featured images in WordPress is by using the Quick Featured Images plugin.
This plugin makes it easy to change every single featured image across your website. It also has detailed filters that allow you to change the featured images for specific categories, tags, post types, and more.
Before you start using the Quick Featured Images plugin, just be aware that this plugin doesn’t allow you to undo your bulk edits. This can cause problems if you change your featured images and are unhappy with the results.
With this in mind, it’s a good idea to backup your WordPress website before using this plugin. If you don’t already have a backup solution, then there are several great WordPress backup plugins that allow you to automatically backup your website.
Upon activation, go to Featured Images » Overview in the left-hand menu. On this screen, click on the following link: ‘Bulk set, replace and remove featured images for existing posts.’
This screen allows you to bulk edit your featured images in a few different ways.
Your first option is the ‘Set the selected image as a new featured image’ radio button.
This setting finds all of the posts and pages that don’t currently have a featured image. You can then choose a new featured image and apply it to all of these pages and posts.
Another option is ‘Replace featured images by the selected image.’ You can use this to replace any existing featured images with a new image.
Next up is ‘Remove the selected image as featured image.’ This lets you choose a specific image, and then remove that featured image wherever it appears on your website. This is perfect for removing an outdated featured image, such as any image that features your site’s old logo.
After selecting one of these radio buttons, click on the Choose Image button.
You can now choose the image that you want to use in the bulk edit. You can either select an image from your WordPress media library or upload a new file.
Once you’ve done that, scroll to the bottom of the screen and click on the ‘Next’ button.
On this screen, you’ll be able to configure how WordPress performs the bulk edit.
The options you see may vary depending on whether you’re adding, changing, or removing a featured image. For example, if you selected the ‘Set the selected image as new featured image’ radio button then you can choose whether to override all existing featured images, or ignore them.
To select which posts your bulk changes will apply to, scroll to the ‘Add a filter’ section.
By default, Quick Featured Images will apply its bulk edit to all pages and posts, across all of your site’s categories and tags.
If you don’t want to bulk edit every page and post, then you can create filters. These filters let you bulk edit featured images that meet a specific criteria.
You can check more than one box. For example, you might check the ‘Post Type Filter’ and ‘Tag Filter’ boxes if you want to bulk edit posts that have a specific tag.
After checking one or more boxes, go ahead and click on the ‘Next’ button.
You will now see some settings that you can use to create your filter. For example, if you checked the ‘Post Type Filter’ box then you can choose between the ‘Posts’ or ‘Pages’ box.
If you checked either the ‘Category Filter’ or ‘Tag Filter’ box, then you’ll have access to a dropdown menu.
You can open this dropdown and then choose the category or tag where you want to make the bulk edit.
When you’re happy with how your filter is set up, scroll to the bottom of the screen.
You can then go ahead and click on the ‘Preview filtering’ button.
The Quick Featured Images plugin will now show a preview of all the pages and posts that will be affected by the bulk edit.
If you’re happy with the preview, then you can go ahead and click on the ‘Apply’ button.
Quick Featured Images will now bulk edit all of the relevant featured images across your WordPress website.
How to Set Multiple Images Randomly as Featured Images
When you bulk edit featured images in WordPress, you can sometimes end up using the same featured image for lots of different posts. These duplicate images can make your website look boring and repetitive.
With that in mind, you may want to set your featured images at random. You can use the Quick Featured Images plugin to select different images from your WordPress media library. The plugin will then add these featured images to your pages and posts at random.
In this way, you can bulk edit your images without creating lots of duplicate featured images.
To set your featured images at random, go to Featured Images » Overview and again click on ‘Bulk set, replace and remove featured images for existing posts’.
Once you’re here, click on ‘Set multiple images randomly as featured images.’
You can then click on the ‘Choose Images’ button to open the WordPress media library.
Here, hold down the Shift key and then click all the images that you want to randomly use as your featured images.
Once you’ve done that, click on the ‘Choose Images’ button. Then, scroll to the bottom of the screen and click on ‘Next.’
By default, Quick Featured Images will apply these images to all your WordPress pages and posts at random.
Do you just want to use these images for certain content types, categories, or tags? Then you can create a filter by following the same process described above.
After adding a filter, Quick Featured Images will show a preview of all the pages and posts that it plans to update. You can check the thumbnail to see which image the plugin has randomly assigned to each page or post.
If you’re happy with the preview, go ahead and click on ‘Apply.’ Quick Featured Images will now add the new images to your pages and posts.
How to Bulk Remove Featured Images in WordPress
Sometimes you may prefer not to use featured images on your website. For example, you might be trying to speed up your WordPress performance, or you may be using a theme that simply doesn’t look good with featured images.
You can use Quick Featured Images to easily remove all the featured images from your pages and posts.
You can also use filters to remove the featured images from pages, posts, or content that has a particular tag or category.
To bulk remove featured images in WordPress, simply click on the ‘Remove all featured images without existing image files’ radio button. You can then go ahead and click on ‘Next.’
Now, you can apply filters by following the instructions above.
Once you’ve created one or more filters, go ahead and click on the ‘Next’ button.
As always, the plugin will show a preview of all the pages and posts that it will change as part of this bulk edit. Since you’re deleting the featured image, it will show ‘No image set’ in the ‘Future Featured Image’ column, rather than a thumbnail preview.
If you’re happy to go ahead and remove the featured image for these pages and posts, then just click on the ‘Apply’ button.
Are you looking for a way to add social media icons to WordPress menus?
The logos for sites like Facebook and Twitter are instantly recognized by people all over the world. By adding these icons to your menus, you can promote your social media profiles in an eye-catching way that doesn’t take up a lot of space.
In this article, we will show you to add social media icons to WordPress navigation menus.
Why Should You Add Social Media Icons to Menus?
By adding social media icons to your website, you can encourage people to visit your different social networking profiles. This can get you more followers and engagement across Facebook, Twitter, Instagram, and more.
One option is to add social media icons to your WordPress sidebar or a similar widget-ready area. However, when people want to visit a new page, they typically look at your navigation menu first.
By adding social media icons to your WordPress menus, you can often get more clicks, engagement, and followers across all your social media profiles.
Social media icons can also grab the visitor’s attention without adding extra text to your menus. This allows you to promote lots of different profiles in a small amount of space.
That being said, let’s take a look at how to easily add social media icons to WordPress menus.
Video Tutorial
If you prefer written instructions, just keep reading. Simply use the quick links below to jump straight to the method you want to use:
When creating your social icons, you can use any image that you have uploaded to the WordPress media library.
For example, many of the top social media companies provide logos that you can use on your website, such as the Twitter brand toolkit. You can also download icons from online libraries like the Font Awesome website.
Menu Image also integrates with the Font Awesome plugin. This allows you to browse and import all the Font Awesome icons directly from the WordPress dashboard, including icons for all the major social networks. For this reason, we recommend installing the Font Awesome plugin.
No matter how you plan to provide the social media icons, you will need 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, you may want to take a look at the icon sizes and change them if necessary. To do this, you need to go to Menu Image » Menu Image.
When creating your social icons, you can use any of the default WordPress image sizes, such as thumbnail, image, or large. Menu Image also lets you choose between three unique sizes that are set to 24×24, 36×36, and 48×48 pixels by default.
These sizes should work well for most WordPress websites, but you can change them by typing different numbers into the 1st, 2nd, or 3rd Menu Image fields.
With that done, click on ‘Save Changes’ to store your settings.
To add icons to a navigation menu, head over to Appearance » Menus. By default, WordPress will show your site’s primary menu.
If you want to add social media icons to a different menu, then just open the ‘Select a menu to edit’ dropdown.
You can then choose a menu from the list and click on ‘Select.’
To start, you will need to add each social profile to your menu as a new link.
When you are ready, click to expand the ‘Custom Links’ section and then type in the address of the social media page you want to use. For example, you might enter the URL of your Facebook group or YouTube channel.
You will also need to type in some ‘Link Text’. In a later step, you will have the option to change where this title appears in the menu or even hide it completely.
With that done, click on ‘Add to Menu.’
This item will now appear in the right-hand column.
To add a social media icon, simply hover over the new menu item.
Then, click on the ‘Menu Image’ button when it appears.
Note: If you don’t see a ‘Menu Image’ button, then click on ‘Save Changes’. Now, the ‘Menu Image’ button should appear when you hover over any item in the menu.
You can now decide whether to use an image from your WordPress media library or an icon provided by Font Awesome.
To use a ready-made Font Awesome icon, click on the radio button next to ‘Icon’.
Then, select ‘Fontawesome’.
You can then click on ‘Brands’.
You will now see all the branded icons, including icons for all the major social networks. When you see the image you want to use, just give it a click.
Another option is using your own icon from the WordPress media library by selecting the ‘Image’ radio button. Then, click on the ‘Set Image’ link.
You can now either choose an image from the WordPress media library or upload a new file from your computer.
No matter where you get the icon from, Menu Image will show a preview on the right.
You can now change whether the link title appears above, below, before, or after the social media icon using the ‘Title position’ settings.
Many social media icons are instantly recognizable, so the link title may be unnecessary. If you are adding lots of social icons to a navigation menu, then titles can even make your menu look more messy and complicated.
With that being said, you may want to hide the title by selecting the ‘Hide’ radio button.
As you make changes, the live preview will update automatically, so you can try different settings to see what looks the best.
Finally, if you are using your own image, then you can resize the social media icons using the ‘Image Size’ dropdown.
Bigger icons will grab the visitor’s attention, but they can also be distracting. With that in mind, you may want to try different sizes to see what works best on your WordPress blog.
When you are happy with how the social media icon is set up, simply click on ‘Save Changes’.
Simply repeat these steps to add more icons to your WordPress menu.
You can even add icons to other important items in the navigation menu. For example, you might add icons to your contact form or WooCommerce checkout page.
When you are happy with how the menu is set up, just click on ‘Save Menu.’
Now, you can visit your website to see the new social media icons in action.
This is how it looked on our demo website.
Method 2: Using the Full Site Editor (Block Themes Only)
WordPress has a built-in Social Icons block that allows you to create a menu containing social media icons and then display them in a nice layout.
This block comes with built-in icons for all the major social networks, so you don’t need to install a plugin like Font Awesome or upload icons to your media library. However, you can only add social media icons and links to the Social Icons block, so it isn’t as flexible as the Menu Image plugin.
If you are using a block theme, then you can add a Social Icons block to any part of your website, such as the header or footer. In this way, you can show a social media menu across your entire website.
To get started, head over to Appearance » Editor in the WordPress dashboard.
By default, the full site editor shows your theme’s home template, but you can add social icons to any template or template part. You can even add social media icons to parts of your website you can’t edit using the standard WordPress content editor.
For example, you can add a social media menu to your site’s 404 page template.
To see all the available options, you need to select either ‘Templates’ or ‘Template Parts’.
You can now click on the template or template part that you want to edit.
As an example, we will add social media icons to the WordPress header, but the steps will be the same no matter which template you select.
After making your choice, WordPress will show a preview of the template or template part.
To continue, click on the small pencil icon.
With that done, click on the blue ‘+’ icon in the top-left corner.
In the search bar, you must type in ‘Social Icons.’
When the right block appears, drag and drop it onto the theme template.
To add the first icon, just click on the ‘+’ icon inside the block.
In the popup that appears, type in the icon you want to add, such as ‘Twitter’ or ‘Facebook’.
When the right icon appears, simply click to add it to your WordPress blog.
Now, click on the new social media icon.
This opens a small bar where you can type in the URL you want to link to, like your Facebook page.
To add more social icons to WordPress, simply click on the ‘+’ icon and repeat the same process described above.
After adding all the social media icons, you may want to customize the block. To do this, click to select the Social Icons block and then click on the ‘Block’ tab.
You can change the icon’s justification, alignment, and orientation using the ‘Layout’ settings.
By default, all the social media links will open in the same tab. To keep visitors on your website, you may want to click to enable the ‘Open links in new tab’ toggle.
By default, WordPress shows the social icons only, without any text.
If you want to show text next to each icon, then click to enable the ‘Show labels’ toggle.
Next, click on the ‘Styles’ tab.
Here, you can change the button style by clicking on ‘Default’, ‘Logos Only’, or ‘Pill Shape’.
Finally, you can change the space between the social icons using the settings under ‘Block Spacing’.
When you are happy with how the menu looks, click on the ‘Save’ button.
Now, if you visit your website, then you will see the social media icons live.
Bonus: How to Promote Your Social Media Profiles
Adding social media icons to WordPress menus is a great way to get more followers and engagement across your different accounts. However, there are lots more ways to promote your Twitter, Facebook, and other social profiles.
The best way to get more followers and engagement is by embedding a live social feed on your website. This allows you to show the latest posts from multiple accounts, along with buttons that visitors can use to engage with your posts or follow you on social media.
The best way to add social media feeds to your website is by using Smash Balloon. It’s the best social media feed plugin for WordPress and lets you embed live feeds from Twitter, Instagram, Facebook, and more.
In today’s world, content creation has become a popular medium for self-expression and sharing opinions or expertise. However, many creators devote significant time and effort to their blog posts without earning much in return. Unfortunately, crafting an article requires a considerable amount of time and dedication. Over time, you may have encountered numerous blogs that […]
Are you looking for the right way to add images to your WordPress website or blog?
By adding images in WordPress correctly, you can improve the visual appeal, accessibility, and SEO of your website. You can even allow users to upload their own images and use them on your site or in your competitions.
In this article, we will show you how to properly add images in WordPress.
The Importance of Correctly Uploading Images in WordPress
Sometimes, users directly copy an image from the source and paste it into their website content. Unfortunately, this can cause problems like slow pages, poor user experience, and poor SEO.
When you add images to your WordPress website, it’s important to do it properly. This means using the right file format, file name, and alt text.
We recommend naming your images with descriptive words separated by dashes. For example, you might use the file name ‘bali-vacation-photo.jpg’ for an image on your travel blog.
Properly adding images also means resizing your images so that they load quickly and look good on all devices. For example, some image formats like JPEG, are more compressed than others, which means that these images will take up less space on your server and will take less time to load.
By using these formats, along with an image compression plugin for the images on your WordPress blog, you can improve the user experience of your website.
Similarly, by using the Image block in WordPress and properly optimizing your images for SEO and alt text, you can make it easier for search engines to index your images.
That being said, let’s see how to properly add images in WordPress. We will cover several methods, and you can use the quick links below to jump to the different sections of our tutorial:
First, you need to open the existing or new page/post where you want to add an image.
Once you are there, click the ‘+’ button in the top left corner of the screen to open the block menu. From here, you must find and add the Image block to the post or page.
Once you have done that, click the ‘Media Library’ button to launch the ‘Select or Upload Media’ prompt on the screen.
From here, you can switch to the ‘Upload Files’ tab if you want to upload an image from your computer.
However, if you want to add an image from the media library, then you can also do that by switching to the ‘Media Library’ tab.
Upon adding an image, you will need to add alt text for it in the left column. This alt text is crucial for image SEO as it helps search engines understand the context of the image. It also allows people with screen readers to see this information about your images.
You can also add a title and caption describing the image in the right column. Captions are the visible text descriptions of your images, while the title will appear when a user hovers their mouse over the image.
First, you need to visit the page or post where you want to add the image from the WordPress dashboard. Once you are there, just click the ‘Add Media’ button to launch the media library.
After that, you can switch to the ‘Upload Files’ tab to upload an image from your computer.
Alternatively, for adding an image from the media library, just switch to the ‘Media Library’ tab.
Upon adding an image, you will need to add alt text and a title for it. You can also add a description and caption if you wish.
You can simply describe the image for all these options. This will help search engine index your image and increase your website’s visibility.
Next, go ahead and click the ‘Insert into Post’ button.
Now, the image will be added to your WordPress post or page.
From here, you can change its alignment by using the alignment icons above the image. You can also further edit an image by clicking on the pencil icon.
This will open the ‘Image details’ prompt on your screen, where you can change the size and add image title attributes, CSS classes, alignment, and more.
Once you are done, just click the ‘Update’ button to save the changes you made.
After that, simply click the ‘Publish’ or Update’ button to save your post.
How to Add Images in the Media Library
If you want, you can also directly add an image to the media library. Keep in mind that after adding an image to the media library, you will still need to open a post or page and insert the Image block.
To add an image from the media library, you must visit the Media » Add New page from the WordPress admin area.
Once you are there, click the ‘Select Files’ button to upload an image from your computer. Then, click the ‘Edit’ link next to the image.
This will take you to the ‘Edit Media’ page, where you can start by changing the title for the image. After that, you can add alt text, a caption, and a description by scrolling down.
Once you have done that, you can also click on the ‘Edit Image’ button.
This will direct you to another page, where you can crop, scale, rotate, or flip the image according to your liking. For detailed instructions, please see our beginner’s guide on how to do basic image editing in WordPress.
Once you are satisfied, just click the ‘Update’ button to save your changes.
This will take you back to the ‘Edit Media’ page, where you have to click on the ‘Update’ button again to store your settings.
You have now successfully added an image to the media library.
Next, visit the post where you want to add this image from the WordPress admin sidebar. Once you are there, click the ‘+’ button to add an Image block to the post.
Next, you need to select the ‘Media Library’ button.
This will launch the ‘Select or Upload Media’ prompt on your screen, where you will notice the image that you uploaded in the media library at the top.
On selecting the image, you will see that its title, alt text, caption, and description have already been added to it from the media library page.
Now, simply click the ‘Select’ button to upload the image to the block editor.
Finally, click the ‘Publish’ or ‘Update’ button to store your settings.
How to Optimize an Image for WordPress SEO
Once you have added an image to a post/page, it is also crucial to optimize it for search engines. Unfortunately, WordPress does not offer any built-in advanced SEO features for images.
Next, head over to the All in One SEO » Search Appearance page from the WordPress admin sidebar and switch to the ‘Image SEO’ tab.
After that, scroll down and click the ‘Activate Image SEO’ button to unlock the feature.
You will now be able to see the Image SEO settings. Here, you will notice different tabs for the title, alt text, caption, description, and filename.
Configure Automatic Image Titles
Once you switch to the ‘Title’ tab on the Image SEO page, you can start by creating a title format for your images using smart tags.
These smart tags will then automatically generate title attributes for your images. This is what a visitor will see when they hover their mouse over your images.
For example, if you want each image title attribute to use the image title and the site title, then you can add these smart tags in the ‘Title Format’ field.
After that, you can also enable the Strip Punctuation option if you want AIOSEO to automatically remove some characters when creating an image title from the filename.
For example, if you use dashes when saving an image file like ‘an-example-image’, then you can choose the ‘Dashes (-)’ option in the ‘Characters to Convert to Spaces’ section.
Once you do that, AIOSEO will automatically remove these dashes and turn them into spaces, making the image title ‘an example image’.
After that, scroll down to the ‘Casing’ section.
From here, you can choose a casing option for your title. We recommend picking sentence case or title case to make your titles more readable.
Configure Automatic Alt Tags
After configuring title settings, switch to the ‘Alt Tag’ tab from the top.
From here, you can use the smart tags next to the ‘Alt Tag Format’ option to automatically generate alt text for all your images.
After that, you can also enable the Strip Punctuation setting if you want characters like dashes (-) or underscores (_) to be converted into spaces.
Similarly, if there are characters like numbers or plus signs (+) that you don’t want AIOSEO to strip when creating the alt text, then you can check the boxes for these options in the ‘Characters to Exclude from Being Stripped’ section.
You can also select a casing for your alt text.
Configure Automatic Captions and Descriptions
To generate automatic captions for your images, switch to the ‘Captions’ tab.
From here, make sure that the ‘Autogenerate Caption on Upload’ option is enabled. You can then select the smart tags that will be used to generate captions for your images.
Next, you can also use the Strip Punctuation feature to exclude or include characters in the captions and choose a casing for them.
Once you are done, you need to switch to the ‘Description’ tab from the top.
From here, make sure that the ‘Autogenerate Description on Upload’ option is enabled. You must also select the smart tags you want to use for generating automatic image descriptions.
Next, you can also use the Strip Punctuation feature to include/exclude characters like underscores, apostrophes, or numbers in the description.
After that, simply select a casing for your image descriptions.
Configure Automatic Filenames
As we mentioned earlier, we recommend giving your image files SEO-friendly file names. You can do this before uploading your images, or AIOSEO can do it for you automatically.
Once you switch to the ‘Filename’ tab from the top, you will notice that AIOSEO has already configured the Strip Punctuation setting for you.
However, if there are any more characters that you want AIOSEO to delete from your image filenames when creating titles or alt text, then you can type those characters into the ‘Words to Strip’ box.
After that, you can also select a casing for your filenames.
Once you are done, don’t forget to click the ‘Save Changes’ button to store your settings.
You have now successfully optimized your images for SEO, and AIOSEO will automatically generate titles, alt text, captions, and descriptions for all your images.
You may also want to allow your users to upload their own images to your WordPress website. This can come in handy if you are hosting a contest or running a photography website that accepts user-generated images.
For this, you can use WPForms, which is the best contact form plugin on the market. It comes with a drag-and-drop builder that makes it super easy to create any kind of form you want, including an image submission form.
Upon activation, head over to the WPForms » Add New screen from the WordPress dashboard to launch the form builder.
From here, you need to type a name for your form and then click the ‘Use Snippet’ button under the ‘Simple Contact Form’ template.
This will load the form template in the form builder, where you will notice its preview on the right and the available fields in the left column.
From here, go ahead and drag and drop the File Upload field onto the form and click on it to further customize its settings.
From here, you can change the label and description of the field and even specify the extensions that are allowed.
For example, if you want to allow JPEG and PNG files only, then you must type these options into the ‘Allowed File Extensions’ field. Keep in mind to separate each extension with a comma.
After that, you can also configure the maximum image file size and number of uploads in the left column.
Once you are done, just click the ‘Save’ button to store your settings.
Next, open the page/post where you want to add the image upload form. Once there, click the ‘+’ button in the top left corner of the screen to open the block menu
From here, you need to add the WPForms block to the page/post.
Just choose the image file upload form that you created from the dropdown menu.
Finally, click the ‘Update’ or ‘Publish’ button to store your settings. Now, you can visit your WordPress site to view the form in action, and visitors will be able to submit their images using the form.
Are you looking to add recipe cards to your WordPress content?
Millions of people online are searching for recipes every single day. Whether it’s for whipping up a quick weekday dinner or impressing guests with a show-stopping dessert, recipe cards with easy-to-follow instructions can guide readers to recreating their desired dish.
In this article, we will show you step-by-step how to make recipe cards in WordPress.
What Are Recipe Cards And Why Use Them?
Recipe cards provide the ingredients and instructions for cooking a particular dish. These cards often feature a structured format with sections such as:
Recipe title
List of ingredients
Step-by-step instructions
Additional notes or tips
Nutritional facts
They’re essentially blueprints for whipping up delicious dishes. Recipe cards are perfect for cooks of all skill levels, especially busy people in need of quick and easy meal ideas. They’re laid out in a tidy format, allowing your readers to recreate your meals easily and simply.
Besides that, they’re highly shareable, which is helpful for building your social media presence. Also, recipe cards use structured data (schema markup), meaning they have better odds of appearing higher in search engine rankings.
Chances are, if you run a food blog, have a restaurant website, or are a health and wellness professional, you already have thought about adding recipes to your site.
Best of all, it doesn’t take complex coding or a ton of technical know-how to do so. Let’s dig in and see how it’s done.
Adding Recipe Cards With WP Tasty Recipes
The best way to add recipe cards is with a recipe plugin like WP Tasty Recipes. It’s a simple plugin that lets you customize your recipes in lots of ways.
Next, head over to the WP Tasty » Dashboard from your WordPress admin. Click on ‘Enter License.’
A popup window will appear. Simply paste your license key from the downloads page from your WP Tasty account.
Select the ‘All Plugins’ and then hit the ‘Save License’ button.
Step 2: Adjusting the Recipe Card Design
Next, it’s a good idea to adjust the design of the recipe card to fit your needs.
Go to the WP Tasty » Tasty Recipes page from your WordPress dashboard.
Under the Design tab, you can customize how your recipe card will look.
You can customize elements like as button colors, title and subtitle colors, star ratings, and even a social footer.
If you scroll all the way to the bottom, you’ll notice that the ‘Default Template’ is selected.
Click on the left and right arrows and pick the template that you find most visually appealing and suits your site’s design the best.
From there, make sure to click ‘Save Changes.’
Step 3: Adding Recipe Cards to a Post in WordPress
Next, head over to the post that you want to add your recipe card to. Click on the ‘+’ icon in the upper-left of the block editor to add a new block.
Here, you can search and select the ‘Tasty Recipe’ block.
From there, a window will appear on the screen. This is where you’ll need to add all of the information about your recipe.
It’s important to add as many details as possible so that Google can easily identify the information and give you the best odds to display rich snippets in search results.
Here, you’ll be able to add the following information:
Title
Recipe image
Author Name
Description
Ingredients
Instructions
Notes
Details such as prep time, cook time, yield, category, etc.
Keywords
Video URL
Equipment
Nutrition
Once you’ve filled out the information about your recipe, click the ‘Insert’ button at the bottom.
After that, all you have left is to make sure that your recipe card is live on the site!
Step 4: Publishing Your Recipe Card
Now, you’re ready to publish your recipe card. Just hit the ‘Publish’ or ‘Update’ button at the top.
Now, just go to the front end of your website to see your recipe card in action.
Here’s what our S’mores Brownies card looks like on the front end of our demo site.
Step 5: Adding the ‘Pin It’ Button to Your Recipe Card (Optional)
If you upgraded to the WP Tasty ‘All Access’ plan or bought the Tasty Pins product, then you may want to also add a ‘Pin It’ button to your recipe card so that your readers can easily add the recipe to a Pinterest board.
When readers pin your recipe to Pinterest, it will show your image to more users on the platform. As a result, that can potentially drive more traffic to your website.
Scroll to the bottom of your block editor and then add a Pinterest image, title, and text, which will be used to optimize your images for SEO and Pinterest.
This will apply a ‘Pin It’ button to all images related to the recipe card, making your content much easier to share.
Bonus: Adding SEO-Friendly Recipes With Schema in WordPress
Making recipe cards is only one piece of the puzzle. You also have to make sure you drive as much traffic as possible to your recipes. That could ultimately lead to more sales of your cookbook, affiliate sales, or bookings for your services.
The best way to do that is to add a recipe schema markup in WordPress by using the All in One SEO plugin.
Once installed and activated, you’ll have the ability to generate any type of schema in your posts or pages.
You’ll need to scroll to the bottom of the block editor where it says ‘AIOSEO Settings.’ Then, under the ‘Schema’ tab, select ‘Generate Schema.’
From here, a popup window will appear where you’ll see a variety of schema templates from which to choose. This does all the heavy lifting for you since it creates structured data based on the type of post you’re publishing.
In this case, we’d click on the ‘+’ icon next to ‘Recipe.’
You’ll enter all of the details of your recipe in the Schema Generator.
You and your visitors won’t be able to see a difference on your website, but search engine bots will have the information they need for featured snippets.
Do you want to show multiple blog posts in a WordPress loop?
Using the loop, WordPress processes each of the posts to be displayed on the current page. It formats them according to how they match specified criteria within the loop tags.
In this article, we will show how to display any number of posts in a WordPress loop.
What Is the WordPress Loop?
The loop is used by WordPress to display each of your posts. It is PHP code that’s used in a WordPress theme to show a list of posts on a web page. It is an important part of WordPress code and is at the core of most queries.
In a WordPress loop, there are different functions that run to display posts. However, developers can customize how each post is shown in the loop by changing the template tags.
For example, the base tags in a loop will show the title, date, and content of the post in a loop. You can add custom tags and display additional information like the category, excerpt, custom fields, author name, and more.
The WordPress loop also lets you control the number of blog posts that you show on each page. This can be helpful when designing an author’s template, as you can control the number of posts displayed in each loop.
That being said, let’s see how to add any number of posts to a WordPress loop.
Adding Any Number of Posts in a WordPress Loop
Normally, you can set the number of posts to be displayed in the loop from your WordPress admin panel.
Simply head to Settings » Reading from the WordPress dashboard. By default, WordPress will show 10 posts.
However, you can override that number by using a Super Loop, which will allow you to display any number of posts in that specific WordPress loop.
This will allow you to customize the display settings of your pages, including author profiles, sidebars, and more.
First, you will need to open a template file where you would like to place the posts and then simply add this loop:
<?php
// if everything is in place and ready, let's start the loop
if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
// to display 'n' number of posts, we need to execute the loop 'n' number of times
// so we define a numerical variable called '$count' and set its value to zero
// with each iteration of the loop, the value of '$count' will increase by one
// after the value of '$count' reaches the specified number, the loop will stop
// *USER: change the 'n' to the number of posts that you would like to display
<?php static $count = 0;
if ( $count == "n" ) {
break;
} else { ?>
// for CSS styling and layout purposes, we wrap the post content in a div
// we then display the entire post content via the 'the_content()' function
// *USER: change to '<?php the_excerpt(); ?>' to display post excerpts instead
<div class="post">
<?php the_title(); ?>
<?php the_content(); ?>
</div>
// here, we continue with the limiting of the number of displayed posts
// each iteration of the loop increases the value of '$count' by one
// the final two lines complete the loop and close the if statement
<?php $count ++;
} ?>
<?php endwhile; ?>
<?php endif; ?>
Note: You will need to replace the value of ‘n‘ in the if ( $count == "n" ) part of the code and choose any number.
An easy way to add this code to your WordPress website is by using the WPCode plugin. It is the best code snippet plugin for WordPress that helps you manage custom code.
By using WPCode, you don’t have manually edit theme template files and risk breaking something. The plugin will automatically insert the code for you.
Upon activation, you can head to Code Snippets » + Add Snippet from your WordPress dashboard. Next, you need to select the ‘Add Your Custom Code (New Snippet)’ option.
After that, simply paste the custom code for the WordPress loop that we showed you above into the ‘Code Preview’ area.
You will also need to enter a name for your code and set the ‘Code Type’ to ‘PHP Snippet’.
Next, you can scroll down to the ‘Insertion’ section and choose where you would like to run the code.
By default, WPCode will run it everywhere on your WordPress website. However, you can change the location to a specific page or use a shortcode to insert the code.
For this tutorial, we will use the default ‘Auto Insert’ method.
When you are done, don’t forget to click the toggle at the top to make the code ‘Active’ and then click the ‘Save’ button. WPCode will now deploy the code on your WordPress blog and display the specified number of posts in the WordPress loop.
Do you want to email authors when their articles are published in WordPress?
If you run a multi-author blog, then notifying authors when their blog posts are published keeps them informed. Plus, it can also help increase engagement on your website since authors can quickly share their content and participate in discussions.
In this article, we will show you how to email authors when their articles are published in WordPress.
Why Email Authors When Their Articles Are Published in WordPress?
By notifying authors when their posts are published on your WordPress blog, you allow them to immediately promote their work on social media platforms and communicate with readers in the comments section.
Additionally, notifications keep authors updated about the publication statuses for different posts. This helps build trust among your team by showing that you value the writer’s contributions to your multi-author blog.
By alerting authors immediately upon post publication, you also give them the opportunity to view their content and correct any typos or errors before visitors have a chance to read it.
Having said that, let’s see how to easily email authors when their articles are published in WordPress. You can use the links below to jump to the method of your choice:
Upon activation, you need to visit the Planner » Settings page from the WordPress admin sidebar and switch to the ‘Notifications’ tab.
Once you are there, type in the admin email address that will be used to send emails to your authors next to the ‘Email from’ option.
After that, check the ‘Always notify the author of the content’ option to send emails to authors every time their posts are published on your website.
If you also want to notify the users who edited the post, then you can check the ‘Always notify users who have edited the content’ option.
Once you are done, click the ‘Save Changes’ button to store your changes.
Now, when you publish an author’s post, they will receive an email notification that looks like this:
Method 2: Email Author When Their Article Is Published in WordPress Using Code
If you don’t want to use a plugin, then you can also automatically send emails to authors by adding code to your theme’s functions.php file.
However, the smallest error when adding code can break your website and make it inaccessible.
That is why we recommend always using WPCode. It is the best WordPress code snippets plugin on the market that makes it super safe and easy to add custom code to your website.
First, you need to install and activate the WPCode plugin. For details, you can see our step-by-step guide on how to install a WordPress plugin.
Note: You can also use WPCode’s free plan for this tutorial. However, upgrading to the pro version will give you access to more features like a code snippets library, conditional logic, CSS snippets, and more.
Upon activation, simply visit the Code Snippets » + Add Snippet page from the WordPress dashboard. Then, click the ‘Use Snippet’ button under the ‘Add Your Custom Code (New Snippet)’ option.
This will take you to the ‘Create Custom Snippet’ page, where you can start by adding a title for the code snippet.
After that, select the ‘PHP Snippet’ option from the Code Type dropdown menu on the right.
Now copy and paste the following custom code into the ‘Code Preview’ box:
function notifyauthor($post_id) {
$post = get_post($post_id);
$author = get_userdata($post->post_author);
$subject = "Post Published: ".$post->post_title."";
$message = "
Hi ".$author->display_name.",
Your post, \"".$post->post_title."\" has just been published.
View post: ".get_permalink( $post_id )."
Thanks"
;
wp_mail($author->user_email, $subject, $message);
}
add_action('publish_post', 'notifyauthor');
This code runs when a new post is published in WordPress. It sends an email notification to the author using the subject and message defined in the code. Feel free to change the subject and message fields to meet your needs.
Once you have done that, scroll down to the ‘Insertion’ section and choose the ‘Auto Insert’ mode. The code will be automatically executed on your website upon activation.
Finally, scroll back to the top and toggle the ‘Inactive’ switch to ‘Active’.
After that, click the ‘Save Snippet’ button to store your settings.
Now, when you publish a post, the author will automatically receive an email notification.
It will look like this:
Bonus: Use WP Mail SMTP to Send Your Emails
When you send emails to your authors about their published posts, you are using the default WordPress email settings, which are not always reliable.
This means that your email may not reach the author or might even end up in their spam folder.
To fix this issue, you can use WP Mail SMTP, which is the best WordPress SMTP plugin on the market. It uses the SMTP (Simple Mail Transfer Protocol) method for mail transmission and eliminates your email delivery problems.
You can easily connect WP Mail SMTP with popular email marketing services and make sure that your emails reach the user’s inbox immediately.
With WP Mail SMTP, you can easily avoid the spam folder, track your email logs, use backup connections and failure alerts, and use premade templates to send emails to your users.
WordPress comments encourage discussions around your blog post content. However, you may find that comments that are very brief or overly long are not very helpful.
In this article, we will show you how to easily limit comment length in WordPress.
Why Limit Comment Length in WordPress?
An active comment area is a great way to build a community around your WordPress blog. Visitors can give feedback, ask questions, and offer their own points of view on the topic.
However, not all comments are helpful.
We’ve been moderating WordPress comments for well over a decade. In our experience, we’ve found that the most helpful comments are above 60 characters and below 5000 characters in length.
One-word comments are usually not very helpful. In most cases, they are spam comments where the author just wants a backlink from your site.
On the other hand, long comments above 5,000 characters are often rants or complaints. Sometimes, they are not even relevant to the article.
Setting comment length limits in WordPress can improve the overall quality of your comments and discourage spam comments. However, there is no built-in way of doing this in WordPress.
That being said, let’s take a look at how to control comment length in WordPress by setting minimum and maximum limits.
How to Limit Comment Length in WordPress
You can limit comment length in WordPress by adding code to your functions.php file. However, keep in mind that the smallest error while entering the code can break your site and make it inaccessible.
That’s why we recommend always using WPCode to insert code snippets into your WordPress site. It is the best WordPress code snippets plugin on the market that makes it safe and easy to add custom code.
First, you need to install and activate the WPCode plugin. For detailed instructions, see our step-by-step guide on how to install a WordPress plugin.
Note: WPCode also has a free version that you can use for this tutorial. However, upgrading to the paid plan will give you access to more features like a larger code snippets library, conditional logic, and more.
Upon activation, visit the Code Snippets » + Add Snippet page from the WordPress admin sidebar.
Here, click the ‘Use Snippet’ button under the ‘Add Your Custom Code (New Snippet)’ option.
This will take you to the ‘Create Custom Snippet’ page, where you can start by adding a title for your code snippet. This name won’t be displayed on the website front end and can be anything you like.
Next, choose the ‘PHP Snippet’ option as the Code Type from the dropdown menu in the right corner of the screen.
Once you have done that, simply copy and paste the following code snippet into the ‘Code Preview’ box:
add_filter( 'preprocess_comment', 'wpb_preprocess_comment' );
function wpb_preprocess_comment($comment) {
if ( strlen( $comment['comment_content'] ) > 5000 ) {
wp_die('Comment is too long. Please keep your comment under 5000 characters.');
}
if ( strlen( $comment['comment_content'] ) < 60 ) {
wp_die('Comment is too short. Please use at least 60 characters.');
}
return $comment;
}
This code snippet works by adding a filter hook to preprocess_comment. This filter is run before WordPress saves any comments to the database or performs any pre-processing on submitted comments.
It checks the comment length and displays an error message if it is too short or too long. By default, the comment limit is set to a minimum of 60 characters and a maximum of 5,000 characters in this snippet.
However, to set your own comment limit, just replace the number 5,000 in the code with your maximum limit number.
Similarly, you can replace the number 60 in the code to set a different minimum comment limit on your WordPress website.
You can also change the message that will be displayed on your website when a user exceeds or falls short of the comment limit. Simply type the sentence you want to display after the wp_die lines in the code.
After that, scroll down to the ‘Insertion’ section and choose the ‘Auto Insert’ mode.
The custom code will be automatically executed on your website upon activation.
If you only want to limit comment length on specific website pages, then you can also do that.
Simply scroll down to the ‘Conditional Logic’ section and toggle the ‘Enable Logic’ switch.
After that, choose the ‘Show’ option from the ‘Conditions’ dropdown menu and click the ‘+ Add new group’ button.
This will open a new tab where you must select the ‘Page URL’ option from the dropdown menu on the left.
Next, type the URL of the page where you want to limit the comment length in the field on the right.
Now, the code snippet will only be activated on the page with the URL you have just entered.
Scroll back to the top of the page and toggle the ‘Inactive’ switch to ‘Active’.
Finally, click the ‘Save Snippet’ button to store your settings.
Now, when a user types a comment that falls short of your minimum comment length, this message will be displayed on their screens.
Users won’t be able to post a comment until it is at least the minimum length you chose.
Similarly, when a user types a comment that exceeds your maximum limit, this message will be show on their screens.
This will help reduce rants and spam comments on your website.
Bonus: Improve Comment Engagement on Your WordPress Site
Controlling comment length is just one way to increase engagement in your WordPress comments section. This is great for keeping visitors on your site for longer and can even benefit your site’s SEO when users’ comments contain relevant keywords and add context to your content.
You can also easily further improve the comments section on your website using Thrive Comments.
It is the best WordPress comments plugin that comes with a dedicated moderation board, lets you lazy load comments, allows users to leave comments with their social media profiles, and more.
Plus, the tool enables you to add an upvote/downvote functionality to reduce spam and encourage interesting comments on your website.
Thrive Comments even lets you feature encouraging comments at the top and bury offensive or irrelevant comments at the bottom of the discussion section.
This allows you to reward users who are adding the most value to the discussion while politely discouraging other users from leaving unhelpful comments.
Are you looking for a way to create a sticky floating footer bar in WordPress?
A sticky floating footer bar stays visible on your website even when users scroll down on your page. It can help you promote discount offers or social media handles, which can reduce the bounce rate and get more conversions.
In this article, we will show you how to easily create a sticky floating footer bar in WordPress, step by step.
What Is a Floating Footer Bar in WordPress?
A sticky floating footer bar allows you to prominently display important content and news to users.
This bar remains visible to visitors at all times, so they are more likely to click on it and discover more useful content.
Having said that, let’s see how to easily create a sticky floating footer bar in WordPress. We will show you two methods in this tutorial, and you can use the links below to jump to the method of your choice:
Method 1: Create a Sticky Floating Footer Bar With OptinMonster (Recommended)
You can easily create a sticky floating footer bar with OptinMonster. It is the best lead generation and conversion optimization tool on the market that makes it super easy to convert your website visitors into subscribers.
OptinMonster comes with a drag-and-drop builder and premade templates that allow you to create a floating footer bar, slide-in popups, and banners without using any code.
We recommend this method because OptinMonster is super easy to use and offers more customization options than the free plugin method.
Step 1: Install OptinMonster on Your Website
First, you will need to sign up on the OptinMonster website by clicking on the ‘Get OptinMonster Now’ button.
Upon activation, the OptinMonster setup wizard will open up on your screen, where you have to click the ‘Connect Your Existing Account’ button. This will connect your WordPress site with your OptinMonster account.
Once you do that, a new window will open up on your screen.
Here, click the ‘Connect to WordPress’ button to move ahead.
Step 2: Create And Customize the Floating Sticky Footer Bar
Now that you have connected OptinMonster with your website, it’s time to create a sticky floating footer bar.
To do this, you need to visit the OptinMonster » Templates page from the WordPress admin sidebar and select ‘Floating Bar’ as the campaign type.
Once you do that, all the premade templates for the floating bar will load on the screen. From here, you can click the ‘Use Template’ button on the one you want to use.
This will open the ‘Create Campaign’ prompt on the screen, where you can add a name for the floating footer bar that you are about to create. It can be anything you like, as the name won’t be displayed to your visitors.
After that, just click the ‘Start Building’ button.
OptinMonster’s drag-and-drop builder will now be launched on your screen, where you can start customizing your floating footer bar. Here, you will notice a floating bar preview on the right with blocks in the left column.
For example, you can use a countdown timer block if your floating footer bar is promoting a discount offer. This will help create a sense of urgency among users and encourage them to take action.
You can also add a CTA, video, or social media block to the footer bar. For detailed instructions, you can see our tutorial on how to create an alert bar in WordPress.
You can also edit text on the footer bar by clicking on it. This will open the block settings in the left column, where you can adjust them according to your liking.
For example, if you want to change the discount offer in the template, then you can change the button text. After that, you can select the ‘Redirect to a URL’ option and add the page link that you want users to be directed to upon clicking on the button.
Step 3: Configure The Display Rules For Your Floating Footer Bar
Once you are satisfied with your footer bar’s customization, just switch to the ‘Display Rules’ tab from the top.
Here, you can configure when to display the bar on your page. If you want to display the floating footer bar at all times, then you must select the ‘time on page’ option from the left dropdown menu.
After that, choose the ‘is immediate’ option from the dropdown menu on the right.
However, to display the floating footer bar on a specific page, you must select the ‘Page Targeting’ option from the right dropdown menu.
After that, choose the ‘exactly matches’ option from the dropdown menu in the middle and then add a page URL. Once you do that, the floating footer bar will only displayed on the page you chose.
Additionally, you can select the ‘Exit Intent’ option to show the sticky floating footer bar when the user is about to leave your site. You can then configure the exit intent sensitivity and choose the devices where the footer bar will be displayed. This can be handy if you want to reduce your bounce rate.
You can even select the ‘Visitor’s Device’ option if you only want to display the floating footer bar to desktop visitors.
You can also configure the display rules according to the date, time, or scroll distance by selecting the ‘When’ option from the left column.
Method 2: Create a Sticky Floating Footer Bar With a Free Plugin
If you are looking for a free way to create a sticky floating footer bar, then this method is for you. However, keep in mind that you will have limited customization options compared to OptinMonster.
Upon activation, visit the Firebox » Campaigns page from the WordPress dashboard and click the ‘+ New Campaign’ button.
This will open the Firebox campaign library, where you can search for sticky floating bar premade templates.
Next, simply click the ‘Insert’ link under the floating footer bar that you like. Keep in mind that if you select a header bar, then you won’t be able to change its position. You must ensure the template you select is for a footer bar.
The block editor will now open up on your screen, where you can start by adding a name for your floating bar.
After that, you can edit the text in the footer by clicking on it and add new blocks by clicking the ‘+’ button. This will open the block menu, where you can add images, headings, paragraphs, videos, quotes, or list blocks.
For instance, if you want to add social media handles, then you can choose the Social Icons block. After that, you can add social media accounts and links using the block panel.
You can also change the text in the button block and add a link to the page where you want to direct users by clicking on the link icon in the block toolbar.
After that, type in the URL of your choice and press ‘Enter’.
Next, you can scroll down to the ‘Firebox Settings’ section.
Here, you can change the background color, text color, alignment, size, padding, and margin for the floating footer bar.
After that, switch to the ‘Behaviour’ tab from the left column and select ‘Page Load’ as the floating bar trigger point.
Then, use the ‘Delay’ slider to choose a delay timing for the floating bar. For example, if you drag the slider to 15 seconds, then the floating footer bar will be displayed once the user has spent 15 seconds on your site.
If you want the sticky floating footer bar to be displayed immediately, then you can keep the slider at 0.
Next, you can leave other settings as they are or configure them according to your liking.
Once you are done, don’t forget to click the ‘Publish’ button at the top.
Now visit your WordPress site to view the sticky floating footer bar in action.
This is what it looked like on our demo site.
Bonus: Create a Sticky Floating Navigation Menu in WordPress
Apart from adding a sticky footer bar, you might also like to create a sticky floating navigation menu on your WordPress site.
A navigation menu contains links to the most important pages on your WordPress blog and acts as an organizational structure for your website.
If you make this menu sticky, then it will remain visible on your page at all times, even as the user scrolls down on your screen. This can increase engagement and make your website easier to navigate.
Upon activation, visit the Settings » Sticky Menu page from the WordPress dashboard and type #main-navigation next to the ‘Sticky Element (required)’ option.
After that, click the ‘Save Changes’ button to store your settings. You have now successfully created a sticky floating navigation menu.
Are you looking to customize the Minecraft game setup or add players to your fantasy world? If this is the case, you’ll need a Minecraft server hosting provider. However, due to the game’s high resource needs, it can be difficult to find a suitable host. It’s easier to select the right Minecraft hosting server when […]
In the digital era, where online interactions and transactions have become the norm, the importance of identity verification cannot be overstated. For WordPress site owners, implementing ID verification is a…
Do you want to learn how to create custom meta boxes for your WordPress posts, pages, and custom post types?
WordPress adds metadata to your content automatically, such as the publication date, categories, and tags. However, you may also want to add your own custom meta data.
In this article, we will show you how to easily add unique information to your content, by creating a custom meta data box in WordPress.
What is a Custom Meta Box in WordPress?
When you create posts and pages, or custom post types in WordPress, that content usually has its own metadata. This metadata is information related to the content like date and time, the author name, title, and more.
You can also add your own metadata using the default custom fields box.
The Custom Fields box is a good solution if you just want to add custom metadata to a few posts. However, if you plan to add lots of unique information to your content, then it makes sense to create a custom metadata box.
In fact, many of the popular WordPress plugins add custom meta boxes to the Edit screen for posts and pages. In the following image, you can see how easy it is to add SEO information to your post, using a custom meta box provided by AIOSEO.
With that being said, let’s see how you can easily add custom meta boxes in WordPress posts and post types.
How to Add Custom Meta Boxes in WordPress Posts and Post Types
The easiest way to add custom meta boxes to WordPress is by using Advanced Custom Fields. This plugin allows you to attach all kinds of extra information to your posts and pages, and then show that data to visitors using a shortcode.
The first thing you need to do is install and activate the Advanced Custom Fields plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.
Create a Custom Meta Box
Upon activation, go to ACF » Field Groups and then click on the ‘Add New’ button.
Here, you can create the custom fields that will appear in the metadata box.
To start, you’ll need to type a title into the field that shows ‘Field Group Title’ by default. This will appear in the WordPress content editor, and it will be used as the title of your meta box.
With that being said, you should use something descriptive, especially if you manage a multi-author WordPress blog or share the dashboard with other people.
With that done, you’re ready to add the first field to your meta box.
Add Custom Fields to the Meta Box
To start, open the ‘Field Type’ dropdown and choose the type of field you want to add, such as Text, Date Picker, Checkbox, or any other field type.
After that, type in a label for the field.
Advanced Custom Fields will show this label before the field, so it will help users understand what information they need to enter.
Advanced Custom Fields will generate the ‘Field Name’ automatically, so you can leave this field empty.
With that done, you may want to type in a ‘Default Value.’ This will be added to the page, post, or custom post type automatically if the user doesn’t add their own information.
You may see more options depending on the kind of field you’re creating. For example, if you selected ‘Image’ from the ‘File Type’ dropdown, then you can choose the image format.
Most of these options are self-explanatory so you can follow the onscreen instructions to configure the custom field.
When you’re happy with how the field is set up, click on ‘Close Field’ to collapse the section.
You can now add more fields to the custom meta box by clicking on the ‘Add Field’ button.
Then, simply configure the field by following the exact same process described above.
Add a Custom Meta Box to the WordPress Content Editor
When you’re happy with how the custom meta box is set up, you’ll need to define where and when the meta box will appear.
Scroll to the ‘Settings’ section and then click on the ‘Location Rules’ tab.
Advanced Custom Fields can add the box to all kinds of content. For example, you can show the meta box on specific post types, categories, taxonomies, navigation menus, and more.
Simply use the dropdown menus to choose where the meta box will appear in your WordPress dashboard. For example, if you accept guest posts then you may want to add the box to all posts in the ‘Guest Posts’ category.
After that, click on the ‘Presentation’ tab.
Here, you can choose the meta box style, where it appears on your WordPress blog, and where the label and instructions will appear.
If you plan to add multiple boxes in the same location, then you can change the order they appear in by typing into the ‘Order No’ field.
If you’re unsure, then you can leave this field set to 0.
On this screen, you’ll also see a list of all the fields that WordPress usually shows on the post edit screen.
If you want to hide a field, then simply check its box. For example, if you’re using custom fields to create an author info box, then you may want to hide the default ‘Author’ field.
When you’re happy with the changes you’ve made, click on ‘Save Changes’ to make the field group live.
You’ve now successfully created a custom meta box for your WordPress post, page, or custom post type. Depending on your settings, you can now visit the post editor to see the custom meta box in action.
Displaying Your Custom Meta Box Data in WordPress Theme
You’ve now successfully added a custom meta box to the WordPress dashboard. Any information users type into the meta box will be stored in the WordPress database when they save or publish the post. However, this information won’t appear on your website by default.
With that in mind, let’s make sure the custom metadata appears in your WordPress theme, so visitors can see it.
You can do this using shortcode or by editing your WordPress theme files.
How to Display Custom Metadata using Shortcode
Adding a shortcode in WordPress is the easiest method, and allows you to control exactly where the information appears on your website. For example, if you’ve created a ‘Star Rating’ field, then you can show this information after the post title, inside the content, in the footer, or anywhere else simply by adding a shortcode.
However, you will need to add a shortcode to every page, post, or custom post type manually. This can take a lot of time and effort, especially if you have a lot of content.
To get a field’s shortcode, go to ACF » Field Groups. Then, hover over the field group that you want to display and click on the ‘Edit’ link when it appears.
You’ll now see all the fields that make up this group.
For each field you want to display, make a note of the value in the ‘Name’ field.
With that done, go to the page, post, or custom post type where you want to show the custom metadata.
You can now click on the ‘+’ icon and type in ‘Shortcode.’
When the right block appears, click to add it to your layout.
You can now add the following shortcode to the block, making sure to replace "article_byline" with the name of the field you want to show.
You can now repeat these steps to add multiple custom fields to the post.
When you’re happy with the changes you’ve made, either click on the ‘Publish’ or ‘Update’ button. Now, simply visit your WordPress website to see the custom metadata in action.
How to Display Custom Metadata by Editing Your WordPress Theme
If you want to show custom metadata in the same location on every page, post, or custom post type, then you can add code to your WordPress theme files.
This can save you time in the long-term, but it isn’t the most beginner-friendly method. You’ll also lose all the custom code the next time you update your WordPress theme, which is why we recommend creating a child theme. You can then add your custom code to the child.
You’ll need to edit the file where you want to show the custom metadata. This will vary depending on your theme, but you’ll usually need to edit your site’s single.php, content.php, or page.php file.
Once you have the right file, you’ll need to add the code inside the WordPress loop. To find this loop, simply search for code that looks something like this:
<?php while ( have_posts() ) : the_post(); ?>
You can then paste your code after this line and before the line that ends the loop:
<?php endwhile; // end of the loop. ?>
As an example, your custom field code should look something like this:
Notice how we wrapped the code in a h2 heading with a CSS class. This allows us to format and style the custom field later by adding custom CSS to our theme.
New WordPress users often require assistance with customizing their website header. This includes tasks such as changing the background color and image, adjusting the font size and style, and making…