The Theme Editor lets you create and edit themes.
...
Go to the Refined Administration.
...
Go to the Themes & Styles tab.
...
A theme determines the look of your site.
You manage your themes in the Refined Administration > Themes.
The Theme Editor is the tool that you use to create and edit themes.
...
Theme Editor anatomy
To the left of the editor you see , the preview which area shows the look of your theme. It automatically updates when you make a change in the theme’s settings, which lets so you can play around with your design before publishing it. To see how the theme looks in different areas parts of your site, use the dropdown drop down list at the top to switch between Portal view and Request/Issue view.
To the right of the editor you build edit your theme in the Settings tab. Click the History tab to view and restore previous versions. A version is generated every time you hit the save button.
...
The main appearance of your site is divided into three areas, for which you can customise the settings:
The header is located at the very top. It contains the category menu and the site switcher.
The body is the block located in the middle of your pages. It contains portals, requests and issues.
The footer is located at the bottom of the site. To edit the content of the footer, use the Layout Editor.
...
Setting
...
Description
...
Available for
...
Main appearance
...
Click one of the three icons to decide how much background is shown behind the header and body: only at the top, partial or full. Then customise the settings for the header, body and footer.
Setting | Description | Available for |
---|---|---|
Background | Set a single colour, gradient or image as background. Colour picker and image info linksCustomise images with these additional settings:
| Header |
Text colour | Set the colour of all the area’s text that does not link to another page. | Header |
Link colour | Set the colour of all the area’s text that links to another page. | Footer |
Border | Set a border around the area. Once enabled, you can pick the border’s colour. | Header |
Shadow (Effects) | Drop a shadow behind the area. Once enabled, you can pick the shadow’s colour. | Header |
Content | Customise the area’s content with:
| Body |
...
Setting | Description |
---|---|
Width | The default width of your portals is 1200px (75 rem). You can set a new width by percentage (of browser window width), pixels, or rem. |
Fill background | Makes the content fill out the full width of the browser window. This has the same effect as setting the Width setting to 100%. When the background is filled, you are not able to set the width manually. |
Row style | |
Title position | Position the title to the left, center or right. |
...
Setting | Description |
---|---|
Primary button colour | This dictates the colour of most buttons in the portal UI, including:
|
Keyboard navigation | Learn about Decide the looks of the keyboard shortcuts overview. |
Colour picker
There are multiple ways to pick a colour in the colour selection popup:
...
Use the vertical slider located in the middle of the popup to control the colour’s opacity.
Image options
Customise images with these additional settings:
...
Full, repeat or without repeat
...
Position the image
...
Filter (blur, shade, monochrome, vintage)
...