RandomQuote Stack

Display a quote at random, from a list you edit in the Stack or from a file.
Overview
RandomQuote Stack icon
Want to display a random quote? Or how about cycle through a selection of quotes in a file? This Stack lets you type quotes in by hand or read them from a CSV spreadsheet file, and provides many styling options for making them look great on your web site.

How does it work?
PHP is used to read your quotes and generate a random list to display, and javascript is used to cycle through the quotes and fade them in and out.
  • RandomQuote Stack screen shot
  • RandomQuote Stack screen shot
  • RandomQuote Stack screen shot
Customize
RandomQuote Stack parameters
The RandomQuote Stack let’s you customize a multitude of styling options that control the appearance of the quote characters, the quote text, and the author text. There are even options for cycling through quotes, fading them in and out.

Quotes can by typed in the edit area (there is a field for the quote and the author) or you can specify a CSV file to read instead (download a sample CSV here) which makes it simple to add new quotes across your entire site just by updating one spreadsheet on your Mac!

Parameters

 
Content typeSelect the source of your quotes: Text requires simply editing the quote body and author text fields provided; CSV File (requires php) reads lines from a csv file specified below. Note that quotes from a CSV file (which requires PHP) will not appear during Preview, but will work correctly after Publishing.
CSV FileProvide a relative file path or a complete url (containing http: or https:) to a csv format file from which to read non-blank, non-comment (comments start with #) lines. Each line contains the body of a quote in the first column, and the author of the quote in the second column. The file is automatically located one or two directories above if not found exactly where specified first. If a url is specified it must be complete and the file must exist.
QuantitySelect the number of quotes you will enter, and from which a random quote will be chosen.
AppearanceSelect the style of quote layout to use. This setting affects the location of quote symbols, and the content and author placement, as well as other subtle features of the overall quote stack. Try each style to find the one that is best.
Body fontSelect the font of the main quote body text, or use Other to specify one below.
Other fontSelect another font to use for the body text.
Font scalingEnter a value in em, where 1 is default font size.
Body colorSelect the color of the main quote body text.
ItalicsItalicize quote body text. You can still style the quote text as you enter it.
Author fontSelect the font of the quote author text, or use Other to specify one below.
Other fontSelect another font to use for the author text.
Font scalingEnter a value in em, where 1 is default font size.
Author colorSelect the color of the quote author text.
ItalicsItalicize author text. You can still style the author text as you enter it.
Dash styleSelect the style of dash to use before the author.
CharactersSelect the style of quote symbols to use.
ColorColor of the quote symbols.
OpacityOpacity of the quote symbols: 0=invisible to 100=opaque.
Left onlyEnable this to show only the left-most quote symbol, otherwise both the right and left symbols will be shown.
Cycle quotesEnable this to cycle randomly through quotes after the delay set below. When this is disabled, a random quote is selected only once when the page first loads and remains the same after. This is only works when there is more than one quote to select from.
Cycle delaySet this to the number of seconds delay between selection of random quotes. Recommend to set this number high enough to allow each quote to be read.
Fade quotesEnable this to fade quotes in and out when cycling is enabled.
Examples
Check out examples of RandomQuote - wait a few seconds for the changes to occur …
Example 1: one random quote every five seconds, from quotes in a CSV file …
To create and use a CSV file - Click here to show more …
Export from Excel or Numbers, or create it by hand in a text editor. Each line of your CSV file should look like this:
“The body of your quote”
“The body of your quote.”,”Author”
“The body of your quote.”,”Author/Line 1<br />Title/Line 2”
(strings surrounded by plain double-quotes, and separated by commas)
Note that any line beginning with # is considered a comment, and ignored. Blank lines are also ignored.

Place the CSV spreadsheet where you can use it:
Drag the CSV file into your RapidWeaver Resources or Publish the flle online somewhere (you will need the complete URL in this case).

Add a RandomQuote Stack and use the CSV file:
In RapidWeaver, add a RandomQuote Stack to your page and set the Content Type option to CSV File. Then specify the path to your file as resources/quotes.csv (RandomQuote is smart enough to look around for your resources directory so don’t worry about ../resources, or ../../resources etc.) If your CSV file is online somewhere else you can specify the file name as a URL instead, such as http://somewhere.com/quotes.csv

Download a sample CSV here.

The example below uses the following file from the project’s resources directory …
# Sample Quotes for RandomQuote at Bryn Owen Design
"I hear and I forget. I see and I remember. I do and I understand.","Chinese Proverb"
"Nothing great was ever achieved without enthusiasm.","Ralph Waldo Emerson"
"Do what you love, love what you do, and deliver more than you promise.","Harvey McKay"
"It does not matter how slowly you go, so long as you do not stop.","Confucius"
"Whatever is worth doing at all is worth doing well.","Phillip Dormer Stanhope"
I hear and I forget. I see and I remember. I do and I understand. Chinese Proverb
Nothing great was ever achieved without enthusiasm. Ralph Waldo Emerson
Do what you love, love what you do, and deliver more than you promise. Harvey McKay
It does not matter how slowly you go, so long as you do not stop. Confucius
Whatever is worth doing at all is worth doing well. Phillip Dormer Stanhope
5
Example 2: a selection of different styling options …
Style your quotes with or without quote symbols. Go for a clutter-free look, or something more elaborate with a few option changes. Bryn Owen
Select a font that suits your style, for the quote itself and the author, if any. Leave the author blank if you prefer, or add a name and a title on one or more lines.
¡
~
!
Choose from a variety of quote symbols and even select from different dash symbols before the author. Bryn Owen, Bryn Owen Design
Color your quotes, author, and symbols independently. Style your quote symbols with opacity as well. Bryn Owen
Bryn Owen Design
Use any of the common formatting options for Background and Layout to add color and texture to the quote area. Bryn Owen
Bryn Owen Design

RandomQuote Features

  • Responsive
  • Requires PHP
  • Requires JS (cycle and fade)
  • Sparkle updates

Purchase RandomQuote

  • $5 USD via PayPal
  • Immediate download *