Get Started
How to configure YiiFoundation for your project!
Download
Download the package and unzip its contents in your extensions folder. We highly recommend the use of Composer to manage your dependencies. For those having problems, we are planning to do exactly the same thing we did for YiiWheels at Yiinitializr site.
Download Latest Version
Fastest way to get started: get the extension and unzip its contents in your extensions folder and configure it.
DownloadClone
You can also clone the git repository by heading to the GitHub project page and following the instructions there.
YiiFoundation on GitHubConfiguration
Within the download you'll find the following file structure and contents, logically grouping assets, helpers and widgets in respective directories.
Unzip the contents of the package under protected/extensions/yiifoundation
. The folder
structure should now be the following (if you are using Composer that would be within the
vendor
folder:
protected └── extensions └── yiifoundation ├── assets │ ├── css │ ├── images │ └── js │ ├── enum ├── fonts ├── helpers ├── tests └── widgets
Now that we have placed the extension, please open your application configuration file in
protected/config/main.php
and modify it according to the following example:
<?php // main configuration return array( ... // path aliases 'aliases' => array( ... // yiifoundation configuration 'foundation' => 'application.extensions.yiifoundation', ), );
And that's it! Yeah, there are no components on this library. It is helper based. If you use one of the widgets, it will automatically register the required scripts by calling the Foundation::register method of the Foundation helper.
heads up! If you are using just helpers, you will have to register the files your self!. Check Foundation helper docs for more information.
What's included
YiiFoundation will also have its own version of YiiWheels. At least thats the plan. Nevertheless, we've covered all the great functionality of ZURB Foundation Framework
Helpers
Alert | Alert renders a Foundation alert |
ArrayHelper | ArrayHelper has array utility methods |
Button | Button helper renders different foundation buttons |
Foundation | Foundation helper contains functions to work with the core assets. |
Html | Html holds those modified methods from CHtml required for Foundation helpers and/or widgets. |
Icon | Icon helper contains methods to work with Foundation icons -ie assets registrations (fonts), icon rendering. |
Nav | Nav Helper renders different type of navigation markups. |
Panel | Panel renders foundation panels |
Pricing | Pricing renders foundation pricing tables |
Progress | Progress helpers deals with the different progress bars of Foundation. |
Typo | Typo facilitates the rendering of HTML components as specified on Typography section at Foundation's site. Most common are not included as we believe they can be easily done with [[\CHtml]] yii helper class. |
Enum
Enum | Enum holds most of the Foundation classes |
Exception
InvalidConfigException | InvalidConfigException represents an exception caused by incorrect object configuration. |
Base Classes
Input | Input is the base class for widgets that collect user inputs. |
Widget | Class Widget |
Widgets
Alert | Alert renders a Foundation style alert from messages stored on user session variables -named Flash messages. |
Breadcrumbs | Breadcrumbs renders a Foundation breadcrumb |
Clearing | Clearing creates responsive lightboxes with any size image |
Dropdown | Dropdown renders a foundation dropdown. It differs from MenuDropdown helper. |
FlexVideo | FlexVideo embeds a video from YouTube, Vimeo or another site that uses iframe, embed or object elements, creating an intrinsic ration that will properly scale the video to any device. |
Interchange | InterChange utilizes the data-interchange attribute for specifying your media queries and their respective images. |
JoyRide | JoyRide renders a foundation tour plugin. |
Magellan | Magellan renders the Magellan Foundation 4 plugin. Magellan is a style agnostic plugin that lets you style a sticky navigation that denotes where you are on the page. |
Orbit | Orbit generates a foundation orbits. |
Pager | Pager renders a Foundation pagination component. |
Reveal | Reveal renders the markup for the modal dialog plugin of Foundation |
Section | Section renders Foundation sections, which are similar to tabs as a way to selectively show a single panel of content at a time. Sections replace Accordion, Tabs, Vertical Nav & Horizontal Nav. |
SwitchButton | SwitchButton renders a foundation switch. |
Tooltip | Tooltip renders Foundation tooltips |
TopBar | TopBar widget renders a nav HTML component. |