nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Developing confluence pages

Cherry Cwalina

My confluence version is in my work site.

I'm trying to 'beautify' and upgrade my confluence page.

I see on youtube tutorials that there's a built-in template confluence offers but I don't see that feature in my confluence page. There is also an option for 'header image' that I see on the tutorial video that I don't see.

How do I get this installed in my version of confluence?

Our confluence admins don't seem to have a clue.

Thank you so much for your help.

Cherry Cwalina

Accepted answers

unknown

Hey @Cherry Cwalina , from the tags, I am unsure if you use Confluence Cloud or Data Center. Can you specify?

Kristian Klima_gtcuat

Hi @Cherry Cwalina and welcome to the Community.

Your options would depend on what Confluence type you have.

You can have a Data Center version, or a Cloud version. Now, based on '

There is also an option for 'header image' that I see on the tutorial video that I don't see'

you are Data Center. But I admit that's just a deduction.

Anyway, on Data Center Confluence, you can modify the overall CSS or use an app such as Scroll Viewport by k15t which will completely change the look and feel of your Confluence site (while it can also add more features).

If you are on Cloud, you have to use an app - the aforementioned Scroll Viewport will work too. For example, this is my company documentation site built from Confluence content using Viewport - https://docs.emplifi.io/

Other than that, you can use a theme app that, modifies the look and feel of your site. Examples include Spacecraft by Seibert Group ( @[deleted]will tell you more), Refined by Refined, ...

All comments

unknown

Hey @Cherry Cwalina , from the tags, I am unsure if you use Confluence Cloud or Data Center. Can you specify?

Kristian Klima_gtcuat

Hi @Cherry Cwalina and welcome to the Community.

Your options would depend on what Confluence type you have.

You can have a Data Center version, or a Cloud version. Now, based on '

There is also an option for 'header image' that I see on the tutorial video that I don't see'

you are Data Center. But I admit that's just a deduction.

Other than that, you can use a theme app that, modifies the look and feel of your site. Examples include Spacecraft by Seibert Group ( @[deleted]will tell you more), Refined by Refined, ...

Cherry Cwalina

@Kristian Klima Thank you so much for your response! I really appreciate it.

Our confluence Admin just said we use 'data center'. Would you explain how 'Scroll viewport' works? Is that a plugin? I really need a more upgraded confluence page to showcase 'onboard training' for incoming employees with links, org charts, etc..I don't need anything super fancy...but fancy enough to catch peoples' attention.

What is 'CSS'? Is Spacecraft an app too?

Cherry Cwalina

@[deleted] we are using Data center! thank you for your kindness!

Kristian Klima_gtcuat

Viewport is an app that you install on your Confluence instance. The idea is that you will work in standard Confluence but your Customers will access your Confluence content through Viewport. You can either use the default theme or modify it.

This is Viewport data center documentation. If you go for the default theme, you can set it up very easily.

https://help.k15t.com/scroll-viewport-data-center/2.23.0/get-started

I'd get in touch with K15t team for more support - I haven't use on-premise Viewport for about 3 years.

CSS is basically an HTML stylesheet - in short, you provide a code that determines how your page is rendered (displayed).

For example, you code in that all Heading 2 instances will be rendered in Comic Sans font, size 40, color yellow And so on and so forth.

Once programmed, you upload the file to Confluence and voila, your Confluence will adopt the new look.

Spacecraft is an app but it's Cloud only.

unknown

Spacecraft is a plug-in as well, however, its only available for Confluence Cloud, @Cherry Cwalina
The app enables you to fully customize/'beautify' the appearance of your Confluence space, making it ideal for achieving a brand-aligned look. This tool is particularly useful if you want your pages to resemble standalone websites, especially when making them publicly accessible to external users. PS: I am a representative of the company that created Spacecraft

@Kristian Klima would be the best resource to address your other queries.

Lotje Euser_nobmhc

Hi Cherry,

Lotje from Refined here, just saw your question and would love to show how our Refined app for Data Center helps you to make Confluence more beautiful.

You can add headers but also fully recreate the design of how Confluence looks and make it feel like it's a website instead of Confluence .

You can watch one of our short demo videos here (choose Data Center as your deployment option) or I can give you a private demo myself.

Happy to show you how it works!

Kind regads,
Lotje

Zoriana Bogutska_Kolekti

Hi @Cherry Cwalina

To the list of options mentioned before, I would add another one - Content Formatting Macros for Confluence

If you need in-depth control over your Confluence DC look, it might be the best solution for you. Its CSS and HTNL macros allow you to customise your Confluence as your team and brand guides require.

If you have any questions please let me know, that app is developed by my team.

Gunjan Jeena

I would consider content blocks and template when designing Confluence pages rather than thinking about web page development in the classic sense. Confluence is more of a collaborative documentation system rather than an HTML/CSS page system, so layouts, tables, macros, templates, and even page structure take care of most needs. It’s also advised by Atlassian that we start with templates and use macros if and where they increase usability.

Where possible, creating templates and standardized sections could save us a huge amount of time and consistency on our pages. We should also make sure that the design is clean and navigation is straightforward before we apply more advanced formatting.

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

confluence

unknown-hosting-type

confluence-unknown-hosting-type