Quotiki - Tools - My Quotiki Random Quote

This tool let's you display a random quote from your Quotiki favorite quotes listing on your own web site. Each time your page loads, it will automatically display a different quote from your favorites (or you can change the code and display another members' quotes). Follow the instructions to add the appropriate code to your site.

Which Member

If you're logged in, you'll see your user name in the box above. If you are not logged in, you'll see our 3terra account. Feel free to enter any member's user name and the code below will rewrite to display a quote from their favorites.

The Code

Just cut and paste one of the text blocks below into your HTML where you want the quotes to be displayed on your site.

Style 1 - White Box, Black Border

<link href="http://www.quotiki.com/css/api1.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://www.quotiki.com/api/RandomUserQuote.ashx?user=3TERRA"></script>

Style 2 - Author Left Aligned

<link href="http://www.quotiki.com/css/api2.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://www.quotiki.com/api/RandomUserQuote.ashx?user=3TERRA"></script>

Style 3 - Author Right Aligned

<link href="http://www.quotiki.com/css/api3.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://www.quotiki.com/api/RandomUserQuote.ashx?user=3TERRA"></script>

What It Does

Take a look at the boxes on the right side of this page. Each random quote uses the exact code contained in each of the text boxes above. Just select the style you like the best. The quote should stretch to fit wherever you place it on your page.

Advanced Formatting

If you want to customize the appearance of the random quote, from your favorite quotes listing, for your web page, you can use CSS with the class names to customize the display. Simply customize the CSS styles contained within the text box below.

<!-- style, can be customized -->
<style type="text/css">
/* overall container */
.quotiki {
    padding: 5px;
    background-color: white;
    border-color: black;
    border-style: solid;
    border-width: 1px;
}
/* quote text */
.quotiki_quote { 
    font-size: 105%;
    font-weight: bold;
    font-family: ; 
    color: black;
    text-align: left;
    text-decoration: none;
}
/* quote text on mouse rollover */
A.quotiki_quote:hover {
    COLOR: red; 
    TEXT-DECORATION: underline;
}    
/* author text */
.quotiki_author { 
    font-size:  95%;
    font-weight: bold;
    font-family: ;
    color: black;
    text-align: right;
    text-decoration: none;
}
/* author text on mouse rollover */
A.quotiki_author:hover {
    COLOR: red; 
    TEXT-DECORATION: underline;
}
</style>   
             
<!-- script, do not change -->             
<script type="text/javascript" src="http://www.quotiki.com/api/RandomUserQuote.ashx"></script>

How the code text above will display if code is left unchanged:

padding: set padding in pixels
background-color: set background of quote box to blank or a color such as white
border-color: set font-size to any percentage you like
border-style: set style to none or solid
border-width: set width of border in pixels
font-size: set font-size to any percentage you like
font-weight: set font-weight to normal or bold
font-family: only set font-family if you want to override your web site's existing fonts
color: set color that text should appear in
text-align: set text to appear left aligned or right aligned
text-decoration: set text decoration to none or underline

Quotiki Tools - My Quotiki Random Quote