HTML Chunks

Standard shortcode

Just the standard HTML Chunk with the required reference.

This is some random bit of HTML that I want to place around my website.

[html_chunks your-reference]
This is some random bit of HTML that I want to place around my website.
[html_chunks your-reference escape=true]
This is some <em>random</em> bit of <strong>HTML</strong> that I want to place around my website.

We have an overall rating of [reviews_rating rating]★ in Google.

[html_chunks shortcode_inside]
We have an overall rating of 4.4★ in Google.
[html_chunks shortcode_inside shortcodes=false escape=true]
We have an overall rating of [reviews_rating rating]★ in <a href="[reviews_rating reviews_link]" rel="nofollow" target="_blank">Google</a>.

Vary based on current page

This is the perfect shortcode for multiple landing pages – each with the same layout but slightly different content for each audience.

[html_chunks landing]

“Part-Time Landing Page”

Working Part-Time? We have the perfect home office solutions at a low price, perfect for workers split between the office and home.

Page: Landing ➙ Part-Time

Working Part-Time? We have the perfect home office solutions at a low price, perfect for workers split between the office and home.

“Freelancer Landing Page”

Welcome to our fantastic new home office solutions, perfect for freelancers, entrepreneurs and all those starting their path to success.

Page: Landing ➙ Freelancers

Welcome to our fantastic new home office solutions, perfect for freelancers, entrepreneurs and all those starting their path to success.

Normally, each variant is called based on the current page. In this example the parameter: post_id=123 is used to override this functionality.

Likelihood

You can place one of several HTML Chunks based on likehoods from 0% (never) to 100% (certain).

[html_chunks percentages]

Percentage Pie Chart

This is an example of a random HTML Chunk – occuring 50% percent of the time.

There are three HTML Chunks set to likelihoods of 33.3%, 16.7% and 50%, each one is set to no specific page.

<div id="percentages" class="percentage-33">
<p class="image"><img src="/wp-content/uploads/Percentage-Pie-Chart.svg" alt="Percentage Pie Chart"></p>
<p class="description">This is an example of a random HTML Chunk – occuring 33% percent of the time.</p></div>

Likelihood: 33.3%

<div id="percentages" class="percentage-17">
<p class="image"><img src="/wp-content/uploads/Percentage-Pie-Chart.svg" alt="Percentage Pie Chart"></p>
<p class="description">This is an example of a random HTML Chunk – occuring 17% percent of the time.</p></div>

Likelihood: 16.7%

<div id="percentages" class="percentage-50">
<p class="image"><img src="/wp-content/uploads/Percentage-Pie-Chart.svg" alt="Percentage Pie Chart"></p>
<p class="description">This is an example of a random HTML Chunk – occuring 50% percent of the time.</p></div>

Likelihood: 50%

Random, but fixed for a duration of time

Similar to the previous example, here are three more HTML Chunks set to likelihoods of 33.3%, 16.7% and 50%, each one is set to no specific page. This version is fixed (or cached) for up to a minute before it will make a new selection at random. Various other time intervals are available.

[html_chunks percentages_fixed]

Percentage Pie Chart

This is an example of a random HTML Chunk – occuring 33% percent of the time, fixed to the same HTML Chunk for 1 minute.

Replacement text

You can place a replacement text reference within your HTML Chunk that is set in an individual shortcode. In some instances you may wish to specify a fall-back word to use in case no parameter exists.

A simple replacement word

Each day when I come to work I usually travel by %vehicle%.

[html_chunks transport vehicle="bus"]
Each day when I come to work I usually travel by bus.

A replacement word with no fall-back

Each day when I come to work I usually travel by %vehicle%.

[html_chunks transport]
Each day when I come to work I usually travel by.

An inoperative fall-back

Each day when I come to work I usually travel by %vehicle/car%.

[html_chunks transport vehicle="train"]

Each day when I come to work I usually travel by train.

An operative fall-back

Each day when I come to work I usually travel by %vehicle/horse-drawn carriage%.

[html_chunks transport]

Each day when I come to work I usually travel by horse-drawn carriage.

Multiple replacements

At the weekend when I %action%, I prefer to %method/travel by car%.

[html_chunks weekend action="have brunch at a café" method="go there by bus"]

At the weekend when I have brunch at a café, I prefer to go there by bus.

[html_chunks weekend replacements="action=go to the shops&method=walk"]

At the weekend when I go to the shops, I prefer to travel by car.

[html_chunks weekend replacements='{"action":"go to the park","method":"ride my bicycle"}']

At the weekend when I go to the park, I prefer to ride my bicycle.

You do not need to escape HTML characters – just use " rather than &quot; – within the parameter’s string.