Custom Style Properties

Settings for Rich Text and Table modules, as well as Sections, now contain an increased selection of style properties, giving users access to a greater degree of customization in their ePortfolios. Advanced Customization options allow users to assign styles based on content type, allowing for multiple styles to exist in a single module.  When used with the new Apply Styles feature, the new style properties make it easy to apply a custom style to an entire ePortfolio.

Rich Text Module

1-newstyles.jpg

The style options under the Text heading function the same as the Customize Style options in the previous Module Settings panel, changing the style of paragraph text (1) in the Rich Text module.

1customstyle.jpg

The most significant change to the Module Settings panel is the addition of the Advanced Customization menu, where new style options can be applied independently to the following types of content, which are created using the corresponding buttons in the Rich Text toolbar, shown above:

Heading (2)

  • Font Family
  • Font Size
  • Font Color
  • Alignment
  • Padding

Quote (4)

  • Font Family
  • Font Size
  • Font Color
  • Alignment
  • Padding
  • Quote Style:
    • Quote Bar
    • Double Quotation Marks ""
    • Chat Bubble

Equation (6)

  • Font size
  • Font color
  • Padding
  • Border color
  • Background color

Link (5)

  • Font Family
  • Font Size
  • Font Color
  • Alignment
  • Padding
  • Hover Color (default: #337ab7)
  • Underline Links (default: off)

Bullet & Number List (3)

Bullet List

  • Font Family
  • Font Size
  • Font Color
  • Alignment
  • Padding
  • Bullet style:
    • Disc
    • Circle
    • Square

Number list

  • Font Family
  • Font Size
  • Font Color
  • Alignment
  • Padding
  • Number style:
    • Decimal (default)
    • Decimal Leading-Zero
    • Lower Alpha
    • Lower Greek
    • Lower Roman

 Together, the Text and Advanced Customization style menus can be used to create multiple styles within a single module.

2-NewStyles.jpg

Table Module

In addition to the standard Text style properties, the Table Module now includes the following style properties:

  • Cell Color
  • Cell Hover Color
  • Cell Opacity
  • Cell Padding
  • Border Thickness
  • Border Color

Additionally, the Text properties and Cell properties of the table’s top and bottom rows can be styled independently using the Advanced Customization menu.

3-newstyles.jpg

Sections

Section Settings has been reorganized into separate style options for the Top Layer and Bottom Layer Background.  The Top Layer consists of the central content area of the section, containing all of the section’s modules. For Top Layer Background, users are given a choice of selecting a background color (1), uploading a background image (2), or both. Unique combinations of background color and image can be created by adjusting opacity (3).  As always, users can select a Fixed position for their image, or can select Repeat (4).

1custom.jpg

The Bottom Layer Background spans the entire width of the page.  The settings contain the same options as Top Layer, with the exception of Image Opacity.

2ucstom.png

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments

0 comments

Please sign in to leave a comment.