CTA buttons help you turn engagement on your Walls.io social wall into clicks. If you want those buttons to match your brand more closely, you can style them with custom CSS in Setup > Design.
In the example below, the CSS updates the default CTA button colors, typography, and hover state.
.checkin-buttons .checkin-cta {
border: none;
background: #6C6463;
color: white !important;
font-weight: 600;
text-transform: uppercase;
border-radius: 6px;
display: inline-block;
transition: all 0.3s ease 0s;
}
.checkin-buttons .checkin-cta:hover {
color: #7cc6f2 !important;
font-weight: 700 !important;
letter-spacing: 3px;
background-color: white;
-webkit-box-shadow: 0px 5px 40px -10px rgba(108,100,99,0.6);
-moz-box-shadow: 0px 5px 40px -10px rgba(108,100,99,0.6);
transition: all 0.3s ease 0s;
}
.checkin-cta::after {
border: none;
}
The customized call-to-action buttons will appear underneath some posts👇
🔎 Please note: This styling appears only on posts that already have a CTA button configured.
If you still need to add CTA buttons to your posts, see How to add a CTA button to a social media post.
In case you have further questions, don't hesitate to contact the support team via chat or support@walls.io!