09 Aug 2016
New and Improved Front Matter Interfaces
CloudCannon is committed to bringing the best editing experience to static and Jekyll sites. We provide world-class interfaces for your clients to update their front matter, a core offering of Jekyll.
There are more front matter interfaces available in CloudCannon than ever before. We’ve recently added more interfaces and ways to customise them.
Front matter is often useful for sections of text outside the main content of a page. Give clients control of formatting with this new interface. The
_markdown conventions set what format the text is saved in. Markdown values need to be run through the
markdownify filter to render with formatting.
Giving your clients access to colour doesn’t always bode well for a design’s longevity, but there are some good use cases. CloudCannon supports colour in front matter by providing a unified selector that outputs to a number of formats. You control the format, the client controls the colour.
If you’ve ever needed an interface for clients to select a subset of items from a predefined set of values, this is for you. CloudCannon populates values from arrays or objects defined in
_config.yml, and collection items. Clients add collection items to create additional values in the set.
There’s a undeniable link between social media and websites, and your editing interfaces are now aware of it. Social interfaces are text fields for URLs and IDs. Profile pictures are displayed alongside, validating for clients they have the correct URL and adding detail to an otherwise plain text field.
Documents and Images
The file selector based on the
_path convention has been incredibly popular in sites on CloudCannon, especially for images. The new
_document_path conventions now allow you to restrict the files to images or documents only. Using a more specific type provides a better editing experience and reduces potential mistakes from clients.
Take advantage of the HTML5 number input and store client-entered values numerically.
Comments provide instructional or guide text for any interface. Use this heavily requested feature to remind clients of specific details for each interface when a title or key just isn’t enough.
When clients create new items in an array, the keys and interface types are created from the previous item to ensure a consistent interface. You can now provide the starting values for the new item as well.
Set starting values for variables to the most likely value, and set starting images to placeholders (retaining the path when the client selects another)
Full Width Editor
Collection items are often files containing only front matter. Dedicating most of the editor to the content isn’t the best experience in this scenario. Hide the content area by setting
_hide_content: true in your front matter.
The full documentation for front matter has details and examples to get you set up with any of these interfaces and customise them further.
We have more interfaces planned, keep track of all the changes in CloudCannon in the change log. As always, we are keen to hear your feedback on the new features and look forward to seeing what you build with them.