XHTML Block

Details

Audience: All users

Description:

The XHTML block can be used in all page templates and will render with general block stylings like the Spotlight block or Feature block.

Installation

  1. Copy the XHTML block file into the _user-blocks folder in the location of your choice.
  2. Click Edit and define the information requested in the fields as desired. Click Submit to save.
  3. Edit the page where the basic block will appear. Attach the block and click Submit to save.

Customization:

By default the XHTML block is styled through the CMS' central files. The XHTML block includes a field for a custom CSS class to add your own CSS in a supplemental stylesheet.

How to create an XHTML block

Layout of the basic block

  1. Title - title heading for your block.
  2. Head level - defaulted to an H3 heading level, but gives you the option to override that heading in the event you know a different semantic heading level is required.
  3. Section anchor name - apply an anchor name if desired in case you want to link to the content in this block.
  4. Content - WYSIWYG area for you to add content.
  5. Language code - If content in this block is written in a language other than English, you can apply a proper language code to make sure the language is grammatically correct. A list of language codes is available to assist you.
  6. Custom class - a custom CSS can be added to your basic block via the supplemental.css stylesheet. Remember to follow the naming convention of u_yourClassName.
  7. Comments - notes or comments can be added to your block which will be saved to Cascade for future reference.

How to attach an XHTML block

Attaching the FAQ block to a page

  1. Browse to the location of your XHTML block in the Base Folder/_user-blocks/ folder and click to choose and select Confirm to attach.
  2. Open the page that will display the block. Click Edit. Decide where on the page the block should appear in relationship to the particular repeating content block to which you're attaching it.
  3. Select the desired width of the block on the page. 100% will result in the basic block filling the entire width of the available page space.
  4. If less than 100% you have the option of having the block appear on the left side or the right side with any text on the page wrapping around it.
  5. If you wish the block to appear without a border, check the box to remove it.
  6. Click Submit to save your changes.

XHTML Demo

XHTML Test

Lecturer and journalist Sasha Abramsky talks about how college students are disengaged in politics.

CSS Stylings

All blocks offered in the Content Library have a built-in hook to allow users to create custom stylings via the use of a supplemental style sheet. To date, the following classes have been created in conjunction with the available blocks:

  • Code block - class name: ._code-block
  • FAQ block - class name: ._faq1 (._faq-block)
  • Feature block - class name: ._feature-block
  • Jump menu block - class name: ._jumpmenu1
  • RSS block - class name: ._rssfeed1 (._rssfeed-block)
  • Slideshow block - class name: ._slideshow1 (._slideshow-block)
  • Title area links block - div id: #links
  • Video block - video2.css
  • XHTML Raw block - class name: ._xhtml-block