Documentation

How to Use wpDynamicContent

Tutorial Video

Step by Step Instructions

Step 1: Upload the Plugin to WordPress

Download the zip file and go to Plugins –> Add New

Next, click the ‘Upload’ button to upload the Zip file (do not unzip the file). Upload the zip file to WordPress and click ‘Install now’ – this will install the Plugin.

After you click ‘Install Now’ you’ll be directed to a new screen upon successful upload. Click ‘Activate’ to finish the process.

At this point the plugin should be successfully uploaded and installed to WordPress. You’ll find the plugin in the left hand navigation panel in WordPress. It’s called Dynamic Content Replacement. Click into the link to access the Plugin’s home screen.

Step 2: Navigating the Plugin

When you click into the Plugin from the WordPress navigation bar, you’ll see a main screen that looks something like below.

The Plugin itself is pretty simple. There are two main pages. The first page is where you access documentation and all of your dynamic content short codes.

The second screen is where you create and edit your dynamic content shortcodes.

Let’s create our first Dynamic Content shortcode.

Step 3: Creating Dynamic Content Shortcodes

To dynamically update the content on your page without having to touch any underlying code, we’re going to create what’s called a ‘shortcode’ inside of the plugin. The shortcode will be added directly to your page.

First, let’s start with the basics. What’s a short code?

Think of a shortcode as a shortcut to add features to your page that would normally require you to write a ton of code, usually in PHP and Javascript. A shortcode is written inside two square brackets. For example, the Gallery shortcode can be used to add a photo gallery of images to any page or post. It’s worth noting that a shortcode is not actually like traditional code and you do not need to write any code yourself. The plugin will generate a shortcode for you, then all you need to do is add the shortcode to your page.

To get started, click on the ‘New DCR’ button.

You’ll be directed to a create a DCR shortcode page that looks like the example below.

With the first version of this plugin, there are two types of shortcodes that you can create.

1. Dynamic Text Replacement shortcodes: This allows you to dynamically replace any text based content on the page, including title tags.
2. Dynamic Image Replacement shortcodes: This allows you to dynamically replace any image based content on the page.

Creating a Text Replacement Short Code

In this example, we’re going to dynamically replace the headline and title tag of the landing page to match a parameter in the URL of the ad.

Start by giving the shortcode a name. I’m going to name this shortcode ‘Pest Control Landing Page – Headline & Title Tag’

Next, complete the rest of the fields like in the image below.

1. DCR Type: This should be set to ‘Text Replacement” (the other option is ‘Image Replacement’)
2. URL Parameter: This can be anything but it must be visible in the URL parameter within the landing page. For example, if you’re going to pull in the keyword from the ad then you must have ‘keyword’ set in both the URL parameter of your ad URL and as the URL parameter inside of the dynamic content plugin. In this example, we’re going to add the term ‘service’ to the parameter, so we’ll also add service to the plugin.

Example URL Parameter:

The structure will look something like this: yourdomain.com/landingpage/?[parameter]={text from ad}

The output of the above could look like this yourdomain.com/landingpage/?service=Pest%20Control

The idea being that if we add ‘service’ as the URL parameter in both the URL of the ad and in the plugin, then the text on the landing page will dynamically update with the text the comes after the parameter of ‘service =’ — so in this case it would say Pest Control somewhere on the landing page.

You can follow this same process for updating anything in the ad headline, including keywords.

You can even string multiple parameters together for even more personalization on the page like this:

yourdomain.com/landingpage/?[parameter]={text from ad}&[parameter2]={text from ad}

So the above could look like this: yourdomain.com/landingpage/?service=Pest%20Control&location=Philadelphia

In the above case we can dynamically update the landing page to show both the service type and the location by adding multiple parameters to the URL. Simply add an ‘&’ sign between each parameter.

3. Fallback Text: Add fallback text in the case that the parameter is not visible in the URL or something breaks. This way, the prospect will not notice any difference.

After your shortcode is setup click Publish.

Next, you’ll need to copy and paste the shortcode into your landing pages, wherever you’d like to dynamically change the text based on your URL parameters.

First copy the full text in the shortcode box like in the image below.

Next, navigate to your landing page and paste the shortcode wherever you’d like it to appear. In this case, I added the short code to the headline of the landing page: It will look different for you depending on the theme that you’re using.

And I also added the short code to the title tag via Yoast.

Here’s what the output of the page looks like with the parameter of Service = Termite Control

Example: https://pestcontrolallentownpa.com/ppc-example/?service=Termite%20Control

And if we replace ‘termite control’ with ‘rodent control’ the page will dynamically update like below.

Example: https://pestcontrolallentownpa.com/ppc-example/?service=Rodent%20Control

And if there’s no parameter present then the page will show the fallback, which in this case is set to ‘Pest Control’

Now let’s walk through how to dynamically update images on your page.

Creating an Image Replacement Short Code

In addition to replacing text on the pages, you can also replace images. This is a great way to go the extra mile with even more personalization. Image replacement works just about the same way as dynamic text replacement.

First, go back into the wpDCR plugin and click on new DCR.

From the ‘DCR Type’ dropdown select ‘Image Replacement’ – this will give you a new set of options to update.

The next step is to set a URL parameter, which can be anything. In this case, we’re going to call the parameter ‘graphic’ but you can use whatever you’d like.

After you create the URL parameter start adding images by clicking on the ‘Add Option’ button. It helps to already have your images sized appropriately for your landing page and uploaded to the WP Gallery. Here’s the important part. Every image will need an associated parameter to indicate when the image should display. So for example, if the URL parameter is ‘image=rats’ then the first image of rats will appear. if the URL parameter is ‘image=termites’ then only the second image of termites will appear. And so on. We’ll get to a live example in a moment.

Finally, after you set your parameters you’ll need to add a fallback image just incase. We recommend going with something general that can apply to anything.

Finally click ‘Save’ — the next step is to grab the shortcode and add it to anywhere that you’d like the image to appear on the landing page when the parameter is present in the URL.

In this example, we’re going to replace the image below with the URL parameter that we generated with the wpDCR plugin.

To do this, simply open up your theme and paste the wpDCR shortcode where ever the images would normally go. This will vary depending on your theme.

Here’s the output when the URL parameter is set to graphic = rodents. Notice that the image updated to the rodent image that we set in the wpDCR plugin. Also notice that we connected this with the Rodent Control parameter from the first example, for ultimate personalization.

Example: https://pestcontrolallentownpa.com/ppc-example/?service=Rodent%20Control&graphic=rats

And here’s the same page but with the parameter switched to graphic = termites

Examples: https://pestcontrolallentownpa.com/ppc-example/?service=Termite%20Control&graphic=termites

And finally, as you can see if no parameter is present in the URL then the fallback image is used.

This concludes the step by step instructions for how to use the Dynamic Content Replacement plugin. If you run into any issues or need any help then please contact us.

Have more questions or need help? Contact Us