Panels

Panels

LocalSignal uses panels as building blocks for a web page. Panels can be used across multiple pages. Depending on how the panel is coded, it will feature editable areas. The LocalSignal CMS attributes and values control what content is editable on the page.

Use the panel library to create a new panel or start with a blank editor. Panels are sorted in the following categories: Basic Content, Footer, Forms, Gallery, Guides, Header/Navigation, Hero, Image/Icon Buttons, Lists, Map, Miscellaneous, Pricing, Structural Elements, Team, and Testimonials. The Used category displays all of the panels used on published pages. New categories can be created as well.

Using a Panel

The Panel Code library is available as a starting point or start with a blank panel. To use a custom panel, you must first create one.

To apply a panel to a page you must add it to the page’s layout. 

Panel Structure

Panels are divided into tabs: HTML, CSS, JavaScript/CoffeeScript, Options, and Preview.

  • HTML
    HTML is included into the page where the panel is placed.
  • CSS
    All CSS from every panel is being included in a css document automatically generated by LocalSignal.
  • JavaScript/CoffeeScript
     Appended to the bottom of the webpage the panel is included on. You can choose between using JavaScript or CoffeeScript in the Options area of a panel.
  • Options
    The panel's name, category, external scripts, and wireframe. External scripts are managed in the Assets section of the website.
  • Preview
    View the panel.

Editing a Panel

Click on the Panel name in the menu in order to open the panel to edit it. Any change you make in the panel editor will be updated on every instance of the panel. Panels can be used multiple times within one page, as well as across a website.

Panels use three CMS attributes to make content editable for the client: cms-type, cms-name, and cms-id. 

Note: If a panel is on a published page, any changes made to the panel will effect the live website.

Creating a Panel

Click on the New Panel button in the Panel section to create a new panel. It is recommended to follow the LocalSignal Naming Conventions.

Duplicating a Panel

Duplicate a specific panel by clicking on the duplicate button next to the panel title. LocalSignal opens the new duplicated panel so you can begin editing right away.