Custom Fields
Re-Envisioned
Support MB Settings Page Metabox settings page / color picker / css variables / Oxygen

  • Creator
    Topic
  • #30731
    Sash
    Participant

    How i can use css variables with MB settings page and color picker to use in the Oxygen colors fields? Is this possible on the metabox side? This is a solution related to Oxygen builder and ACF Pro Option Page from wpdevdesign? Metabox ist very different then ACF and confusing mit a little bit (I'm only semi pro Dev)

    acf-color-picker-custom-fields-to-css-custom-properties-workflow-in-oxygen

Viewing 3 replies - 1 through 3 (of 3 total)
  • Author
    Replies
  • #30755
    Long Nguyen
    Moderator

    Hi,

    The developers of WPDevDesign mark the content private so I cannot follow how they do. They could use custom code to create the variable CSS like that. You can try to contact them to do the same with Meta Box.

    #30756
    Sash
    Participant

    Some Friends send me the code... The Problem is more, that Metabox works in a other way. Im new in the metabox community und buyed the Dev licence couple days ago. My Questions to you was, how we can do this with Metabox. Thx

    add_action( 'wp_enqueue_scripts', 'custom_css' );
    /**
     * Set custom CSS variables using values from ACF options page.
     */
    function custom_css() {
    
        $primary_color = get_field( 'primary_color', 'option' );
        $secondary_color = get_field( 'secondary_color', 'option' );
        $light_gray = get_field( 'light_gray', 'option' );
        $main_dark = get_field( 'main_dark', 'option' );
        
        $custom_css = "
            :root {
                --primary-color: {$primary_color};
                --secondary-color: {$secondary_color};
                --light-gray: {$light_gray};
                --main-dark: {$main_dark};
            }";
    
        wp_add_inline_style( 'oxygen', $custom_css );
    
    }
    #30772
    Long Nguyen
    Moderator

    Hi,

    Thanks, you can do the same with Meta Box. Creating a settings page with custom fields, replace the code from ACF

     $primary_color = get_field( 'primary_color', 'option' );
    

    by this code

    $primary_color = rwmb_meta( 'primary_color', ['object_type' => 'setting'], 'your-option-name');
    

    Get more details on this documentation https://docs.metabox.io/extensions/mb-settings-page/

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