Updating Confluence to Do Inline Code Highlighting

Updating Confluence to Do Inline Code Highlighting

So Confluence 6 supports two forms of code highlighting:

  • In line code formatting via the {{code}} syntax that formats the code in monospace but is not highlighted (transparent background)
    inline code
  • A 'code block' that can be inserted with the {code} tag
    code block

Unfortunately I have gotten used to (and enjoy) the highlighted code that you see here, in Slack, or on GitHub. After many failed attempts and Google searches, I finally got Confluence to do what I want. But as with all things Confluence, it is not simple or intuitive.

Step 1 - Get Access to the sysadmin Account

First you will need to be a sysadmin to change this configuration. Most likely, you did not set up a sysadmin account when you installed Confluence and therefore do not have the password to this account (but it should exist). The guide here walks you through changing the password, but here are the pertinent commands after logging into your server via command line:

sudo -i -u postgres

psql

select u.id, u.user_name, u.active from cwd_user u join cwd_membership m on u.id=m.child_user_id join cwd_group g on m.parent_id=g.id join cwd_directory d on d.id=g.directory_id where g.group_name = 'confluence-administrators' and d.directory_name='Confluence Internal Directory';

This output will show you the ID of the sysadmin user. Now we just need to update the password for that user. The command below will change the password to admin (that is the hash for this password). You could substitute the hash for your own password, or just do this and immediately change it. I was unable to quickly determine the hash type.

update cwd_user set credential = 'x61Ey612Kl2gpFL56FT9weDnpSo4AV8j8+qx2AuTHdRyY036xxzTTrw10Wq3+4qQyB+XURPWx1ONxp3Y3pB37A=='where id=<id from Stage 1>;
[1]

Step 2 - Log in as sysadmin and update your password

This can be found under the Person --> Settings --> Password

Step 3 - Enable Custom Stylesheets for Spaces

The option can be found under the Gear --> General Configuration --> Security Configuration(left side) --> Edit. The checkbox is grayed out for any user except the sysadmin. Check the box and save the configuration.

Step 4 - Update Your CSS Stylesheet

Click on the Stylesheet section on the left side. Click Edit to get the block where we will paste our CSS code. The code we are going to paste came from this Stack Overflow question. If you want the grey style background from StackOverflow use this code:
code { padding: 1px 5px 1px 5px; font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif; background-color: #eeeeee; }
[2]

If you want this style then use this code instead:
code { padding: 1px 5px 1px 5px; font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif; background-color: #eeeeee; color: #d90000 }
You can certainly adjust the colors any way you want [3].

Step 5 - Save and Enjoy

Save the configuration, log out as sysadmin and log back in as your regular user. Anywhere that you have used {{some code}} or use it in the future will now have the desired highlighting.

[1] https://confluence.atlassian.com/doc/restore-passwords-to-recover-admin-user-rights-158390.html

[2] https://stackoverflow.com/questions/13104501/how-to-format-an-inline-code-in-confluence/20487368#20487368

[3] https://www.w3schools.com/colors/colors_picker.asp