Skip to main content

How to change the color of the "Create Post" Button & QR Code?

How can I change the colors of the Create Post button?

Written by Michael Kamleitner
Updated over 2 weeks ago

You can customize the color of the Walls.io Create Post button and its QR code with custom CSS. This is useful if you want the Direct Posts experience to match your brand colors more closely. To add these changes, open Setup > Design and paste the relevant snippet into your custom CSS area.

How to change the Create Post button background color

Use this snippet if you want the main Direct Posts button to match your brand color more closely. In this example, the button background is changed to orange, including the hover state.

#createPostButton { 
background-color: #fbbc56;
}
#createPostButton:hover {
background-color: #fbbc56;
box-shadow: 0 0 0 2px orange;
}

How to change the Create Post button text color

Use this snippet to improve readability or align the button text with your brand palette. In this example, the button text is changed to black.

#createPostButton { 
color: #000000;
}

How to change the QR code color

Use this snippet if you want the QR code shown for Direct Posts to better match your design. In this example, the QR code color is changed to black.

#createPostButton svg path:nth-of-type(2) {
fill: #000000 !important;
}

In case you have further questions, don't hesitate to contact the support team via chat or support@walls.io!

Did this answer your question?