Forminator styles issue

Hi @semidivine

I hope you are doing well.

The Design style = none will remove any style from the plugin and inherit it from the theme, but I am not sure if I understood the issue.

I checked the shared page and it uses the “default” design so it will always use and generate the Form style, I also don’t see any mixed content warning which means the proper style is being applied.

https://monosnap.com/file/1UVAhhu6lH6OOCbpdG2JdhJazgcUAF

Could you switch back to Form > Appearance > Style none?

Let us know once you switch back to “None”,

Best Regards
Patrick Freitas

Hi Patrick, thanks for replying.

I’m sorry I must have explained the situation unclearly. What I am asking is how to unenqueue any stylesheets that are autogenerated by your plugin in my uploads directory.

These are your styles that are loaded by your plugin in the footer of the page:

<link id="forminator-module-css-276-css" href="/wp-content/uploads/forminator/276_eed77a053e063ebb55fa9aba8ae60249/css/style-276.css">

<link id="forminator-icons-css" href="/wp-content/plugins/forminator/assets/forminator-ui/css/forminator-icons.min.css">
<link id="forminator-utilities-css" href="/wp-content/plugins/forminator/assets/forminator-ui/css/src/forminator-utilities.min.css">
<link id="forminator-grid-default-css" href="/wp-content/plugins/forminator/assets/forminator-ui/css/src/grid/forminator-grid.open.min.css">
<link id="forminator-forms-default-base-css" href="/wp-content/plugins/forminator/assets/forminator-ui/css/src/form/forminator-form-default.base.min.css">
<link id="intlTelInput-forminator-css-css" href="/wp-content/plugins/forminator/assets/css/intlTelInput.min.css">

The last 5, which load from your plugin (/plugins/forminator/assets/) are all good.

The first one, which is the only one that loads from my uploads directory (/uploads/forminator/), and is autogenerated, is the one causing the problem. I know it is autogenerated because I deleted it from my uploads directory and your plugin recreated it.

When I first installed Forminator locally I didn’t realize my WordPress site url was http. I saw the error “Forminator’s CSS style cannot be loaded because your website’s address is configured in WordPress to use HTTP instead of HTTPS. This may cause some web content, including Forminator forms, to display incorrectly” in the Forminator admin but I ignored it because the forms were looking great. The only stylesheet that was not loading because of not being on HTTPS was the one in the /uploads directory.

I spent a lot of time tweaking the form based on those original styles.

Then I realized my local site url was HTTP so I switched it to HTTPS and that /uploads directory stylesheet messed up my form. I tested all your built in style options Design Style > Default to Design Style > None and they all mess up my form.

I found the code in your plugin that was enqueueing that style (in /plugins/forminator/library/render/class-assets-enqueue.php, line 115):

/**
    * Load relevant module CSS
*/
protected function load_module_css() {
    if ( ! empty( $this->model->id ) && ! is_admin() ) {
        $id = $this->model->id;
        $timestamp = ! empty( $this->model->raw->post_modified_gmt )
            ? strtotime( $this->model->raw->post_modified_gmt )
            : wp_unique_id();

    // Module styles.
    wp_enqueue_style(
        'forminator-module-css-' . $id,
        self::get_css_upload( $id, 'url', true ),
        array(),
        $timestamp
    );
}

I know this is the code correct code snippet because I commented it out and that restored my original styles (and didn’t break the plugin!) Obviously it is unsustainable to comment out plugin code, I could never update your plugin.

The answer is to unenqueue this stylesheet in my theme’s functions.php, but I am having a hard time doing that with yours. Can you help?

Hello @semidivine,

Thank you for the detailed explanation.

Please try using the following code in functions.php (or in a separate PHP file in /wp-content/mu-plugins/ directory):

add_action( 'wp_enqueue_scripts', 'wpmudev_dequeue_custom_style', 11 );
function wpmudev_dequeue_custom_style() {
	wp_dequeue_style( 'forminator-module-css-276' );

}

Let us know if you need any further assistance.

Best Regards,
Dmytro

Thank you Dmytro, I have tried something similar and it didn’t work. I will try your code and report back.

Hi @semidivine

We didn’t hear back from you for quite a while so I’m assuming Dmytro’s solution worked.

I’m marking this topic as resolved them but if it’s not and you still need assistance with this issue, please let us know and we’ll be ready to get back to it.

Kind regards,
Adam