7 . Using Render Panel

A description of the item.

Expose a render via a Render Panel

Clicking anywhere inside HTML of vptl will expose its render settings via the Render Panel.

We can access vptl renders directly from pages too. In this case, we'll probably want to have Disable Links(link to what it is) helper active, in order to avoid to accidentally navigate to another the page.

Add fields into a render

Click to a field to have it appear in a render. It is always added at the bottom, as the last HTML block inside the render, and then you can reposition it elsewhere.

It's not possible to drag the field out of a render into an "empty space" or into another render. You can reposition the field only inside a render which it belongs to.

Note about auto-refresh

If we modify the render by adding new fields directly on the page, the page will be refreshed after each operation. The reason is that on the page fields have to contain the real db content. If you want smoother experience without auto-refresh after each operation, use Stylebook. Since the content of all fields on the Stylebook are lorem values, an auto-refresh is not necessary.

Render field as meta

If a field is set as meta it will be rendered through a <meta> tag, and its content will be contained in the 'content' HTML attribute.

Selection of the tag will be disabled, since field is rendered through the <meta> tag.

Render the field through a different tag

The list of available tags for the field is directly related to the choice of a DIMS module. Choose the tag according to your needs. Some examples:

  • 'text' module is rendered through the neutral <span> tag by default, and you can choose to render it as a heading or a paragraph.

  • 'cedit' module is rendered through a neutral <div> tag by default, and you can choose to render it through another container such as <article>, <section> or <aside>.

Make new fields available in the Render Panel

It's not rare to have Render Panel and Structure Panel both active. Including the new collection property from the Structure Panel will make it immediately available in a Render Panel.

Note about removing active fields directly from the Structure Panel

If you try to do this, you will be warned that it is impossible to remove the field while it is active in the render. Removing the field from the render will make it possible to completely exclude it from the collection properties.

  1. Core Concepts
    1. Structured Data, MicroData, Schema.org
    2. GraphDB & Dynamic Content
    3. Html Renders (VPTL Model)
    4. Semantic HTML  (Document Semantics)
    5. CSS & Preprocessors
    6. External CSS & JS Libraries
    7. Integrated CMS
    8. Momentum Network and Market
  2. Environment
    1. Viewport
    2. Project Settings
    3. Tools Panel
    4. Code Editor & External Libraries
    5. Visual Helpers
    6. Web Parser
    7. Structure Panel
    8. Render Panel
    9. Stylebook
    10. Assets
  3. HTML
    1. Layout Structure (Master Template)
    2. Basic HTML Building
    3. Parsing Pre-made HTML
    4. Working With Snippets
    5. HTML In Dynamic Collection
    6. Hidden HTML Elements
    7. Forms
    8. Container Lock
  4. Website Structure
    1. Blank Pages
    2. Schema.org Classes
    3. Collections
    4. Collection Properties
    5. DIMS Module Settings
    6. Stylebook (vptli)
    7. Using Render Panel
    8. Index Operations
    9. Relations Between Collections
    10. Taxonomies
  5. Schema.org, Advanced
    1. Independent vs Context
    2. Testing Schema
    3. Knowing When To Stop
  6. Classes & Attributes, Advanced
    1. Auto Generated Classes
    2. Dynamic Attributes
  7. DIMS (CMS)
    1. Overview
    2. DIMS Interfaces
    3. DIMS Modules
    4. Publishing Content
  8. Building Editing Flow
    1. Inbound & Outbound Relations
    2. Using Dims Attributes
  9. Going Live
    1. Connect An External Domain Name