A code to make the text in a sidebar alternate?

[Beedle]

Hey there! I'm not sure it's possible, but I was wondering if there is any code that could make the text in one of our sidetables change every time you refreshed or reloaded the page? 

We have this rumourmill going and we get several new rumours each week, but instead of having a wall of text with all of them, we would love to be able to put maybe 10 of them in the code for the forumwrapper and then have all ten of them alternating every time we reload? 

The current code for the sidetable in question is this:


<!-- SIDE TABLE #3 START -->

<div class="sidetable container">

<div class="title-bar"><h2><img src="IMGLINK" alt=" "></h2></div>

   <div class="forest-bar"></div>

<div class="content cap-bottom pad-all-double">

   

   <div style="text-align:justify;"><i>Teasertext... </i> <a href="LINK">Læs videre!</a>

</div><br>

   

   <div style="text-align:center;"><a href="LINK"><i>How to write better rumours</i></a>

</div>

   

   

   </div>

</div>

<!-- SIDE TABLE #3 END -->

[Scott]

Beedle , I may have a simple solution for you so long as there's not a lot of text or styling.


Where you want the text to appear place this code:
<div id="changeme"></div>

The script code should come after the above div code. I recommend putting at the bottom of the layout template. If it's going in the forum wrapper template then place it right above this:
</body>
</html>

Here's the script that changes the text on refresh. Note this randomizes the text that shows on refresh rather than run through a specific order.
<script>

   var myArray = [

 'First text',

 'Second text',

 'Third text'

];

var randomItem = myArray[Math.floor(Math.random()*myArray.length)];

document.getElementById('changeme').innerHTML = randomItem;

</script>
Replace the First text, Second text, and Third text with your own. You have an array of text and each line is it's own entry and must follow the syntax of being surrounded by the single quote marks and have a comma at the end of each entry except the last entry which has no comma.  You cannot have any single quote marks within the text or that will break the script. 

You can add additional entries by adding a new line following the same syntax.
'Fourth text',
'Last text'
If you do add more lines make sure all entries end with a comma except the last. 

I used single quotes to make it easy to add links and inline css if desired, such as:
'<span style="font-weight:bold;">Come visit my museum</span><a href="/page/sam"> Visit</a>',

'<span style="color:red;">First text</span>',


[Beedle]

I struggled a bit with the code, but it's up and running now and I love it. Thank you Scott!