Level One Header Style Title (H1)

This is a mock-up of a typical content page. Please refer to styles and classes detailed on this page when adding content to your site.

Pelle itesque ullamc dolor sit amet consectetur ettoid wink elit consectecteur eu massa at ultrices an ghullam consectetur a lorem et losque ullamcom dolor sit amens ectetur lorem et losque ull. Largetext class.

This is a Level Two Header (H2)

Photo caption style

Pelle ntesque ullamc dolor sit amet, in-line link elit. Pellentesque eu mtetur lorem et. Lorem dolor sit amet ntesque ullamc om dolor sit amet duis ettoid nonummy consectecteur.

Pellentesque eu mtetur lorem et. Lorem ipsut fiops scing elit. Fuhetesque ullamc om dolor sit amet ntesque ullamc om dolor sit amet duis ettoid nonummy consectecteur.

Consectetur in-line link hover a elittius a ettoid pellentesque hassa at ultrices a comet losque ullamcom dolor sit amens ectnsec.

This is a Level Three Headline (H3)

Whulla jacilisi nonummy consectecteur ettoid. Lorem ipsum dolor sei amet socnise

  • Lorem ipsum dolor sit amet socnset opos dolor sit amet socisi notis.
  • Dolo or sit amet socnset opoasf.
  • Pols lorem ipsum dolor sit amet socnset opos
  1. Number 1
  2. Number 2
  3. Number 3

Button Style

Header 1 Header 2 Header 3
This is a table with the Table Class applied amet socnset opos dolor sit amet socisi notis
dolor sit amet socisi notis amet socnset opos Lorem ipsum dolor sit
Lorem ipsum dolor sit amet socnset opos dolor sit amet socisi notis

Image Style Guide

Image Guide

Please refer to the attached Image Size Guide when creating new image files to upload to your site. Images should always be re-sized BEFORE being uploaded via the image manager; do not use the image editor in LiveHTML to edit image sizes.

CSS Classes

  • imageleft - Aligns an image to the left side of the content area. Content will wrap around the image.
  • imageright - Aligns an image to the right side of the content area. Content will wrap around the image.
  • captionleft - Should be applied to a table containing an image and caption text. This class aligns the table to the left side of the content area and changes the color of the caption text. Content will wrap around the table.
  • captionright - Should be applied to a table containing an image and caption text. This class aligns the table to the right side of the content area and changes the color of the caption text. Content will wrap around the table.
  • largetext - Makes text larger.
  • attribution - Makes the quote attribution smaller when in the quote container.
  • button - Makes a link look like a button.
  • arrowLink - Adds an arrow icon to a link.
  • table - Apply to a data table to make it responsive. The table must have a header row at the top, all headers must be filled in and there cannot be any cells that span multiple rows or columns.
  • noresize - Apply to an image that should not resize with the browser. Please to not apply to any image greater than 200px in width.
  • red - Makes text red. Used only for production notes.

Available Icons

  • icon-briefcase -
  • icon-thinking -
  • icon-medal -
  • icon-cogs -
  • icon-openenvelope -
  • icon-laptop -
  • icon-megaphone -
  • icon-tools -
  • icon-coffeebooks -
  • icon-openbook -
  • icon-circlecross -
  • icon-ribbon -
  • icon-stats -
  • icon-target -
  • icon-people -
  • icon-communication -
  • icon-umbrella -
  • icon-treehearts -
  • icon-globeheart -
  • icon-music -
  • icon-hands -
  • icon-school -
  • icon-surroundedheart -
  • icon-leadership -
  • icon-holdingheart -
  • icon-giving -
  • icon-event -
  • icon-cap -
  • icon-gift -

To add an image with a caption:

  1. Add a one column, two row table
  2. Click into the top cell and insert your image
  3. Click into the bottom cell and type/paste the caption
  4. Select the whole table (either by hovering over an edge and selecting it, by right-clicking inside the table and going to "Table Properties", or by, when your cursor is in the table, clicking on the "Table" tag at the bottom of the editor which will select the whole table) and select "captionright" or "captionleft" from the Apply CSS Class menu to float the table to one side and have text wrap around it.

To add a custom container style to a Live HTML module:

  1. Add a LiveHTML module to the page and enter your content. Refer to the container examples on the Design Standards page for formatting.
  2. Click Save & Return to return to the page.
  3. Hover over Settings gear icon and choose "Settings" from menu.
  4. Go to Page Settings tab.
  5. Check the box next to "Display Container?"
  6. From the Module Container dropdown menu, select the Container Style.
  7. Click Update to save your settings.

Sample pull quote style consect a adipi pose fiops scelit fortas siri veb ettoid nibor dsir ekam ti.

Philip Carey, Client Services

This is the custom - quote container.

Inline Call to Action Title (h3)

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor ut labore et dolore magna aliqua.

Set Up a Fund

This is the custom - callout container.

Pane 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas fringilla lacus vitae justo eleifend fringilla.

Suspendisse egestas massa purus, vel feugiat nisl. Phasellus ut sem velit, at ullamcorper orci. Duis at enim eu nisi mollis bibendum vitae eu lorem. Nullam posuere est sit amet odio rutrum vitae rhoncus risus blandit.

Pane 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas fringilla lacus vitae justo eleifend fringilla.

Suspendisse egestas massa purus, vel feugiat nisl. Phasellus ut sem velit, at ullamcorper orci. Duis at enim eu nisi mollis bibendum vitae eu lorem. Nullam posuere est sit amet odio rutrum vitae rhoncus risus blandit.

Pane 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas fringilla lacus vitae justo eleifend fringilla.

Suspendisse egestas massa purus, vel feugiat nisl. Phasellus ut sem velit, at ullamcorper orci. Duis at enim eu nisi mollis bibendum vitae eu lorem. Nullam posuere est sit amet odio rutrum vitae rhoncus risus blandit.

Support Resources

Please visit help.embolden.com for support resources and user guides. For additional assistance please contact support@embolden.com or call 401.723.0055.

Share

Greater Green Bay Community Foundation

320 N. Broadway Street, Suite 260, Green Bay, WI 54303
P: (920) 432-0800   F: (920) 432-5577   Email Us

Connect
Subscribe to our eNewsletter
Accredited Community Foundation