Difference between revisions of "Html Widget"

From unroole CMS wiki
Jump to: navigation, search
(Created page with "<noinclude> {{for|more information|Widgets}}</noinclude> Html Widget gives you the ability to display any HTML desired in a page. {{clear}} == Properties == In the [[Layout...")
 
Line 2: Line 2:
 
{{for|more information|Widgets}}</noinclude>
 
{{for|more information|Widgets}}</noinclude>
  
Html Widget gives you the ability to display any HTML desired in a page.
+
Html Widget gives you the ability to add any HTML/JavaScript/CSS desired in a page. Although this widget give you great possibility for customization, you need to be very careful when using it. Some of the things to look out for:
 +
* When adding CSS, its style will apply to everything on that page. If you are using the [[Layout Editor]] this will also effect the style of the box frame and section, for example the "x", "+" button or the section indicator. Your CSS code may possibility effect these items and render them useless. One way to avoid these problems are to always use specific selector in CSS, for example ".box_number > a { color:red; }" instead of just "a { color:red; }"
  
 
{{clear}}
 
{{clear}}

Revision as of 17:31, 14 November 2012

Html Widget gives you the ability to add any HTML/JavaScript/CSS desired in a page. Although this widget give you great possibility for customization, you need to be very careful when using it. Some of the things to look out for:

  • When adding CSS, its style will apply to everything on that page. If you are using the Layout Editor this will also effect the style of the box frame and section, for example the "x", "+" button or the section indicator. Your CSS code may possibility effect these items and render them useless. One way to avoid these problems are to always use specific selector in CSS, for example ".box_number > a { color:red; }" instead of just "a { color:red; }"

Properties

In the Layout Editor, Html widget have these properties:

Html Widget Property.png

Property panel for Html Widget
Name Description
HTML Content Enter any desired html code.
Custom Id Type in a custom id. This id can then be used in CSS and Javascript to change the style and behaviour of this widget.
Custom Classes Type in a custom class, or mutiple classes seperated. These classes can then be used in CSS and Javascript to change the style and behaviour of this widget.