For people who have some basic web development skills or need to add third-party scripts, Super offers advanced and powerful customization through custom code snippets.
With custom code you can add head tags to a page like third-party scripts, style it to look exactly how you want, and even add elements like navbars and footers to your site.
Custom code can be added to your entire site or on specific pages. To add code for the entire site click the "Edit code" button in the "Options" page.
Adding code to an individual page can be done by clicking the code icon on a page row in the "Pages" page or click "Edit custom code" when hovering over the ellipsis on a page row.
Super utilizes the code editor used in Visual Studio Code to provide syntax highlighting and a familiar environment to hack away at your site.
Any default styles on your page can be overridden with custom CSS. The class names for elements on your site were intentionally designed to be easy to understand and override. Learn more about what CSS classes you can use below.
The colors of your site are also customizable through a set of CSS variables. You can find a list of default colors we use with their corresponding CSS variables here.
|Name||HTML Element||CSS Color Variable||CSS Class||Images||Tags|
Table of Contents
Progressive web app
The Super dashboard is fully responsive, meaning it works seamlessly on mobile, tablet, and desktop. It's also optimized to work as a progressive web app (PWA).
Installing on iOS
- Visit the Super dashboard on your iPhone or iPad in Safari
- Press the share icon at the bottom of Safari
- Press "Add to Home Screen". Below is a view of how this could look on iOS
- Wait a couple seconds for all assets to load onto your phone or tablet's home screen as a bookmarked web app.