Edit a community theme
If you want to edit a live theme but are not ready to publish your changes, copy the live theme and then make your changes in the copy. When you are ready, set the copy as the active theme for the community.
- Open the Community app and click Community > Member Experience at the top of the page.
- Click Theming.
-
On the left-hand side, select the theme you want to edit.
Result: The theme details open on the right-hand side.
- In the Theme Name field, enter a name for the community theme.
-
Choose settings for the theme elements.
For more information about the different theme elements, see Community themes.
-
Select colors for applicable theme elements.
- Type the hex code
value in the field.
For example, #ffffff or ffffff
If the color supports different opacities, the hex code value is converted into RGBA.
- For colors that
support 100% opacity only, type the RGB value.
For example, rgb(255, 255, 255)
- For colors that
support different opacities, type the RGBA value.
For example, rgba(255, 255, 255, 1)
- Select the color using the color picker.
- Set the opacity using the slider beneath the color picker.
- Click Choose when you are finished.
- Type the hex code
value in the field.
- Select font
options from the menus.
The following fonts are available:
- Arial
- Georgia
- Hand of Sean
- Helvetica
- Montserrat
- Open Sans
- Raleway
- Roboto
- Times New Roman
- Verdana
Note: If the community locale is set to an Asian language, the only available font options are Serif and Sans-Serif. - Upload new
images.
-
Delete the previous image by clicking the Delete button on the right of the image field.
- Click Upload File.
- In the Upload Image dialog, click Browse, select an image, and click Open.
-
Type alternative text for the image.
Generally, alternative text should be a brief description of what is in the image. Alternative text is useful because:
- If the image fails to load properly, the alternative text appears in its place and can therefore provide some context.
- Alternative text is what is provided to screen readers and accessibility software, for users who cannot view the image.
- Click Add.
For more information about community theme images, see Community theme image specifications.
-
-
- Optional:
Click
Preview to view your theme changes.
The preview mode opens in a new browser tab.
At the top of the page, use the left-hand menu to select the application area, and use the right-hand menu to preview specific pages. The following table describes which pages you can preview.
Application area Preview pages Portal - Sign In
- Portal Content
Note: Preview is not available for surveys or forums currently. - Optional: Click Publish to save changes to a theme, or to make changes to an active theme live.
- Optional: To close the theme editor without saving changes, click Undo Changes, and then click Undo Changes again when prompted for confirmation.