Support » Plugin: Ultimate Member - User Profile & Membership Plugin » Allow UM CSS Customization

  • It seems this issue has been raised many times before, with no real answer from the Ultimate Member team…
    There needs to be a way for developers to customize page styles on Ultimate Member pages.

    The overuse of !important tags by UM devs, and the inability to override Ultimate Member CSS files in my theme (e.g. /themes/my-theme/ultimate-member/templates/um.min.css) are infuriating. There isn’t even a working option to disable UM CSS globally. The “um_disable_dynamic_global_css” filter hook in the UM documentation doesn’t work, not in the current stable version (1.3.88), not in the latest beta (2.0.2).

    I’m not going to waste anyone’s time with what specifically, rather this issue as a whole should be addressed. I have never encountered a plugin that makes it so difficult for its advanced users to make necessary style changes.

    Re:
    https://wordpress.org/support/topic/how-to-make-child-theme-override-ultimate-members-css/
    https://wordpress.org/support/topic/stop-using-important-in-your-css/

Viewing 15 replies - 1 through 15 (of 34 total)
  • I have the same issue here. While Ultimate Member seem to provide all the needed functionality, I can’t find a way to safely change the style of the forms.

    The site I’m developing is based on Materialize CSS. How the heck I override Ultimate Member CSS and make my site to look like it’s carved out of one tree?

    The consistent use of !important everywhere has made it so irritating.

    Simple things too, like form elements. I can’t modify the selection items because everything uses !important;

    .select2.select2-container .select2-selection {
        display: block !important;
        height: 40px;
        padding: 0 0 0 12px !important;
        overflow: hidden !important;
        position: relative !important;
        white-space: nowrap !important;
        line-height: 35px !important;
        color: #666 !important;
        font-size: 15px !important;
        text-align: left !important;
        text-decoration: none !important;
        -moz-border-radius: 2px !important;
        -webkit-border-radius: 2px !important;
        border-radius: 2px !important;
        background-clip: padding-box !important;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background: none !important;
        background-color: #fff !important;
        border: 2px solid #ddd !important;
    }

    Please give us a way of overriding the styles. I’d be happy even being able to turn them off!

    wow ultimate member staff really don’t care. No replies.

    I can’t support this in any way, but this works for me. In the comment, you’ll see the list of all of the stylesheets you can dequeue. At the bottom, you’ll see I have a bunch set up to dequeue using wp_dequeue_style('um_default_css');

    Hope this helps.

    /*--------------------------------------------             
    
    Dequeue Ultimate Member stylesheets 
    ---------------------------------------------*/
    
    $um_priority = apply_filters( 'um_core_enqueue_priority', 100 );
    add_action( 'wp_enqueue_scripts',  'gbfl_dequeue_um_scripts', $um_priority + 1);
    function gbfl_dequeue_um_scripts() {
    	/*
    	 *	Fonticons
    	 *		um_fonticons_ii
    	 *		um_fonticons_fa
    	 *	
    	 *	Select2
    	 *		select2
    	 *	
    	 *	Modal
    	 *		um_modal
    	 *	
    	 *	Plugin CSS
    	 *		um_styles
    	 *		um_members
    	 *		um_profile
    	 *		um_account
    	 *		um_misc
    	 *	
    	 *	File Upload
    	 *		um_fileupload
    	 *	
    	 *	Datetime Picker
    	 *		um_datetime
    	 *		um_datetime_date
    	 *		um_datetime_time
    	 *	
    	 *	Raty
    	 *		um_raty
    	 *	
    	 *	Scrollbar
    	 *		um_scrollbar
    	 *	
    	 *	Image Crop
    	 *		um_crop
    	 *	
    	 *	Tipsy
    	 *		um_tipsy
    	 *	
    	 *	Responsive
    	 *		um_responsive
    	 *	
    	 *	RTL
    	 *		um_rtl
    	 *	
    	 *	Default CSS
    	 *		um_default_css
    	 *	
    	 *	Old CSS
    	 *		um_old_css
    	 */
    	wp_dequeue_style('um_default_css');
    	wp_dequeue_style('um_responsive');
    	wp_dequeue_style('um_styles');
    	wp_dequeue_style('um_profile');
    	wp_dequeue_style('um_account');
    	/*wp_dequeue_style('um_members');*/
    	wp_dequeue_style('um_misc');
    	wp_dequeue_style('um_old_default_css');
    	wp_dequeue_style('um_old_css');
    }

    In case people weren’t aware, this should be added to the functions.php file in your theme.

    This is too complicated just to make some simple css changes like padding, font size and colour. There’s no solution for users to do this?

    The only way to do it is to dequeue the UM stylesheets and add your own. At this time, because they use !important anything, you essentially must remove their styles to add your own.

    bonomonster

    (@bonomonster)

    Is there a walk through somewhere to show how to do this? I’ve been seeing people everywhere having this same issue.

    I am building a site using the free version of UM and Elementor pro. The lack of support by UM about this and another issue im having is a little concerning. I had every intention of upgrading to the pro version, however lack support and basic features has me second guessing.

    Norm1

    (@norm1)

    Open up your functions.php file locating in your theme directory:

    Copy all of that above to the bottom of the functions.php file.

    The list in the comments is the list of all of the css files that UM creates.

    This code dequeues the particuar file that is causing you issues:

    wp_dequeue_style('um_default_css');

    In my case, it was most of them. Just copy and paste it, changing the part with ‘um_default_css’ to any of the ones above, like ‘um_styles’ or ‘um_members’

    bonomonster

    (@bonomonster)

    Awesome…. thanks… ill try that

    Norm1

    (@norm1)

    If you have need of any clarification, let me know. I might be able to help. (Sorry about the typo of ‘location’ vs ‘located’)

    onefinaleffort

    (@onefinaleffort)

    I can’t believe they would shoot themselves in the foot and destroy their own business. Most won’t have a clue to customise this.

    bonomonster

    (@bonomonster)

    Yea, I dont understand it either. It has the potential to be a killer program, and its already pretty good. I wish the UM team would see this and understand our frustration. When you’re making your site look professional, cosmetics are just as important as functionality.

    onefinaleffort

    (@onefinaleffort)

    I guess they’re not serious in replacing the hideous buddy press. It was a seriously stupid/retarded/suicide move. They really don’t care. They don’t even reply.

    bonomonster

    (@bonomonster)

    Adding the above code worked for me also. It broke everything up so I can customize it the way I want. Now I just need to learn CSS to do that.

    I really, really wish UM was integrated into Elementor. Maybe in the future….🙏

Viewing 15 replies - 1 through 15 (of 34 total)
  • You must be logged in to reply to this topic.