FoundationPress – Help

Foundation Press

Help file.

Foundation Press offers Foundation framework styles with
WordPress
Shortcodes. The aim is to make adding elements
such as Tabs, Grid, Buttons… to your WordPress blog as simple as possible.

Just upload the plugin and activate it. Foundation Press requires WordPress 3.5, but the latest
version is
always
recommended.

You can use the Foundation HTML Code directly or the provided the Shortcodes. The Shortcodes are
provided
for ease
of use especially if you are in the WordPress editor. For more information
about Shortcodes.

We are working on a Premium version which will provide a handful of features.

Visual Shortcodes Editor
More Advanced Shortcodes (Slider, Google Maps, Syntax Highlighter…)
Customizable Foundation Theme
Priority Support

You can sign-up for our announcement newsletter in our FoundationPress
site to get notified when the Premium version
is launched

If you are interested in the Twitter Bootstrap
framework,
you
can check our other plugin BoostrapPress.

Headlines

All HTML headings, h1 through h6 are available.

Usage

    [fp_h1]h1. Heading 1[/fp_h1]
    [fp_h2]h2. Heading 2[/fp_h2]
    [fp_h3]h3. Heading 3[/fp_h3]
    [fp_h4]h4. Heading 4[/fp_h4]
    [fp_h5]h5. Heading 5[/fp_h5]
    [fp_h6]h6. Heading 6[/fp_h6]

Output

    <h1 class="foundation_press">h1. Header 1<h1>
    <h2 class="foundation_press">h2. Header 2<h2>
    <h3 class="foundation_press">h3. Header 3<h3>
    <h4 class="foundation_press">h4. Header 4<h4>
    <h5 class="foundation_press">h5. Header 5<h5>
    <h6 class="foundation_press">h6. Header 6<h6>

Block quotes

For quoting blocks of content from another source within your document.

Usage

    [fp_blockquote]
        ... Put content here
    [/fp_blockquote]

Output

    <blockquote class="foundation_press">
        ... Put content here
    <blockquote>

Labels

Usage

    [fp_label corner="" color=""]
    Label Text
    [/fp_label]

Attributes

corner null, radius, round
color null, secondary, alert, success

Output

    <span class="foundation_press label">Label Text</span>

Keystrokes

Usage

    [fp_keystroke]Ctrl[/fp_keystroke]

Output

    <kbd class="foundation_press>Ctrl</kbd>

Buttons

Usage

    [fp_button link="" size="" color="" corner="" state=""]
    Button Title
    [/fp_button]

Attributes

link User Input
size null, tiny, small, medium, large
color null, secondary, alert, success
corner null, radius, round
state null, disabled

Output

    <a href="" class="foundation_press button">Button Title</a>

Panel

Usage

    [fp_panel type="" corner=""]
    Panel Content
    [/fp_panel]

Attributes

type null, callout
corner null, radius

Output

    <div class="foundation_press panel">
    Panel Content
    </div>

Table Element

Usage

    [fp_table]
        ... Table content here
    [/fp_table]

Output

    <table class="foundation_press table">
        ... Table content here
    </table>

Table Header

Usage

    [fp_head]
        ... Table header content
    [/fp_head]

Output

    <thead class="foundation_press">
        ... Table header content
    </thead>

Table Body

Usage

    [fp_head]
        ... Table body content
    [/fp_head]

Output

    <tbody class="foundation_press">
        ... Table body content
    </tbody>

Table Row

Usage

    [fp_row]
        ... Row content here
    [/fp_row]

Output

    <tr class="foundation_press">
        ... Row content here
    </tr>

Table Cell

Usage

    [fp_cell]
       ... Cell content here
    [/fp_cell]

Output

    <td class="foundation_press">
        ... Table content here
    </td>

Overall

Usage

    [fp_table]
        [fp_head]
            [fp_row]
                [fp_cell]First Name[/fp_cell]
                [fp_cell]Last Name[/fp_cell]
                [fp_cell]User Name[/fp_cell]
            [fp_row]
        [/fp_head]
        [fp_body]
            [fp_row]
                [fp_cell]Mark[/fp_cell]
                [fp_cell]Otto[/fp_cell]
                [fp_cell]@mdo[/fp_cell]
            [/fp_row]
            [fp_row]
                [fp_cell]Jacob[/fp_cell]
                [fp_cell]Thornton[/fp_cell]
                [fp_cell]@fat[/fp_cell]
            [/fp_row]
            [fp_row]
                [fp_cell]Larry[/fp_cell]
                [fp_cell]The Bird[/fp_cell]
                [fp_cell]@twitter[/fp_cell]
            [/fp_row]
        [/fp_body]
    [/fp_table]

Output

    <table class="foundation_press table    ">
        <thead><br />
        <tr class=""></tr><br />
        <td>First Name</td><br />
        <td>Last Name</td><br />
        <td>User Name</td><br />
        <tr class=""></tr><br />
        </thead><br />
        <tbody><br />
        <tr class=""><br />
            <td>Mark</td><br />
            <td>Otto</td><br />
            <td>@mdo</td><br />
        </tr><br />
        <tr class=""><br />
            <td>Jacob</td><br />
            <td>Thornton</td><br />
            <td>@fat</td><br />
        </tr><br />
        <tr class=""><br />
            <td>Larry</td><br />
            <td>The Bird</td><br />
            <td>@twitter</td><br />
        </tr><br />
        </tbody><br />
    </table>

Usage

[fp_pricing_table title="" price="" description="" cta=""]
    [fp_pricing_item]
    Table Row
    [/fp_pricing_item]
[/fp_pricing_table]

Output

<ul class="pricing-table">
    <li class="title"></li>
    <li class="price"></li>
    <li class="description"></li>
    <li class="bullet-item">
    Table Row
    </li>
    <li class="cta-button"><a class="button" href="#"></a></li>
</ul>

Grid Container

Usage

    [fp_grid]
        ... Grid content here
    [/fp_grid]

Output

    <div class="foundation_press row">
        ... Grid content here
    </div>

Grid Column

Usage

    [fp_column size=""]
        ... Column content here
    [/fp_column]

Attributes

size 1 to 12

Output

    <div class="foundation_press columns large-2">
        ... Column content here
    </div>
    <div class="foundation_press columns large-6">
        ... Column content here
    </div>

Tabs

Add quick, dynamic tab functionality to transition through panes of local content.

Usage

    [fp_tabs]
        [fp_tab title="Home"]
            My Home content
        [/fp_tab]
        [fp_tab title="Profile"]
            My Profile content
        [/fp_tab]
        [fp_tab title="Messages"
            My Messages content
        [/fp_tab]
    [/fp_tabs]

Attributes

title User Input

Output

    <div class="section-container tabs" data-section="">
      <section class="section" style="">
        <p class="title" style="left: 0px;"><a href="#">Home</a></p>
        <div class="content">
          <p>
                My Home content
            </p>
        </div>
      </section>
            <section class="section" style="">
        <p class="title" style="left: 58px;"><a href="#">Profile</a></p>
        <div class="content">
          <p>
                My Profile content
            </p>
        </div>
      </section>
            <section class="section active" style="padding-top: 42px;">
        <p class="title" style="left: 118px;"><a href="#">Messages</a></p>
        <div class="content">
          <p></p>
        </div>
      </section>
    </div>

Accordion

Usage

    [fp_accordion]
        [fp_tab title="Home"]
            My Home content
        [/fp_tab]
        [fp_tab title="Profile"]
            My Profile content
        [/fp_tab]
        [fp_tab title="Messages"
            My Messages content
        [/fp_tab]
    [/fp_fp_accordion]

Attributes

title User Input

Output

    <div class="section-container" data-section="">
      <section class="section" style="">
        <p class="title" style="left: 0px;"><a href="#">Home</a></p>
        <div class="content">
          <p>
                My Home content
            </p>
        </div>
      </section>
            <section class="section" style="">
        <p class="title" style="left: 58px;"><a href="#">Profile</a></p>
        <div class="content">
          <p>
                My Profile content
            </p>
        </div>
      </section>
            <section class="section active" style="padding-top: 42px;">
        <p class="title" style="left: 118px;"><a href="#">Messages</a></p>
        <div class="content">
          <p></p>
        </div>
      </section>
    </div>

Alert

Usage

    [fp_alert color="" corner=""]Alert Text[/fp_alert]

Attributes

color null, success, alert, secondary
corner null, round

Output

    <div data-alert="" class="alert-box  ">
        Alert Text
      <a href="#" class="close">×</a>
    </div>

Tooltip

Usage

    [fp_tooltip placement="" tooltip="Tooltip Text"]Text to explain[/fp_tooltip]

Attributes

placement null, top, bottom, left, right
tooltip User input

Output

    <span data-tooltip class="foundation_press has-tip tip-top" title="Tootlip Text">Text to explain</span>

About Us
The people behind Foundation Press

FoundationPress is developed and maintained by Abid Omar.

FoundationPress is licensed under the GPLv3
License. The
Foundation CSS code is licensed under the MIT Open
Source License. The MIT License is compatible
with the GPLv3.

We are open to custom development requests for WordPress, PHP and Front-End development
(JavaScript). If you are
interested you can contact us: contact@omarabid.com.

M	T	W	T	F	S	S
			1	2	3	4
5	6	7	8	9	10	11
12	13	14	15	16	17	18
19	20	21	22	23	24	25
26	27	28	29	30

Getting Started Getting started with Foundation Press

Introduction

Installation

Usage

Pro Version

Pro Version

ShortCodes Usage of the different shortcodes

Typography

Headlines

Usage

Output

Block quotes

Usage

Output

Labels

Usage

Attributes

Output

Keystrokes

Usage

Output

Buttons

Usage

Attributes

Output

Panel

Usage

Attributes

Output

Tables

Table Element

Usage

Output

Table Header

Usage

Output

Table Body

Usage

Output

Table Row

Usage

Output

Table Cell

Usage

Output

Overall

Usage

Output

Pricing Table

Usage

Output

Grid

Grid Container

Usage

Output

Grid Column

Usage

Attributes

Output

Components

Tabs

Usage

Attributes

Output

Accordion

Usage

Attributes

Output

Alert

Usage

Attributes

Output

Tooltip

Usage

Attributes

Output

About Us The people behind Foundation Press

The Developers

Licensing

Custom Development

Getting Started
Getting started with Foundation Press

ShortCodes
Usage of the different shortcodes

About Us
The people behind Foundation Press