Plugin Features
- Supports - Foundation 6 (including Flex Grid and RTL), 5, 4 and 3;
- Includes - 19 Shortcodes (including OwlCarousel shortcode as an alternative to the built-in Orbit Carousel) and Foundation Icon Fonts 3. Both of them have TinyMCE editor buttons.
- Provides an option to specify a time period, to have Foundation loaded on specific posts or pages.
- Provides an option to load custom css file from the active theme folder.
Plugin Shortcodes
The shortcodes for the different versions have the same tags but different features. This means that the main shortcode tags are compatible but different features will be available depending on the version.
FP Foundation Assistant - Shortcodes Documentation
- Grid
- Visibility Classes
- Float Classes
- Tabs
- Accordion
- Orbit Carousel
- OwlCarousel
- Menu
- Nested Menu
- Buttons
- Callout
- Dropdown
- Flex Video
- Interchange
- Label
- Progress
- Reveal
- Tooltip
- WP Query
Foundation Features
General
- Mobile-first - larger devices will inherit the code for small screens and can be customized as needed;
- Float Grid - responsive 12-column grid with options for offsetting, centering, source ordering and more;
- Layout options - visibility and float classes;
- Containers - accordion, tabs, callout/alert, dropdown, reveal;
- Navigation - menu, pagination, breadcrumbs;
- Media - flex video, labels, carousel, progress bar;
Foundation 6
- Float Grid - the block grid has been merged into the main grid;
- Flexbox-powered grid, as an alternative to the float grid - including extra features as automatic sizing and vertical/horizontal alignment;
- JavaScript - Abide, Accordion Menu, Accordion, Drilldown Menu, Dropdown Menu, Dropdown, Equalizer, Interchange, Magellan, Off-Canvas, Orbit, Reveal, Slider, Sticky, Tabs, Toggler, Tooltip;
- Right-to-Left Support
- Foundation 6 Official Documentation
- Foundation 6 Shortcodes
- Foundation 6 Flex Grid Shortcodes
Foundation 5
- JavaScript - Abide, Accordion, Alerts, Clearing Lightbox, Dropdown, Dropdown Buttons, Equalizer, Interchange, Joyride, Magellan, Off-Canvas, Orbit, Range Sliders, Reveal, Split Buttons, Tabs, Tooltip;
- Foundation 5 Documentation
- Foundation 5 Shortcodes
Foundation 4
- JavaScript - Abide, Accordion, Alerts, Clearing Lightbox, Dropdown, Interchange, Joyride, Magellan, Orbit, Reveal, Tabs, Tooltip;
- Foundation 4 Documentation
- Foundation 4 Shortcodes
Foundation 3
Installation
Installing "FP Foundation Assistant" can be done either by searching for "FP Foundation Assistant" via the "Plugins > Add New" screen in your WordPress dashboard, or by using the following steps:
- Download the plugin via WordPress.org
- Upload the ZIP file through the 'Plugins > Add New > Upload' screen in your WordPress dashboard
- Activate the plugin through the 'Plugins' menu in WordPress
Configuration
- Go to "Settings > FP Foundation Assistant" and choose whether you want to load foundation. In case, you are already using a Foundation-based theme, you can disable it and use only the shortcodes. A button for the shortcodes will appear in the Visual section of the Editor once you activate the plugin.
- Choose the Foundation version you want to use or are currently using regardless of whether you choose to load Foundation or not. The shortcodes for the different versions have the same tags but different features.
This means that the main shortcodes tags are compatible but different features will be available depending on the version. For more information, please, read the Documentation.
- Choose whether you want to load the Foundation Icon Fonts 3 and OwlCarousel. The icon font will have a button appear in the Visual section of the Editor. OwlCarousel provides a more flexible option to the built-in Foundation carousel, letting the user choose to have a number of columns. Both features can be disabled.
- To have Foundation loaded on specific posts or pages, you can specify a period. All posts and pages during that period will have Foundation loaded. This is helpful if you are migrating to a different theme but still want to use the Foundation functionality on previous posts or pages.
Custom CSS
If you want to use custom CSS, you can create a file in your active theme: 'yourtheme/fp-foundation-assistant/fp-assistant-custom.css' The plugin will load it automatically.