Home > Creating your first panel

Creating your first panel

With FlexiPanels CSS you can build Css based menu containers, content zones, nuggets and boxes. You can start from the built in predefined panels gallery (quickstart) or create your own from a layout picture.

Quickstart – using the embedded readymade panels gallery

If you use the embedded readymade panels:

• The extension comes with 30 Predefined panels (5 or more color themes each)
• It’s very fast: select the panel  from the gallery and insert it in the page
• Creates a flexible DIVs + CSS structure that allows you to insert content and the resize of the panel elements (header/body/footer) without breaking the design
• Include or exclude panel’s header, content or footer
• Adjust the panel width and height and the content properties (font style, padding, height)
  

 

Quickstart - create your own panel from a layout picture

If you start from a layout picture:

• Comes with FlexiSlicer  - an Adobe Air based tool that helps you get the panel design from a layout, slice and  export all the necessary images that will be used in the CSS
• With FlexiSlicer you can crop sections from your layout and change the color of the graphical elements on the fly
• Creates a flexible DIVs + CSS structure based on your cutting points
• The panel elements (header/body/footer) can be resized from the extension interface without the need to create a new graphical design
• You can save the result as a new panel and add it to the gallery for later use