Your Guide to Recreating Elements of the Ricochet Demo for Joomla
This area of the front page is a Custom HTML module. You will find the settings used in our demo below.
Any mod_custom (Custom HTML) modules are best handled using either RokPad or no editor as a WYSIWYG editor can cause issues with any code that exists in the Custom Output field.
Option | Setting |
---|---|
Title | FP Footer B |
Show Title | Hide |
Position | footer-b |
Status | Published |
Access | Public |
Enter the following in the Custom Output text editor.
<div class="gantry-width-container">
<div class="gantry-width-25">
<div class="rt-square-1">
<div class="gantry-width-spacer">
<h5>About</h5>
<ul class="rt-noliststyle">
<li><a href="http://www.rockettheme.com/blog">Blog</a></li>
<li><a href="http://www.rockettheme.com/the-team">The Team</a></li>
<li><a href="http://www.rockettheme.com/promotions">Promotions</a></li>
<li><a href="http://www.shareasale.com/shareasale.cfm?merchantID=30300">Affiliate</a></li>
</ul>
<h5 class="lmedmargintop largepaddingtop">Help</h5>
<ul class="rt-noliststyle">
<li><a href="http://www.rockettheme.com/contact-us">Email</a></li>
<li><a href="http://www.rockettheme.com/purchase-premier-support">Premier Support</a></li>
</ul>
</div>
</div>
</div>
<div class="gantry-width-25">
<div class="rt-square-1">
<div class="gantry-width-spacer">
<h5>Features</h5>
<ul class="rt-noliststyle">
<li><a href="/?amp;view=article&id=1&Itemid=111">Overview</a></li>
<li><a href="/?amp;view=article&id=2&Itemid=112">Module Positions</a></li>
<li><a href="/?amp;view=article&id=3&Itemid=113">Module Variations</a></li>
<li><a href="/?amp;view=article&id=4&Itemid=114">Typography</a></li>
<li><a href="/?amp;view=article&id=5&Itemid=115">Menu Options</a></li>
</ul>
</div>
</div>
</div>
<div class="gantry-width-25">
<div class="rt-square-1">
<div class="gantry-width-spacer">
<h5>Pages</h5>
<ul class="rt-noliststyle">
<li><a href="/?amp;view=article&id=6&Itemid=118">Overview</a></li>
<li><a href="/?amp;view=article&id=7&Itemid=119">About Us</a></li>
<li><a href="/?amp;view=article&id=9&Itemid=121">Services</a></li>
<li><a href="/?amp;view=article&id=11&Itemid=123">Portfolio</a></li>
<li><a href="/component/contact/?amp;view=contact&id=1&Itemid=126&Itemid=101">Contact Us</a></li>
</ul>
</div>
</div>
</div>
<div class="gantry-width-25">
<div class="rt-square-1">
<div class="gantry-width-spacer">
<h5>Social</h5>
<ul class="rt-noliststyle">
<li><a href="https://www.facebook.com/RocketTheme">Facebook</a></li>
<li><a href="https://twitter.com/rockettheme">Twitter</a></li>
<li><a href="https://plus.google.com/+rockettheme/posts">Google+</a></li>
<li><a href="http://www.rockettheme.com/product-updates?rss">RSS</a></li>
</ul>
<h5 class="lmedmargintop largepaddingtop">Extensions</h5>
<ul class="rt-noliststyle">
<li><a href="http://www.rockettheme.com/joomla/extensions/roksprocket">RokSprocket</a></li>
<li><a href="http://www.rockettheme.com/joomla/extensions/rokbooster">RokBooster</a></li>
</ul>
</div>
</div>
</div>
</div>
Option | Setting |
---|---|
Prepare Content | No |
Select a Background Image | Blank |
Option | Setting |
---|---|
Module Class Suffix | fp-footer-b hidden-phone |