0
Welcome Guest! Login
0 items Join Now

RocketTheme Blog

Gantry 5: Powerful New Font, Color, and Icon Pickers

Pickers

Imagine being able to change fonts, colors, and more in seconds without ever touching your keyboard. This is possible with Gantry 5 thanks to its innovative new set of pickers.

Finding the perfect accent color for your page, the right font for the header, and accompanying icons can be tricky. Gantry 5 has been designed from the ground up to be faster and easier to use than any framework out there today, and it shows in these time-saving pickers.

In this article, we’ll touch on some of these features, and how they can make life easier for the Web developer and their clients.

Font Picker

Font Picker

The Font Picker makes it easy to quickly choose fonts in Particles. The picker itself pops up when you click a special field in the backend that gives you the ability to set a font for a Particle, or even for the theme itself.

Font Picker

Upon clicking the font icon to the right of the Font Picker field, a popup appears that enables you to type a phrase and see it presented in over 670 different fonts from the Google Font library.

Font Picker

To make life a little easier, you can filter these results by Category and Subset, as well as search for a specific font using the search tool in the upper-right corner of the popup.

This is a very quick and easy way to not only get a preview of what a block of text might look like with a different font, but to apply that font to your page by simply choosing it and hitting Select.

Color Picker

Color Picker

Gantry 5 features a brand new Color Picker. This picker includes four useful tools, Hue, Brightness, Saturation, and a Color Wheel.

Color Picker

Just click the field (which appears with the currently-set color as its background) and a popup will appear with everything you need to not only set the color, but its transparency and saturation levels as well.

Icon Picker

Icon Picker

Gantry 5 has support for Font Awesome’s growing font library built right in to its core. This means that anyone using a Gantry-powered template will have the ability to use any of these incredible vector fonts anywhere on your page.

These serve as lightweight alternatives to image files, can add a visual element to a menu option or an eye-catching accent to a block of text.

Icon Selector

Gantry 5’s powerful Icon Picker makes choosing an icon easier than ever. Clicking the icon on the right-hand side of the field loads a popup that presents you with a library of icons to choose from.

Move your mouse cursor over the icon for a quick zoom, set a fixed or relative width, add a spinning animation, choose a size, and rotate it as you need with easily-selectable options available along the top of the popup.

Not finding what you need right away? There’s a search field in the upper-left corner that will help you sort through the nearly 600 available options.

File, Image, and Video Pickers

Image Picker

Gantry 5’s file, image, and video pickers are a quick way to find and choose a file to apply to your Particle.

Whether you’re adding an image that you would like to serve as your logo, or linking up a video file for the Particle’s built-in video player, Gantry 5 has you covered.

Image Selector

Files can be viewed in either a grid or detailed layout. The file link is automatically based on Gantry 5’s streams system, which dramatically simplifies file linking.

These are just some of the many tools available to users in the backend of the upcoming Gantry 5 framework.

For more information about Gantry5, please check out these other blog posts from our ongoing series:

Looking for an update on the Gantry 5 beta for Joomla? You're in luck!

Pending any unforeseen delays, we should have the beta available for user testing as early as Friday, March 27th. This will enable us to conduct some additional internal testing and ensure that the initial beta release is ready to go.

Stay tuned to this blog for additional details as they become available.

Join the Conversation

comments powered by Disqus