How to create random quote in blogger post

Back>

This example demonstrate stylish Buddha random quote in blogger post.

Here is the example:

Example

<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet"></link>

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"></link>


<br />
<div class="stage">
<h1>
Quotes from the Buddha</h1>
<br />
<div id="quote-box">
<h3 id="quote">Whatever has the nature of arising has the nature of ceasing.
 </h3>
<br />
<h4 id="author">
 </h4>
</div>
<div id="buttons">
<button class="btn" onclick="changeQuote()">New Quote</button>
  </div>
Background image credit: <a href="http://www.readthespirit.com/home/"> readthespirit.com</a>.
  </div>
<style>
.stage {
   font-family: Ubuntu, sans serif;
   background-image: url('http://media.indiatimes.in/media/content/2016/Feb/ss_1455883655.jpg');
  background-repeat: no-repeat;
  background-position: center right;
  background-color: black;
  text-align: center;
}

.stage h1 {
  font-size: 50px;
  margin-top: 1cm;
  font-weight: bold;
  color:  #FDEE0E;
}

#quote-box {
  background-color: #fefbcd;
  margin: 50px 500px 20px 100px;
  padding: 20px;
  border-style: solid;
  border-color: #FDEE0E;
  border-width: 10px;
}

#buttons {
  margin: 0px 500px 50px 100px;
}

.btn {
  background-color: #fefbcd;
}

.stage p {
  margin: 20px;
  color: #FDEE0E;
}

.stage a {
  color: #fefbcd;
}

.stage a:hover {
  color: #CB6501;
}

.stage a:visited {
  color: #CB6501;
}
</style>

<script>
var quotes = [
'If with a pure mind a person speaks or acts, happiness follows them like a never-departing shadow.',
'Whatever is not yours: let go of it. Your letting go of it will be for your long-term happiness and benefit.',
'Whatever has the nature of arising has the nature of ceasing.',
'Meditate … do not delay, lest you later regret it.',
'Should a seeker not find a companion who is better or equal, let them resolutely pursue a solitary course.',
'One is not called noble who harms living beings. By not harming living beings one is called noble.',
'There is no fear for one whose mind is not filled with desires.',
'Ceasing to do evil, Cultivating the good, Purifying the heart: This is the teaching of the Buddhas.',
'Conquer anger with non-anger. Conquer badness with goodness. Conquer meanness with generosity. Conquer dishonesty with truth.',
'Just as the great ocean has one taste, the taste of salt, so also this teaching and discipline has one taste, the taste of liberation.',
'The root of suffering is attachment.',
'Drop by drop is the water pot filled. Likewise, the wise man, gathering it little by little, fills himself with good.'
];


window.onload = setInterval(function(){ changeQuote(); }, 6000);
var n;

function changeQuote(){
  n = Math.floor(Math.random() * (quotes.length - 1));
  document.getElementById("quote").innerHTML = quotes[n];
  document.getElementById("author").innerHTML = '(source: ' + sources[n] + ')'; 
  return n;
}

</script>