- Get started with theme development
- Gulp Viewport and Developer tools
- Theme development troubleshooting
- Password-protect content for anonymous users
- Advanced content rendering
- Develop Pluggable Placeholders
- Get help with theme development
- Page context
- Blog overview context
- Search context
- Error context
- Supported macros
- Theme guidelines
- Theme properties
- Search and SEO
- Confluence/Viewport macros and features
- (External) files and media
- Integration with other Scroll Add-ons
Integration with third-party software
- Displaying Additional User Information from the User Profile Plugin
- General 3rd party add-on implementation
- Integrating Disqus Comments
- Making Gliffy macros resizable
- Making UI-Expand macro of RefinedToolkit work
- Displaying Viewport Content in an iframe
- Integrate Midoris Archiving Plugin
- Trigger EliteSofts Page View Macro through Scroll Viewport
- Make your app compatible with Scroll Viewport
- Content Management via Page properties
- Context-Sensitive Help
By default, Scroll Viewport renders a a hamburger icon (the "Viewport Control Opener") that allows users with the appropriate permissions to open the Viewport Control. However, in some themes the control might look good. Therefore it is possible to simply override the Viewport Control Opener.
To do so, a theme developer can simply create his own icon/HTML element and mark it with an id of sp-viewport-control-opener.
The following example is taken from the Bootstrap theme.
By default, the Viewport Control Opener in the Bootstrap theme looked like this:
As you can see the visual appearance does not quite fit to the Bootstrap style, so we've added a button.
<button id="sp-viewport-control-opener" type="button" class="btn btn-default pull-right" style="margin: 8px -15px 0 30px;"> <span class="glyphicon glyphicon-tasks" aria-hidden="true"></span> </button>
The only thing to notice here, is
id="sp-viewport-control-opener". When the viewport with this theme enabled is loaded in the viewport, there are two possible situations:
- the current user does have the permissions to access Confluence: Scroll Viewport hooks up an event handler on that element, that will open the Viewport Control on click.
- the current user does not have the permissions to access Confluence: Scroll Viewport simply removes the element. Therefore make sure the alignment of your page looks well too, when the element does not exist.
The result looks like that: