0
Welcome Guest! Login
0 items Join Now

Osmosis: Recreating the Demo - Expanded Top

Your Guide to Recreating Elements of the Osmosis Theme for WordPress


Expanded Top Section

Here is the widget breakdown for the Expanded Top section:

Text

This section of the page is a standard text widget. You will need to enter the following in the main text field.

<div class="gantry-row">
    <div class="gantry-width-33">
        <div class="gantry-width-spacer">
            <div class="rt-icon-badge rt-text-accent2"><span class="fa fa-desktop"></span></div>
            <h5 class="medpaddingtop rt-text-accent2">Responsive Layout</h5>
            <p>A responsive layout automatically adapts to the viewing device, allowing for an optimized appearance on multiple devices, such as tablets.</p>
            <a href="http://(Your Site URL)/features-overview/" class="readon4">Read More</a>
        </div>
    </div>
    <div class="gantry-width-33">
        <div class="gantry-width-spacer">
            <div class="rt-icon-badge rt-text-accent3"><span class="fa fa-th"></span></div>
            <h5 class="medpaddingtop rt-text-accent3">Editable Structure</h5>
            <p>The theme settings page offers configuration options to individually control each widget position row, per page, allowing for custom widths.</p>
            <a href="http://(Your Site URL)/features-overview/" class="readon3">Read More</a>
        </div>
    </div>
    <div class="gantry-width-33">
        <div class="gantry-width-spacer">
            <div class="rt-icon-badge rt-text-accent2"><span class="fa fa-mobile-phone"></span></div>
            <h5 class="medpaddingtop rt-text-accent2">Mobile Support</h5>
            <p>Osmosis has responsive styling for smartphones, but also benefits from a mobile specific menu to better match the touch based user interface.</p>
            <a href="http://(Your Site URL)/features-overview/" class="readon4">Read More</a>
        </div>
    </div>  
</div>

<div class="clear"></div>

Here is a breakdown of options changes you will want to make to match the demo.

  • Switch the Widget Variations to RT-Center.
  • Enter fp-expandedtop in the Custom Variations field.
  • Leaving everything else at its default setting, select Save.

Found errors? Think you can improve this documentation? Please edit this page. You can also view the history of this page.