Detailed Elements Properties
Related: Quick start guide, Layout Editor, Publish Editor
Each element in Divine Elemente usually has its own settings.
Common properties (Link, Alt, CSS, Image, Margins) are used for the majority of elements. At the same time, several elements have their optional unique properties.
Element properties
More details on elements properties can be found in the Properties guide.
Each type and description of elements properties are considered in details below.
Elements types and their properties
Elements are the basis of website creation (they are like bricks). They can be described best as a container, which carries all necessary properties, a position of an element, styles, functionality for a web page / theme objects like texts, links, buttons, images, etc. Read more about elements.Types of elements
The following three types of elements available for use in Divine Elemente plugin at the moment are:
- Static elements – for HTML (‘Logo’, ‘Link’, ‘Text’, ‘Images’, ‘Social Icons’, etc.),
- Dynamic elements – for a blog (‘Blog Post’, ‘Date’, ‘Author’, etc.),
- Style elements – for content’s design in the blog (‘H1’-‘H6’, ‘Texts’, ‘Links’).
Static elements
Static (HTML) elements can be usually added any time you want (for example, you can make even 100 links on the page when it’s required). In the first place, they are necessary for the page filling with design and graphics as static elements will not be dynamically changed by CMS – e.g. ‘Logo’, ‘Link’, ‘Text’, ‘Images’, ‘Social Icons’, etc.
The following Static elements available for use in Divine Elemente now are: ‘Logo’, ‘Text’, ‘Link’, ‘Image’, ‘RSS’, ‘Twitter’, ‘Facebook’ and ‘Buzz’.
Element properties. Static elements
Static elements can be arranged in the Header and the Footer, and they have сommon properties only. These elements properties descriptions are offered below:
- (A) Link – is used for the links creation. If this property is not empty, the element selected will be displayed as a link.
- (B) Image – sets the image’s quality, type, and text extraction format for the publishing of element’s graphic component and autonaming of these files by default too.
- (C) CSS name – is used to specify a CSS class name of an element.
- (D) Alt text – is used to specify an alternative text (alt text) that is to be rendered when the element, to which it is applied, cannot be rendered.
- (E) Content – notifies that this element’s content can be edited in CMS.
Each static element may be published not only as a text but as an image too, or a text + image on the element’s background (for example: an icon near the link, button, decorative underlining of a text, etc.).
Dynamic elements
Dynamic elements usually can be added just one time, but their instances are duplicated many times if required by CMS (good examples are ‘Post Title’, ‘Date’, ‘Author’, etc.). These elements often have optional unique properties too.
Here is a list of all dynamic elements divided into groups (widgets) according to their functional intended purpose, which are in use in Divine Elemente plugin at the moment:
| Search | Sidebar | Post | Comments |
|
‘Input’ ‘Button’ |
‘Titles’ ‘Links’ ‘Content’ |
‘Titles’ ‘Dates’ ‘Authors’ ‘Content’ ‘Comments’ ‘Counters’ ‘Details ‘Separators’ |
‘Titles’ ‘Content’ ‘Authors’ ‘Dates’ ‘Avatars’ |
| Pagination | Billboard | Another | |
|
‘Previous’ ‘Next’ |
‘Next’ ‘Previous’ ‘Slides’ |
‘Frontend Label’ ‘Favicon’ |
Possible elements arrangement
- Elements of the Search group can be arranged in the Header, the Footer and the Sidebar grid blocks.
- Elements of the Sidebar group can be arranged in the Sidebar grid block only.
- Elements of the Post, the Comments, the Reply, the Pagination groups can be arranged in one grid block only – Post (‘Content’).
- Elements of the Billboard can be arranged in the Header and the Footer grid blocks.
Elements properties description
Almost all elements have common properties we already mentioned above. And one more property called Margin is added to this list for dynamic elements.
However, several elements (‘Date’, ’Author’, ‘Comments’, ‘ Frontend Label’, ‘Favicon’, ‘Billboard slides’, ‘Avatar’) have also unique properties. Each of these elements and description of elements properties are considered below.
‘Date’, ‘Author’, ‘Comments’ elements
A possible way of text formatting for each of the ‘Date’, ‘Author’, ‘Comments’ elements may be selected in their special dropdown lists.
For example: you can choose how to display a date at the website: shortly like “12 Sep”, or formally like “09/12/10”, or “12” (on the upper line) and “Sep” (on the lower line) near the post.
Dynamic elements. The ‘Author’ element’s guide.
More details on these elements properties description can be found in the “Elements Types: Date, Author and Comments” guide.
‘Frontend Label’ element
This element is used for display of the Editable content panel.
Note: This element cannot be assigned from the canvas!
The ’Frontend Label’ element’s properties. Animate options
Besides common properties, the ‘Frontend Label’ element has two more unique properties:
-
Align is a property that shows the arrangement of this element on the page
- Top left corner
- Top right corner
- Animate is a property that sets an effect of concealment and display of the element on the page.
More details on the Editable content feature can be found in the ‘Editable content’ guide
‘Favicon’ element
‘Favicon’ is a special icon that is displayed near your website URL in the browser’s address line, favorites, search results, or in specific resources (folders, social projects).
‘Favicon’ element
Note: This element can be assigned from the Footer grid block only!
Just the Image property is available for this element from common properties.
At publishing, a graphic element is not taken into account in the page background and will be reduced to 16×16 size automatically.
‘Slides’ element
‘Slides’ is one of the Billboard widget’s elements. This element helps to assign slides, which can be switched by next / previous elements. Using several layers in Adobe Photoshop and assigning them in the special way, you can make a beautiful JS slider of your portfolio, photos, etc.
Beside common properties, there is one more property added for the ‘Slides’ element – Animate.
Dynamic elements. The ‘Slides’ element’s properties.
With the help of this property you can set parameters for slides changing:
- select the Animate effect,
- set a duration for the slides changing,
- set a frame rate in the slides changing.
More details on ‘Slides’ can be found in the “Billboard” guide.
‘Avatar’ element
‘Avatar’ is one of the Comments widget’s elements. It is a decorative base for an avatar (human face who posted a comment in a blog) in Divine Elemente.
Note: You can change a base for an avatar only. You cannot change the avatar itself because it is formed in the CMS dynamically.
Besides common properties, this element has its unique option – Avatar.
Dynamic elements. The ‘Avatar’ element’s properties.
You can set common properties with this option:
- left and upper indents in the element,
- customer image’s size,
- or choose values by default.
Style elements
Style elements can be added just one time. They are used to design HTML tags, such as ‘H1’-’H6’, styles of which will be used at page content’s editing or presenting in dynamic elements – e.g. in Blog Post or Comments.
Elements can be arranged in the Sidebar and the Post grid blocks.
All style elements have such common properties, as Alt text, CSS name and Margin.
More details on elements’ description and their work in Divine Elemente can be found in the ‘Elements’ guide.
Conclusion
Thus, you have just learnt that each element that is in use in Divine Elemente plugin may have common, autonaming, and unique properties according to its type, and you’ve also found the description of elements properties in this guide. So, you know exactly when each element can be added, how it should be arranged, and what element properties you can set for it.Related Guides and Tutorials:
DEPOSIT NOW CANCEL
