How to add a paragraph of text to your site that changes on every page reload?


This tutorial will show you how to add text to your site that is different every time a page is loaded.


We will use a set of 5 quotes as an example of this technique. At the bottom of the page you will see one of these 5 quotes. If you reload this page, a different quote will appear. Instead of quotes, you can of course use any other type of text.


Implementing this on your own site is very simple if you follow these few steps:


1. Put an HTML Snippet element on your page where you want the text that changes with every reload to appear.


2. Copy the following text into the HTML Snippet:


<div id="my_quotes" class="heading2" align="right"> </div>
<script>
var my_quotes = new Array();
my_quotes[0] = "<i>A cynic knows the price of everything and the value of nothing</i><br><b>Oscar Wilde</b>";
my_quotes[1] = "<i>We are what we repeatedly do. Excellence, then, is not an act, but a habit.</i><br><b>Aristotle</b>";
my_quotes[2] = "<i>Price is what you pay. Value is what you get</i><br><b>Warren Buffett</b>";
my_quotes[3] = "<i>Victory has a thousand fathers, but defeat is an orphan.</i><br><b>John F. Kennedy</b>";
my_quotes[4] = "<i>If you canít explain it simply, you donít understand it well enough</i><br><b>Albert Einstein</b>";
var random = Math.ceil (Math.random() * my_quotes.length) - 1;
$('my_quotes').set('html', my_quotes[random]);
</script>


3. Replace the text in orange with your own text.


For more advanced customization, you can edit or remove the HTML tags in the snippet.


Demo - refresh the page to see a different quote: