A custom “Buy It Now” button within a div is hidden on a Shopify theme; a screenshot shows the div marked as disabled. The store link (kaylakowalski.myshopify.com) was provided for review.
Proposed fix: add CSS to base.css to override a container set to display: none. Suggested code: #payment-button-container { display: block; }. This implies the element was being hidden by theme CSS.
Result: The change did not work for the store owner; the div remains disabled as in the screenshot. They asked how the responder got it visible and requested deeper help or a recreation of the button.
Next steps: The helper sent a Shopify collaborator access request (Admin → Settings → Users and Permissions → Collaborators → BSS Commerce) to inspect settings. The owner initially did not receive it; the request was re-sent with the same instructions.
Status: Unresolved/ongoing. Awaiting collaborator access to investigate why the container remains hidden/disabled beyond the suggested CSS override. Images and the code snippet are central to understanding the issue and attempted fix.
I think your custom Buy It Now button is hidden because the CSS of its container is display: none
Go to Online Store → Theme → Edit Code
Search base.css
Add these lines of code at the end of file base.css:
#payment-button-container {
display: block;
}
Then you will see your custom Buy It Now button appears on your store like this:
