Product List: How to Remove the Word Free and Total Using Custom CSS Codes

Hi Sarah,

To remove the Free text and Total texts on your product list, you can add the following custom CSS codes below into your form CSS code injector.

/*Hide "Free" text*/

span[id^="input_43_"][id$="_price"] {

  display: none !important;

}



/* Hide currency symbols if visible */

span.freeCurr {

  display: none !important;

}



/* Hide the entire "Total" area at the bottom */

.payment_footer.new_ui {

  display: none !important;

}

Here's the sample result after adding the custom CSS codes:

Give it a try and let us know how it goes.

This is perfect! Thank you!

Hi Sarah,

I've moved your other question to a new thread and will be helping you out here.

Let us know if you have any other questions.

Thank you!

How do I replicate the layout on mobile as on desktop? The layout on desktop and tablet is perfect and the mobile version is very difficult to navigate.

Hi Sarah,

I understand you’d like the layout of your form on mobile to match the look and feel you see on desktop and tablet.

To better assist you, could you please share some screenshots showing how the form appears on mobile versus desktop? This will help us understand exactly which parts of the layout are not displaying as expected.

Also, can you confirm if one of the difficulty you’re experiencing looks similar to the one shown in the screenshot below?

To fix it, inject the following CSS code to your form.

@media screen and (max-width:600px) { 

.form-product-item.new_ui {

width: 100%!important;

margin: 0px;

}

}

Your CSS code would looks like something like this.

Here's a screenshot of the result, and a demo form that you can check out.

Give it a try, and let us know if there's anything else we can help you with.

This is how my form looks after I embedded it on wix. This is the mobile version. I will try your code you sent but I would really like to replicate the form as it appears that is on desktop to the mobile... if possible

Hi Sarah,

Thank you for sharing that information. I understand you’d like your embedded form on Wix to look exactly the same on mobile as it does on desktop. Due to the responsive design, some elements adjust automatically to fit smaller screens, but we can definitely try to get it as close as possible.

Could you please share the live production website URL you created using Wix? This will help us provide more accurate CSS or layout suggestions.

Also, please let us know once you’ve tried the code, and if it doesn’t achieve the look you’re aiming for, we’ll be glad to help with further adjustments.

Hi Sarah,

To avoid confusion, I moved your other question to a new thread and helped you with that here.

Let us know if you have any other questions.