skip navigation
Trumba Web Calendar Software
Trumba Help Center What’s New | FAQ | Support Forum | Email Support

Spud style settings

In Trumba® Connect, you have a granular level of control over the fonts and colors that appear in your published calendar views and other spuds.

In each publication's Publishing Control Panel, you have the opportunity to set global styles that apply across spuds as well as the ability to override any global setting on an individual basis.

What you can learn here

Why and how to set global styles

Setting global styles puts a style foundation in place across all of the spuds you create. While you can always modify settings on a spud-by-spud basis, starting from a common foundation saves you a lot of time.

Styles you can set on a global level include:

  • An overall color and font scheme for all of your calendar views and other spuds.
  • Fonts, text sizes, and text colors used on the base page and in headers, groups, sub-groups, and featured events.
  • Link and hover colors and decorations (underline versus none) used on the base page and in featured events.
  • Borders and/or background colors used on the base page and in groups, sub-groups, and featured events.

Tips

  • Base page refers to a set of underlying font, text, and color settings that carry across all of your spuds. You can modify any of these settings for each individual spud.
  • Groups and sub-groups appear in your calendar if you use a table- or list-based view and set event grouping and sub-grouping.

The global style settings are great, but more than I need. Can't I just apply a pre-designed color and font scheme and call it good?

To set global styles

  1. In the Trumba Connect editing environment, select the publication to which you want to apply global styles. Click Publish.

    If you haven't already published your calendar, on the Publish page, click OK.

  2. In the Publishing Control Panel, click the Publish Settings tab.
  3. Click Edit Styles & Icons.

  4. On the Edit Global Settings page, in the Color and Font Scheme section:
    • If you plan to set up your own custom color scheme, for Choose a color scheme, you can leave the default scheme selected.

      Or, if you see a color scheme that resembles the one you want to set up, you might save some time by selecting it.

    • For Choose a font scheme, select the font or font combination you want to use.

    Tip If you change the overall color or font scheme after you already customized styles for individual calendar views and other spuds, the global changes overwrite the spud customizations.

  5. In the other sections of the Edit Global Settings page, use the text fields and Color Picker to set the base page, header, group, sub-group, and featured event settings you want.

    Is there a quick way to import my organization's color palette?

  6. It can be tricky to know exactly what aspect of your calendar and other spuds a specific global style affects. After you select a setting or two, click Preview at the bottom of the page to see the settings in action.
  7. When you're satisfied with the global settings, click OK.

Get the most out of the Color Picker

When you're setting global styles (and customizing individual spuds), you select text, border, and background colors using the Color Picker. Setting up your calendar styles is a lot easier if you understand how to get the most out of this powerful tool.

Tip To save time, use the Color Picker to set colors at the global level before you apply them to individual spuds.

Basic Color Picker functionality

When you first open the Color Picker, you see a color palette under Top Colors. This palette comes from the color scheme that is selected at the top of the Edit Global Settings page.

Where do I find the Edit Global Settings page?

Color Picker with default color scheme outlined in red.

You can select a color for an individual style setting (for example, the base text color), by typing the color's hexadecimal (1), RGB (2), or HSV (3) value. You can even type a color name in the Hex field (1). Or, you can use the color slider and thumbnail to select a color visually (4).

If you use the same color a few times, the color is added to the Top Colors list, where you can apply it by clicking the color square. The list can include up to 16 colors.

Tip Double-click a color square to apply the color and close the Color Picker.

Color Picker best practices

Most likely, your organization has its own color palette that you use to brand your website and other publications. If you have a logo or other image that includes some or all of your palette's colors, you can use that image to add your custom color palette to the Color Picker.

To bring an image's colors into the Color Picker as a custom palette, click Select Image, and then select New.

After you locate and name the image, the image colors appear in the Color Picker under Custom Image Palette. Your custom palette can include up to 16 colors. To apply a color to a setting, simply click the color square.

Tip Double-click a color square to apply the color and close the Color Picker.

After you apply your custom colors to global settings and save the Edit Global Settings page, colors from your custom palette replace the default colors under Top Colors. To apply a color, you can click (or double-click) its color square in either the custom palette or top colors list.

As you apply them, custom palette colors replace default colors in the top colors list.

How style inheritance works

If you set styles at the global level, calendar views and other spuds inherit most of the global style settings. This saves you a lot of time as you only have to touch many individual spud settings when you want to override the global values.

Global style settings are inherited by the following:

  • Calendar spuds
  • Control spuds
  • Promotion spuds
  • Calendar and event emails
  • Filter view spuds
  • Custom object child views

Tip Global style settings DO NOT affect event colors. By default, event colors originate with the calendar color choices you make in the editing environment. You can change the default event colors if you want.

How do I know when a setting is inherited?

The following image shows a section from the Edit Settings & Styles page for a Classic Table calendar view. Inherited settings show grayed out text in the text boxes as well as a "same as Global [setting]" note.

You know a setting is inherited when its text is grayed out and it is annotated with a note.

How do I override inheritance?

When you're editing an individual spud's styles, you can override any inherited setting by clicking the setting's text box or color square.

To override an inherited setting, click in a text box or click the color square.

The text becomes editable and the Color Picker icon active.

In addition, you see the inheritance button () to the right of the Color Picker icon. To revert to the global setting, click that button.

Tip If you customize individual spud font and color settings and then, at the global level, change the color or font scheme, the individual spud settings are overriden. However, you can change individual global settings without affecting spud overrides. More about global settings.

How to set styles for calendar views and other spuds

After you set a publication's global styles, you can customize styles for each of the publication's spuds on an individual basis.

To customize a spud's styles

  1. In the Trumba Connect editing environment, select the publication with spuds you want to customize. Click Publish.

    Tip If you haven't already set global styles, do that now.

  2. In the Publishing Control Panel, click the tab for the type of spud you want to customize.

    For example, to customize a:

    • Calendar view spud, click the Calendar Spuds tab.
    • Control spud, click the Control Spuds tab.
    • Promotion spud, click the Promotion Spuds tab.
    • Calendar or event email, click the Email tab.

    Before I can customize spuds, I need to know how to add them.

    I need an overview of calendar and event email.

  3. Click Edit Settings & Styles at the bottom right corner of the spud.

  4. On the Edit Settings page, on each tab, find and customize global style settings you want to override and styles unique to the spud that you want to set.

    You might want to review the information about style inheritance before you start customizing.

  5. After you make a couple of changes, at the bottom of the page, click Preview to see the changes in action.
  6. When you're satisfied with how the spud looks, click OK.
Privacy | Terms | Public Calendars