2. Custom CSS
Website → Website Tools → Custom CSS:
/* Lay the two buttons out side-by-side, with a gap */
.header-actions-action.header-actions-action--cta {
display: flex;
align-items: center;
gap: 0.75rem;
}
/* Optional: give button 2 a distinct look (outline style shown here) */
.second-header-button {
background: transparent !important;
border: 1px solid currentColor !important;
color: inherit !important;
}
/* Mobile: stack buttons full-width, add spacing */
@media (max-width: 767px) {
.header-actions-action.header-actions-action--cta {
flex-direction: column;
gap: 0.5rem;
}
.second-header-button {
width: 100%;
text-align: center;
}
}
