no longer able to have separate CSS styles with latest update

Resolved 4now
(@4now)

2 years, 7 months ago

Hi

After the latest update any CSS changes I make to the desktop homepage also changes the CSS of the mobile version, and visa versa. I’m no longer able to have separate CSS styles for desktop and mobile. WPBakery allows for page specific CSS styles, available in page edit mode.

Any idea why this might be happening?
Thanks

The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

Plugin Author

(@giuse)

theoretically, versions 0.1.8 and 0.1.8.1 have nothing different that could have an impact on the page custom CSS provided by WPBakery.

In Specific Content For Mobile => Metadata synchronization, check the synchronization between desktop and mobile.

Have you maybe changed that option?

If you want, here you have the code to add an option especially for the page custom CSS of WPBakery:

add_filter( 'eos_scfm_meta_integration_array','my_vc_meta_integration',20,2 );
//It adds an option to synchronize VisualComposer custom CSS meta data.
function my_vc_meta_integration( $arr,$options ){
    $slug = '_wpb_post_custom_css';
    $arr[$slug] = array(
        'is_active' => defined( 'WPB_VC_VERSION' ),
        'args' => array(
            'title' => __( 'VisualComposer Page CSS','my-textdomain' ),
            'type' => 'select',
            'value' => isset( $options[$slug] ) ? esc_attr( $options[$slug] ) : 'synchronized',
            'options' => array(
                'synchronized' => __( 'Synchronize desktop and mobile metadata','my-textdomain' ),
                'separated' => __( 'Allow mobile versions having their own metadata','my-textdomain' )
            ),
        ),
        'prefix' => array( '_scfm_vc_page_css' ),
        'default' => 'synchronized'
    );
    return $arr;
}

After adding that code in the functions.php of your child theme you should see the option “VisualComposer Page CSS” in settings of Specific Content For Mobile. Select “Allow mobile versions having their own metadata”.

Let me know if it works.

Thread Starter

4now

(@4now)

2 years, 7 months ago

I did have meta synchronization enabled, because I thought that was best. When disabled I’m able to create mobile specific CSS.

I added the above code to functions and your new setting appeared. But setting that to ‘VisualComposer Page CSS: Allow mobile versions having their own metadata’
alone did not work. I still needed to disable ‘General metadata
synchronization’ as well.

Thanks

Plugin Author

Jose

(@giuse)

2 years, 7 months ago

Hi @4now

sorry, it was an error in the code I provided in my previous comment.

Please, replace it with this:

add_filter( 'eos_scfm_meta_integration_array','my_vc_meta_integration',20,2 );
//It adds an option to synchronize VisualComposer custom CSS meta data.
function my_vc_meta_integration( $arr,$options ){
    $slug = 'wpb';
    $arr[$slug] = array(
        'is_active' => defined( 'WPB_VC_VERSION' ),
        'args' => array(
            'title' => __( 'VisualComposer Page CSS','my-textdomain' ),
            'type' => 'select',
            'value' => isset( $options[$slug] ) ? esc_attr( $options[$slug] ) : 'synchronized',
            'options' => array(
                'synchronized' => __( 'Synchronize desktop and mobile metadata','my-textdomain' ),
                'separated' => __( 'Allow mobile versions having their own metadata','my-textdomain' )
            ),
        ),
        'prefix' => array( '_wpb_post_custom_css' ),
        'default' => 'synchronized'
    );
    return $arr;
}

I’ve right now tested with WPBakery and it works for me.

Let me know if you still have the same issue.

Thread Starter

4now

(@4now)

2 years, 7 months ago

Great it works 🙂

Plugin Author

Jose

(@giuse)

2 years, 7 months ago

Perfect! I’m happy that it works.