Below the Toolbox, you’ll see the Properties Panel, where you edit the styling and behaviour of your components.

Select the Button you just added to the page, and change the text to ‘Add an article’.

The Properties panel with 'add an article' in the 'text' property.

Next, change the Button’s name. Click on the red text that says self.button_1 at the top of the Properties Panel, and change it to add_article_button. We’re changing the name of our Button to make it easier to identify from code.

The Properties panel with 'add_article_button' in the 'name' property.

Change the role to ‘primary-color’.

The Properties panel with 'primary-color' in the 'role' property.

Then, in the ‘Icon’ section of the Properties Panel, add an icon to the Button by clicking the Icon image. This allows you to search for an icon to use. I’m using plus-circle in this example.

The Properties panel with 'plus-circle' in the 'icon' property.

With those changes applied to its properties, the Button looks like this:

The final button, with text added, blue background, and icon.