Guide 4
Make it look like the demo
A fresh install carries the stock name, no logo and no background. This is every value the live demo publishes, in the order the theme manager asks for them.
Open the theme manager
The install adds a NECTRAUI group to the admin sidebar. Theme Settings is the manager, at /admin/settings/theme. It opens on General, and on a panel nobody has touched every field in it is empty.
Two things before you touch anything
Work down the manager
These are the published settings behind the demo panel, read out of its database and laid out in the order the theme manager asks for them. Work down the sections and you land in the same place.
General · Panel identity
Name it and hand it your logos
The panel name replaces Pterodactyl in the page title and everywhere the panel names itself. Both logos are uploads, and the default mode further down decides which one a visitor meets first.
- Panel name
- NectraUI
- Copyright line
- NectraUI x Pterodactyl
- Copyright link
- https://nectraui.com
- Logo for the dark theme
- Uploaded image
- Logo for the light theme
- Uploaded image
General · Panel defaults
Pick the mode and the type
Ten fonts ship with the theme and the panel serves them itself, so nothing is fetched from a font host.
- Default mode
- Dark
- Font
- IBM Plex Sans
General
Two switches at the foot of General
Blurring addresses hides them until a user hovers; they stay in the page and in the API either way. The update check is an hourly read of the version file that sends nothing about your panel.
- Blur addresses and IPs
- On
- Check for NectraUI updates
- On
SEO
Favicon, share image and crawlers
The demo is meant to be found, so indexing is on. Most panels want it off.
- Favicon
- Uploaded image
- Share image
- Uploaded image
- Let search engines index this panel
- On
Layout · The frame
The shell, the material and the background
This is where the panel takes its shape. Floating shows a background best and gives up 24 px of content width for it. The wash and blur sliders only appear once an image is set, and they are what keep the text readable over a photo.
- Chrome shape
- Floating
- Nav item style
- Tint
- Surface material
- Subtle
- Panel background
- Uploaded photo
- Background wash
- 60 percent
- Background blur
- 10 px
Layout · The server list
The first page a user lands on
One per row gives a tile the width to print a full address. A phone always gets one whatever you choose.
- Page header
- Greeting
- Server card shape
- Tile
- Servers per row
- One
Layout · Dashboard card
A card of links under the servers
The heading is free text and each link is a label with a URL. The demo carries two of them.
- Show the dashboard card
- On
- Card heading
- Need a hand?
- Links
- Two
- Card layout
- List
- Open links in a new tab
- On
Layout · The sign in page
The page nobody signed in ever sees
The preview frame cannot draw this one, because you are signed in inside it. Open a private window after publishing and look at it there.
- Sign in layout
- Split
- Sign in background
- Uploaded photo
Layout · Panel chrome
What sits beside the account menu
Each switch puts a control in the topbar and lets a user override your default in their own browser.
- Theme switcher
- On
- Language switcher
- On
Eggs
Egg banners are in Eggs, not Layout
The toggle sits in the Eggs section, beside the banner for every installed egg. The demo leaves it off.
- Egg banners
- Off
Nothing in that list touches Colours. The demo runs the palette the theme ships with, so you can leave the section alone and come back to it once the shape is right.
Publish it
Publish saves the draft and makes it the live theme for every user immediately. Until you press it, your users keep seeing whatever was published before.
Try it yourself at panel.nectraui.com with the account demo / demo.