Mautic Community Forums

Prevent default styles/css

Hello,



I am using the hosted version of Mautic and am trying to prevent the default styles being added:



.mauticform_wrapper {}
.mauticform-innerform {}
.mauticform-post-success {}
.mauticform-name { font-weight: bold; font-size: 1.5em; margin-bottom: 3px; }
.mauticform-description { margin-top: 2px; margin-bottom: 10px; }
.mauticform-error { margin-bottom: 10px; color: red; }
.mauticform-message { margin-bottom: 10px;color: green; }
.mauticform-row { display: block; margin-bottom: 20px; }
.mauticform-label { font-size: 1.1em; display: block; font-weight: bold; margin-bottom: 5px; }
.mauticform-row.mauticform-required .mauticform-label:after { color: #e32; content: " *"; display: inline; }
.mauticform-helpmessage { display: block; font-size: 0.9em; margin-bottom: 3px; }
.mauticform-errormsg { display: block; color: red; margin-top: 2px; }
.mauticform-selectbox, .mauticform-input, .mauticform-textarea { width: 50%; padding: 0.2em 0.2em; border: 1px solid #CCC; box-shadow: 0px 1px 3px #DDD inset; border-radius: 4px; box-sizing: border-box; }
.mauticform-checkboxgrp-row {}
.mauticform-checkboxgrp-label { font-weight: normal; }
.mauticform-checkboxgrp-checkbox {}
.mauticform-radiogrp-row {}
.mauticform-radiogrp-label { font-weight: normal; }
.mauticform-radiogrp-radio {}


I can stop these styles being used via the Manual Copy as I can strip them out there - but I don't want to have to update this every time I make a change to the form. I noticed in the WordPress plugin that there is a Render Style option (yes/no) but that option does not appear on my version.

Any ideas how to prevent the styles from being used?

Thanks,

Dan

Hello,

I am using the hosted version of Mautic and am trying to prevent the default styles being added:

.mauticform_wrapper {} .mauticform-innerform {} .mauticform-post-success {} .mauticform-name { font-weight: bold; font-size: 1.5em; margin-bottom: 3px; } .mauticform-description { margin-top: 2px; margin-bottom: 10px; } .mauticform-error { margin-bottom: 10px; color: red; } .mauticform-message { margin-bottom: 10px;color: green; } .mauticform-row { display: block; margin-bottom: 20px; } .mauticform-label { font-size: 1.1em; display: block; font-weight: bold; margin-bottom: 5px; } .mauticform-row.mauticform-required .mauticform-label:after { color: #e32; content: " *"; display: inline; } .mauticform-helpmessage { display: block; font-size: 0.9em; margin-bottom: 3px; } .mauticform-errormsg { display: block; color: red; margin-top: 2px; } .mauticform-selectbox, .mauticform-input, .mauticform-textarea { width: 50%; padding: 0.2em 0.2em; border: 1px solid #CCC; box-shadow: 0px 1px 3px #DDD inset; border-radius: 4px; box-sizing: border-box; } .mauticform-checkboxgrp-row {} .mauticform-checkboxgrp-label { font-weight: normal; } .mauticform-checkboxgrp-checkbox {} .mauticform-radiogrp-row {} .mauticform-radiogrp-label { font-weight: normal; } .mauticform-radiogrp-radio {}

I can stop these styles being used via the Manual Copy as I can strip them out there - but I don’t want to have to update this every time I make a change to the form. I noticed in the WordPress plugin that there is a Render Style option (yes/no) but that option does not appear on my version.

Any ideas how to prevent the styles from being used?

Thanks,

Dan

Maybe the solution from https://www.mautic.org/community/index.php/754-form-css-in-wordpress/p1#p2960 will work for you.