Searching for the best way to set up WordPress dynamic content? In this post, you’ll learn a code-free way to easily add dynamic content directly to the native WordPress block editor (AKA Gutenberg). 😎
You can use this method to dynamically insert links, images, user profile information, post meta, and more. You can also integrate it with Advanced Custom Fields (ACF) to pull in data from ACF, all without needing any code!
In this post, we’ll briefly introduce you to the concept of dynamic content in WordPress. Then, we’ll show you step-by-step how to use the Otter plugin to insert dynamic links, images, user profile information, content values, and ACF data.
Let’s get started!
What is WordPress dynamic content?
Most website content is static. That means that you enter the content directly in the content editor and all of your site’s visitors see the exact same content from the editor.
With WordPress dynamic content, on the other hand, you can dynamically populate certain content by pulling it in from your database. Here are some examples of WordPress dynamic content in action:
- If you allow registration on your site, you could dynamically insert a user’s name to address them by their name. For example, user “Dave” would see the text “Hello, Dave,” while user “Sally” would see the text “Hello, Sally.” Or, you could dynamically insert each user’s profile image.
- You can dynamically insert post information. For example, you could include the publish date of a post in your content. If you ever change the publish date in WordPress, that reference would dynamically update in the content.
- You can dynamically insert a link, such as your affiliate link for a store. If you ever need to change that link, you could update the link in one spot and automatically start using the new affiliate link across your entire site.
- You can dynamically insert information from custom fields. For example, you could use Advanced Custom Fields to store custom information and then dynamically pull in that information to display it in your post. If you ever update the data in the custom field, the information in the post will also update.
- You can dynamically insert other information, such as today’s date. Every day, that reference will dynamically update to show the current date without requiring any manual effort.
Overall, understanding how to use WordPress dynamic content can open up a lot of opportunities for personalizing your website’s content, building custom content sites, streamlining your admin processes/removing manual labor, and more. 🤩
How to create WordPress dynamic content with Otter
Now that you understand what dynamic content is, it’s time to explore how you can create it. For this tutorial, we’ll be using Otter, a free plugin you can get from the WordPress plugin library.
Otter lets you easily start using WordPress dynamic content in the native WordPress block editor, without requiring any technical knowledge.
Once you’ve installed the plugin, you can start adding various types of dynamic content.
Below, you’ll learn how to work with a variety of different types of dynamic content in WordPress, including the following:
1. Dynamic links 🔗
Adding dynamic links to your WordPress site with Otter is quite simple.
First, you’ll need to highlight the text you want to add a link to, the same way you would if you wanted to add an ordinary link. Instead of clicking on the link icon, however, you’ll want to click on the down arrow and choose Dynamic Link from the dropdown menu:
Next, choose the type of link you’re adding from the Data Type dropdown menu. Your options include Post URL, Site URL, Featured Image URL, Author URL, and Author Website. If you decide to spring for the paid version of Otter, you’ll also have access to options for Post Custom Field and Advanced Custom Fields. For the purposes of this tutorial, we’ll choose Author URL.
You can also set the link to open in a new tab, then click Apply. From there, Update your page. Now you’ll be able to see your dynamic link when you look at the published version of the page, and when you click on it, you’ll be taken to the page for the author of the content:
2. Dynamic values 🎿
Next, let’s take a look at dynamic values. This feature allows you to easily add several types of content that will change to reflect the settings and content of the page you’re working on. In this section, I’ll show you how to add the most popular types of dynamic content.
First, if you want to add information about the post itself, type % into the area where you want to add it. A menu will appear with options for dynamic WordPress content you can insert:
For this example, I chose Post Type. This selection now shows up in the editor:
Now you’ll be able to see the post type displayed in the preview or published draft of your page:
This can be an effective way to add post information to your content, but you’ll note that some forms of dynamic content offered by Otter don’t appear in the dropdown menu when you type %. If you want to add an author byline, for example, you’ll need to use a method similar to how we added the dynamic link in the previous section.
Click on the block or section of the block you want to add dynamic content to, then choose Dynamic Value from the menu that appears:
Next, select Author Name from the Data Type menu:
Click Apply and then Update your page. Now when you open the page, you’ll be able to see the author name in the area you specified:
Dynamic images 🖼️
You can also add dynamic images to your WordPress pages. To start this process, create an image block and choose Media Library as the location for your image:
Next, click on the Dynamic Images section of the Media Library. Here you’ll be able to choose from a variety of dynamic image types including Featured Image, User Image, and Website Logo. For this tutorial, I decided to use Author Image.
Once you’ve picked the image type you want, click Select. This will place the appropriate image for this piece of content in your image block:
User information 🧑💻
Another type of dynamic value you can add is user information. This category of content is only displayed when a user is logged in and includes information like their username and email address. For example, if you want to create a membership program, you might want to use this feature to add a greeting to the page users see when they first log in.
To do this, write out your greeting, click on the down arrow in the block editor menu, and select Dynamic Value. Then, in the Data Type menu, scroll down to the Logged-in User options and choose Logged-in User Name.
Next, view the preview or published version of your page. You should now see your own name in this area:
3. Using Advanced Custom Fields to create WordPress dynamic content ⚙️
The next thing we’ll look at is how to use Advanced Custom Fields to create more types of dynamic content with Otter. To do this, you’ll need to install the Advanced Custom Fields plugin on your site. You’ll also need to invest in the Pro version of Otter.
Once you’ve installed Advanced Custom Fields, click on the ACF option now visible in the sidebar of your WordPress admin area:
You’ll then be prompted to create a Field Group, which is a tool used to organize your custom fields. To create one, simply give it a name, then add a field by selecting a field type and entering a field label. For this tutorial, I’ve created a text field group called Test with the label Location. Note that you can also add a Default Value, which will be the content that automatically appears in this field. For now, however, I’ve left this area blank.
You’ll also want to set location rules to determine where this custom field appears. For this tutorial, I’ve set the Location field to appear when Page Type is equal to Top Level Page. This means that it will appear on any page that doesn’t have a parent page.
Now head back to the page you’re working on and scroll to the bottom of the content. This is where you’ll see your new custom field:
Type the information you want to use as your dynamic value into this field:
Next, return to the main content of your page and add the text you want to connect to your custom field information:
Type in the % symbol and choose Advanced Custom Fields from the menu that appears:
Next, click on the Advanced Custom Fields option now visible within the text itself. This opens a Data Type menu. Open the Settings area of this menu and select the custom field you want to use from the dropdown menu that appears.
Click Apply and then save your page.
Now you'll be able to see the dynamic information you've just added when you view the page:
You can add a variety of content types using Advanced Custom Fields, including text, links, and images.
Final thoughts on creating WordPress dynamic content 🧐
Using the dynamic content feature of Otter makes it easy to add certain types of content to specific areas of your website.
👉 Here are some examples of what you can add with dynamic content:
- Post titles and dates
- Author bios and links
- Author photos
- User greetings and other information useful to logged-in users
You can also combine Otter with Advanced Custom Fields to add even more types of dynamic content to your site.
And this is only one of many things you can do with Otter – check out our full Otter review to learn more about this plugin. 👨🎓
What types of WordPress dynamic content are you most interested in adding to your website? Let us know in the comments section below!
Don’t forget to join our crash course on speeding up your WordPress site. Learn more below: