Helpers

Helpers

Life is not just about widgets. Helpers to the rescue :)

Helpers

Life is not just about widgets. Helpers to the rescue :)

Alert Renders foundation alerts

Alerts are a handy element you can drop into a form or inline on a page to communicate success, warnings, failure or just information. They'll conform to 100% of the container width you put them in.

Example

Heads Up! Helpers do render the HTML markup but not handle the javascript registration and functionality like the widgets do. If you wish to do it, you will have to make sure you register the core javascript file + the corresponding assets files for the plugins. In the case of the Alert would be foundation.css or foundation.min.css plus foundation.js and foundation.alerts.js (or foundation.min.js). This is true for the rest of the plugins if you use helpers.

This is a standard alert×

This is a standard alert with radius×

This is a success alert round×

This is an important alert ×

This is a secondary alert×

<p>
    <?php echo Alert::alert("This is a standard alert");?>
</p>
<p>
    <?php echo Alert::alert(
        "This is a standard alert with radius", array(
        'class' => Enum::RADIUS_RADIUS));?>
</p>
<p>
    <?php echo Alert::success("This is a success alert round", array(
        'class' => Enum::RADIUS_ROUND));?>
</p>
<p>
    <?php echo Alert::important("This is an important alert ");?>
</p>
<p>
    <?php echo Alert::secondary("This is a secondary alert");?>
</p>

ArrayHelper Array utility methods

This class is an utility helper. It contains a set of methods that help us deal with arrays 'the easy way'

In order to get full information about its methods and what they do, please check the API documentation.

Example

$htmlOptions = array('class' => 'data', 'no-data' => 'no-data');
ArrayHelper::addValue('class', 'extra class', $htmlOptions);
print_r($htmlOptions);
// Array ( [class] => data extra class [no-data] => no-data )

$otherOptions = array();
ArrayHelper::move(array('no-data'), $htmlOptions, $otherOptions);
print_r($otherOptions);
// Array ( [no-data] => no-data )
    

Button Renders foundation buttons

Buttons are a convenient tool when it comes to more traditional actions. To that end, Foundation has a lot of easy to use button styles that you can customize or override to fit your needs.

Example

.large.expand

<div class="small-6 large-6 columns">
    <p>
        <?php echo Button::link('.tiny.button', array('class' => Enum::SIZE_TINY ));?>

        <?php echo Button::link('.small.button', array('class' => Enum::SIZE_SMALL ));?>

        <?php echo Button::link('.medium.button', array('class' => Enum::SIZE_MEDIUM ));?>
    </p>
</div>
<div class="small-6 large-6 columns">
    <p>
        <?php echo Button::link('.tiny.secondary', array(
                'class' => Enum::COLOR_SECONDARY . ' ' . Enum::SIZE_TINY));?>

        <?php echo Button::link('.tiny.success.radius', array(
                'class' => Enum::COLOR_SUCCESS . ' ' . Enum::SIZE_TINY . ' ' . Enum::RADIUS_RADIUS));
        ?>

        <?php echo Button::link('.round.disabled', array(
                'class' => Enum::STATE_DISABLED . ' ' . Enum::COLOR_ALERT . ' ' . Enum::RADIUS_ROUND));
        ?></p>
</div>
<p>
    <?php echo Button::link('.large.expand', array('class' => Enum::SIZE_EXPAND . ' ' . Enum::SIZE_LARGE));?>
</p>
    

Other Styles Splits, Dropdown, and with Icons

Split Button
Dropdown Button

<?php echo Button::split(
    'Split Button',
    array(
        CHtml::link('This is a link'),
        CHtml::link('This is another link'),
        CHtml::link('Yet another')
    ),
    array('style' => 'float:left; margin-right:5px')
);?>

<?php echo Button::dropdown(
    'Dropdown Button',
    array(
        CHtml::link('This is a link'),
        CHtml::link('This is another link'),
        CHtml::link('Yet another')
    ),
    array(
        'class' => Enum::COLOR_ALERT,
        'style' => 'margin-right:5px'
    )
);?>

<?php echo Button::button(
    Icon::icon(Enum::ICON_ADDRESS_BOOK) . ' Buttons with Icon'
); ?>
    

Foundation Handles core scripts registrations

Foundation Helper is the one you require to register core and/or independent assets scripts plus plugin events and initializations. We decided to develop a helper to handle that instead of an Application Component as on other tools (YiiStrap, YiiWheels) to have full control on what is happening and what we register on our view files.

It is highly recommended that you read through the API Documentation to understand clearly what this helper does for us.

Heads up! An important thing to take into account is that when you use widgets, they are automatically registering the required assets for them to work properly.


Html Modified methods and attributes of CHtml and more

This helper just holds those methods that CHtml does not handle the way the library requires. Like for example, the addCssClass and thumb methods.

It also includes clientChange so your buttons onclick events are handled as they should ;)

Please review its API documentation for further information of its methods.


Icon Classes and methods for icons

It easiest the task of rendering icons and remembering all of its classes. It also registers the requried fonts fonts.

Example general icon set

Icon::registerIconFontSet(Enum::ICONS_SET_GENERAL);

echo Icon::icon(Enum::ICON_HEART);
    

Nav Handles navigation HTML renders

Description

Example

Sub Nav

This simple sub nav is great for moving between different states of a page. We use these frequently to show iterations of something, typically by date, but they're also handy for filters like these.


Side Bar

Side nav, like you'll see on Foundation's main site, is useful for sections of either a site or a page.


// sub bar
echo Nav::sub(
    array(
        array('label' => 'Item', 'url' => '#', 'itemOptions' => array('class' => 'active')),
        array('label' => 'Another Item', 'url' => '/features'),
        array('label' => 'Another Item', 'url' => '/features'),
    )
);

// side bar
echo Nav::side(
    array(
        array('label' => 'Item', 'url' => '#', 'itemOptions' => array('class' => 'active')),
        array('label' => 'Another Item', 'url' => '/features'),
        '----',
        array('label' => 'Another Item', 'url' => '/features'),
    )
);
    

Panel Renders panels

A panel is a simple, helpful Foundation component that enables you to outline sections of your page easily. This allows you to view your page sections as you add content to them or add emphasis to a section. The width is controlled by the grid columns you put them inside.

Example

This is a regular panel.

It has an easy to override visual style, and is appropriately subdued.

This is a callout panel.

It's a little ostentatious, but useful for important content.

<div class="large-6 columns">
    <?php echo Panel::panel('<h5>This is a regular panel.</h5>
        <p>It has an easy to override visual style, and is appropriately subdued.</p>');?>
</div>
<div class="large-6 columns">
    <?php echo Panel::callout('<h5>This is a callout panel.</h5>
        <p>It's a little ostentatious, but useful for important content.</p>',
        array('class' => Enum::RADIUS_RADIUS));?>
</div>
    

Pricing Renders pricing tables

If you're making a rockin' marketing site for a subscription-based product, you are likely in need of a pricing table. These fill 100% of their container and are made from a simple unordered list.

Example

  • Standard
  • $99.99
  • An awesome description
  • 1 Database
  • 5GB Storage
  • 20 Users
  • Lots of Love
  • Buy Now
echo Pricing::table('Standard', '$99.99', 'An awesome description', array(
    '1 Database',
    '5GB Storage',
    '20 Users',
    Icon::icon(Enum::ICON_HEART) . ' Lots of Love',
    Button::link('Buy Now')
));
    

Progress Renders foundation progress bars

A simple way to add progress bars to your layouts. You only need two HTML elements to make them and they're easy to customize.

Example

<p>
    <?php echo Progress::bar('40%'); ?>
</p>
<p>
    <?php echo Progress::success(50, array('class' => Enum::RADIUS_ROUND)); ?>
</p>
<p>
    <?php echo Progress::important(60, array('class' => Enum::RADIUS_RADIUS)); ?>
</p>
<p>
    <?php echo Progress::secondary(70, array('class' => Enum::RADIUS_RADIUS)); ?>
</p>
<p>
    <?php echo Progress::important(60, array('class' => 'large-6')); ?>
</p>
    

Typo Access special Foundation tags

Foundation 4 Typography is full of nice CSS tags. Typo helper contains some of what we thought would be easier to have within a helper.

Example

Subheader

h1.subheader

h2.subheader

h3.subheader

h4.subheader

h5.subheader
h6.subheader
<?php echo   Typo::subHeader('This is a subheader h3 <small>I said it</small>', 'h3');?>
    

Blockquote
I do not fear computers. I fear the lack of them. Maecenas faucibus mollis interdum. Aenean lacinia bibendum nulla sed consectetur.Isaac Asimov

<?php echo Typo::blockquote('hello I said it');?>
    

vCard
<?php
echo Typo::vCard(
    'Gaius Baltar',
    '13 Colonial Ave.',
    'Caprica City',
    'Caprica',
    '12345',
    CHtml::link('g.baltar@gmail.com'));
?>
    

Inline List
<?php echo Typo::inlineList(array(
        CHtml::link('Link 1'),
        CHtml::link('Link 2')
    ));
?>
    

Labels

Regular Label Radius Secondary Label Round Alert Label Success Label

echo Typo::label('Regular label');
echo Typo::label('Radius Secondary label', array('class' => Enum::RADIUS_RADIUS . ' ' . Enum::COLOR_SECONDARY));
    

Keystrokes

For example, to close your browser hit Cmd + Q

For example, to close your browser hit <?php echo Typo::kbd('Cmd') . ' + ' . Typo::kbd('Q');?>
    

Proudly Developed and Hosted by