c0ry wants to create a universal header/sidebar for their entire domain and provided an example from https://discourse.aurelia.io/. awesomerobot explained that the aurelia.io site achieved this by duplicating their nav bar within Discourse, and suggested the following steps: create the main site, set up Discourse, and create a matching theme in Discourse.
c0ry mentioned that their site is built on Bootstrap, making it challenging to convert to Discourse’s CSS. awesomerobot advised that knowing HTML and CSS is necessary to recreate the nav in Discourse, but suggested an alternative route using a pre-built theme component, such as the Brand Header theme component.
c0ry asked if it’s possible to move the header to the side and considered hard-coding it into the theme for simplicity.
I’m trying to have a header/side bar that is universal between my entire domain.
This is kind of the idea I’m looking for: https://discourse.aurelia.io/
If you notice, the links on the left go to different pages and I want to be able to accomplish something like-so.
I’m not the best at HTML, nor CSS, but given the right path, I will find a way.
There’s a slight illusion here — they didn’t create one nav bar to use universally, they’ve created the nav bar on their site (aurelia.io) and then duplicated it within their Discourse site (https://discourse.aurelia.io/) so it looks identical.
So the steps would be:
Some resources for building Discourse themes:
Beginner's guide to using Discourse Themes
Developing Discourse Themes & Theme Components
Problem is, my site is built on Bootstrap…
So in terms of converting it to discourses css, is a little tough for me.
Unfortunately it’s the only way we support, you’ll need to know enough HTML & CSS to recreate your nav in Discourse.
You could potentially go the opposite route (which might be a little simpler) and use a pre-built theme component in Discourse like Brand Header… and then match your main site’s nav to Discourse. But then of course if you wanted to customize the look of the nav further than what that theme component contains, you’d need to know some HTML & CSS.
Can I take that header and move it to the side?
edit I know it’s possible, but wouldnt it be easier to just hard code it into the theme?