Articles on: User Interface & Modules

Helpful CSS adjustments

You can fine-tune the appearance and layout of the Chamevo product designer with a few simple CSS rules. Below are some useful adjustments you can copy and paste into your theme’s custom CSS.


Show Extra Price on Done button in Customize Button Mode


Use this to show the extra price you are charging for the customization on the Done button when the product designer is in the Customize Button mode.

.fpd-modal-product-designer .fpd-container fpd-actions-bar .fpd-done span.fpd-total-price {
display: inline-flex !important;
}



Hide QR-Code Tab in Images Module


If you don’t want the QR-Code tab to appear in the image upload module, use this:


fpd-module-images .fpd-module-tabs [data-context="qr-code"] {
display: none !important;
}



Change the color of the designer outside of the canvas


You can use this code to change the color of the background outside of the canvas, but within the designer.


.fpd-container>fpd-main-wrapper {
background: #fff !important; (adjust the color hex code to match the color you want to show)
}


With these CSS adjustments, you can better control the look and feel of the product designer, ensuring it matches your shop’s design.


If you habe questions or other adjustments in mind that you don't know how to make, reach out to us in the in-app chat.

Updated on: 07/01/2026

Was this article helpful?

Share your feedback

Cancel

Thank you!