Hiding UI Elements
Setting the parameter display:none; is a convenient way to hide any element through the CSS. If you set display:none; as an override, the corresponding element is not rendered in the browser. You can use display:none; alone or in addition to other CSS parameters.
| The hidden element still exists in the HTML transmitted to browsers, so don't use this parameter to hide sensitive information. For example, if you hide a menu item, a user with the FireBug plug-in to Firefox can remove the display:none; attribute to reveal the menu and use it. For a more secure way to remove menu items, see Restricting Access by Role. |
The following example shows how to use this parameter to remove the logo or the search box from the UI.
To remove the logo and/or the search box:
| 1. | Edit a theme or create one. |
| 2. | If necessary, copy the overrides_custom.css file from the default theme to the main folder of your theme. |
| 3. | Do one or both of the following: |
| • | Remove the logo. Edit the overrides_custom.css file and add the following CSS rules: |
| • | Remove the search box. Edit the overrides_custom.css file and add the following CSS rules: |
| 4. | Upload and activate the new theme with your image and CSS file, then click your browser’s Refresh button. |
Recommended Comments
There are no comments to display.