Theming options reference
The Themes interface gives you the ability to create a professionally-designed community with just a few clicks.
You have many options for designing your site by using the theming interface.
Field | Description |
|---|---|
Themes | From here you can see all your saved themes, import or export themes to back up, share, and transfer themes to/from other instances (typically, test instances), or select from a list of predefined themes. For more information, see Importing themes, Exporting themes, Using predefined themes. Community managers and users with Customize Site permissions can use the out-of-the-box theming feature. |
Fonts and Colors | From here you can set the font of all text elements. Also, you can customize the text color for these elements, such as links, hovers, and metatext. |
Branding and Decoration | From here you can set the community page width, favicon, background color and image, and border style. Be aware that if you set your Background Attachment to Fixed, depending on the image size and width, browser scrolling may be slow. |
Advanced: Header and Navigation Style | You can choose one of the following options: Reduced (default for new instances; upgraded instances retain their existing theme), Basic, or Custom. The Reduced option includes a thin navigation bar, no header, small logo, and limited options. The Basic option includes a full navigation bar, header, large logo, and more options. The Custom option enables you to customize the HTML and CSS of the header (and optionally, the footer). |
Advanced: Images | You can upload images to your theme to use in custom headers and footers. These images reside in your Jive instance as part of the theme, are accessible from the internet to anyone who knows the URL, and can be imported and exported with the theme. If a theme is deleted, its associated images are also deleted, so the best practice when creating themes is only to link to images uploaded to the current theme. |
Advanced: Custom Links | You can create custom links on the main navigation menu. You don't need to know any CSS or HTML to use this option. For more information, see Creating custom links in the main menu. |
Advanced: Advanced Theming | You can create your custom themes with Freemarker or Soy. However, using custom themes incurs substantial upgrade risks. We strongly recommend that you use only the Customize Your Site theming interface to avoid upgrade risks. For more information, see Developing custom themes. |
Field | Description |
|---|---|
Branding Header and Navigation: Branding header | Sets the community logo and background color and image of this header area. You can upload an image to be used as the logo image and specify in the Alternate Text box the alternative text for the image if a user for some reason cannot view it. |
Branding Header and Navigation: Main Navigation | Sets the link colors, background color and image of the main navigation menu. Note: You can also customize the actual buttons that appear in this navigation menu. |
Headline Color and Font (Sample Header) | Sets the background color and font of the headline area. You can also choose to inherit the font from the Branding and Decoration settings. |
Secondary Navigation | Styles the Create menu, the search field, and the menu under each user name or avatar, including the shapes of the avatars shown in the user menu. You can use this setting to remove the search box from the main navigation menu. |
Sidebar List | Sets the text color and font for links in the sidebar. If you don't set this style, it inherits the style of the Sample Widget. |
Sample Buttons | Sets the color style of the buttons and various other elements throughout the user interface, for example, main navigation menu highlights. |
Sample Widget | Sets the widget elements, such as border style and header background. |
Search | Sets the display style of the Search box. |
User Profile | Sets the text color and the style of the arrow drop-down menu of the User Profile. |
Related Sections:
-
Theming your site: The out-of-the-box theming tool lets you quickly customize the look and feel of your community. You can change the appearance of various interface elements, such as text, background colors, and logo image. These changes affect all pages in your community.
-
Optimizing themes for mobile browsers: When planning your community theme, note that some theming options are not viewable on the smaller screen of a mobile browser. You can select Basic theming for optimal mobile browsing.
-
Using community from mobile browsers: When accessing a Jive community from a mobile device, the mobile browser features simple navigation with large buttons that are better suited for touch screens. Note that options that are too complex or too large for narrow screens are not displayed.
-
Differences between out-of-the-box and custom themes: You can use the out-of-the-box Theming Tool or create custom themes, but you should understand the differences and upgrade risks between the out-of-the-box and custom themes.