Articles on: Features

Newspage Code Injection (CSS, HTML, JS) 🖌️

Noticeable allows customizing styles and content for Newspages. You can edit styles with Cascading Style Sheets (CSS) or inject HTML and JavaScript (JS).

Injecting Code in a Newspage

Open a project from the Noticeable dashboard.
Select Newspage in the left menu.
Click on the Code Injection settings group.
Type the code you want to inject, select where to inject it (after <body>, after <head>, before </body> or before </head>) and click Save & View:

Usage Examples

Increasing the font size

<style>
    body {
        font-size: 120%;
    }
</style>

Adding a colorful banner on top of your Newspage

<style>
    body {
        border-top: 5px solid $project_accent_color;
    }
</style>

You can use the special keyword $project_accent_color to get the accent color (hexadecimal color code) corresponding to the current project. It is automatically replaced by the right value when your CSS is injected into your Newspage.

Making labels monochrome

<style>
    .label {
        background-color: #777 !important;
    }
</style>

Updated on: 02/06/2021

Was this article helpful?

Thank you!