Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Exclude confusion - how to exclude if element has ANY value #2491

Open
codejp3 opened this issue Sep 22, 2022 · 2 comments
Open

Exclude confusion - how to exclude if element has ANY value #2491

codejp3 opened this issue Sep 22, 2022 · 2 comments

Comments

@codejp3
Copy link

codejp3 commented Sep 22, 2022

Issue description:

Can't figure out how to exclude child elements if it has ANY value.

The use-case is setting a default color for all item headings (h1, h2, h3, etc) in kirki to apply to all heading tags within the content of a custom post type called "items", but allowing that default color to be overwritten if a specific color is applied to any child heading tag within the gutenberg editor content blocks (no specific path/pattern to target), on a per-heading case and only if the heading has a color specified within gutenberg.

The default heading color is applied to each heading tag just fine. I can exclude a specific heading tag that's at the parent-level html tag being targeted (section tag). What I can't figure out is how to exclude the child heading tags within the parent section tag, but only if they have ANY value set for "color". Kirki over-rides the specified custom heading color set on a per-heading tag basis. I want it the other way around where kirki is the default, and whatever is specified in the post content styling will override it.

There's no distinct element ID or class to target for each child heading (client site and they can add heading tags free-form as they see fit). There's no exact xpath to target because where/how they add headings can vary greatly between posts. The heading could be a generic heading block in gutenberg, or it could be within any number of custom block types/containers holding that heading.

At a loss for what to exclude. Only other option I can come up with is to hook into "save_post", dynamically generate unique IDs for any heading tag within the post content, save those generated IDs as a meta field, and then merge them with the kirki output exclude array. Gotta be a better way to do this, and I'm probably just missing something.

Thanks for any input!

Version used:

4.0.21

Using theme_mods or options?

theme_mods

Code to reproduce the issue (config + field(s))

// generated per post entry of a custom post tpye within the loop on the backend inside customizer

    new \Kirki\Field\Color(
	[
            'settings'    => 'item_'.$post->post_slug.'_heading_color',
            'label'       => __( 'Item '.$post->post_name.' Heading Color', 'kirki' ),
            'tooltip' => esc_html__( 'Change the default color for the '.$post->post_name.' item headings.', 'kirki' ),
            'section'     => 'items_panel_'.$post->post_slug.'_colors_section',
            'default'     => 'rgba(255,255,255,1)',
            'choices'     => [
                'alpha' => true,
            ],
            'output' => array(
                array(
                    'element'  => array( 'section#'.$post->ID.' h1', 'section#'.$post->ID.' h2', 'section#'.$post->ID.' h3', 'section#'.$post->ID.' h4', 'section#'.$post->ID.' h5', 'section#'.$post->ID.' h6'),
                    'property' => 'color',

                    // this works fine, excluding a specific ID of a child-level heading tag within the parent section tag
                     'exclude' => array(  'h1#section-'.$post->post_slug.'-main-title' ),
                     
                     // how can I exclude ANY child heading tag that has ANY value set for color, regardless of element ID/class/xpath?
                      'exclude' => array(  ???? Don't know what to put here ????? ),
                )
            ),
	]
    );
@codejp3
Copy link
Author

codejp3 commented Oct 3, 2022

I took a look at the code handling exclusions (Output.php, currently around line 200).

In order to accomplish the task - "exclude if child elements have ANY value", I'd have to check for a value for each child element, and if it does have a value, specify that specific value as the exclusion, and on a per-child element basis. Not as simple and straightforward as I was hoping for.

Wishlist - being able to use the bool "true" as the exclusion, with "true" meaning ANY value for the CSS selector being targeted, and then only applying the Kirki value if the CSS selector being targeted is ' ' (empty / no value).

@codejp3
Copy link
Author

codejp3 commented Oct 3, 2022

Additional info on use-case:

I know I'm using Kirki in a non-standard/non-traditional way, but the application of it isn't so unusual.

Remember the MySpace days where a default style was provided, but with a few code snippets, you could tweak your MySpace page to appear however you wanted? That's essentially what I'm making for a client. The custom post type "Items" is like profile page items. The Kirki styling is the default styling for each individual "Item" (post type entry). Users can use visual editors to create whatever content they want for each "Item". The Kirki styling (specified by the site owner, and on a per-item basis) applies to the user's "item entries", except when/where they specify their own custom styling within the visual editors.

Just some info that may help clear up what I'm trying to accomplish, and why I posted my wishlist addition above. Hope that helps clear it up a little.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant