SOLVED: Dynamic colors (Jet Engine)

Hi, I am testing the dynamic colors and I got a couple of errors.

  1. The first is that it does not show the color in the builder. (Something that does not seem serious because in the frontend it shows it correctly.)

  2. The second thing is that using the dynamic colors in a queryloop the values of the last post are put in all the others. Example:



This is my last post and the colors are represented successfully.



This is an earlier post and does not grab your colors, but the one before already mentioned.

  1. And the third problem is that after updating a color using the additional fields, example:

    It doesn’t change the color automatically in the frontend, I have to regenerate my css so it can be changed.

Thank you very much, I hope that in the stable version they can fix at least the last 2 points.

2 Likes

Which version of Bricks are you using?

I am using 1.5.1 RC …

1 Like

Dynamic colors are only available with 1.5.1 RC :wink:

1.5.3 and it still doesn’t work, any answer?

Hello @iFront,

Thank you for your post.

On Bricks 1.5.3:

I cannot reproduce this anymore.

Could you please share with us through help@bricksbuider.io temporary login credentials and a link to the page where this error is happening?

This happens if you use the External Files CSS loading method. I’ve added this to our bug tracker to be fixed in a near future.

thank you
Luis

I’m also experiencing the same issue when trying to get dynamic colours to work.

Tried regenerating external CSS, clearing caches etc but the color won’t display either on backend or frontend.

@digikraft Are you sure the colors are available on the corresponding page/post/template? If yes, we need more information on how to reproduce the issue.

@timmse @luistinygod

Hi Yesid,
We’ve fixed this bug in Bricks 1.5.7, now available as a one-click update within your WordPress Dashboard.

Please let us know if you are still experiencing issues.

Best regards,
timmse

Hi, I upgraded to 1.5.7 and the problem is still there, I have changed the css loading methods, regenerated the css, updated the inputs, put the variable back in the constructor and it is still not solved.

The issue presist in 1.5.7.

When you use JetEngine RAW dynamic data in overlay (outside loop + external css)

This is generated CSS

#brxe-tqvwix::before {
    background-image: linear-gradient( {
        je_post_farba
    }

    , {
        je_post_farba
    }

    );
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none
}

When you change to internal css it is working.


Inside query loop it’s generated same for external as internal css as follows:

.brxe-axmqdu.brxe-block::before {
        background-image: linear-gradient( {
            je_post_farba
        }

        , {
            je_post_farba
        }

        );
        position: absolute;
        content: "";
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        pointer-events: none
    }

Hey guys,
Thanks for getting back!

True, within the loop there are still some issues. The overlay issue hasn’t been mentioned before, but I’ve added it to the bug tracker as well.

Best regards,
timmse

Hello, thank you for replying.
Yes, is that the dynamic colors work well, but the problem occurs when they are used within the loops, I hope you can solve it quickly, greetings.

Hi @timmse
Any answer about this problem? 1 month has passed and still the problem of dynamic colors when used inside loops.

Unfortunately, I can’t tell you more than that the task is still on the list - along with many others, so we have to prioritize. I’m pretty sure that if this task was easy to fix, it would have happened long ago.

Hi @timmse + @iFront,

I also ran into this problem when wanting to create an overlay using either an ACF colour field with {acf_my_field} or {echo:my_function()}.

I discovered that it occurs because the Overlay/Gradient colour control doesn’t seem to pull in dynamic data.

As a hack solution :grinning:, I added the line below line (taken from another control that does use it and modified to access the correct array value) in themes/bricks/includes/assets.php:1457

$color_value = $color[‘color’][‘raw’];
$color_value = bricks_render_dynamic_data( $color[‘color’][‘raw’], self::$post_id );

After doing this, I can verify that the overlay will pull in dynamic data or any raw value e.g. RGBA/Hex value.

HTH, and cheers for all the great work on Bricks :grinning:

Hey,
Welcome to the forum!

I’m glad you found a temporary solution. However, editing the core files isn’t recommended as it will reset your changes with every update :v:

Hi,

Yes I agree, and as such I’m not modifying it for my solution.

I was hoping it would point the way to a solution that you guys would incorporate into a future release :grinning: as currently dynamic data in the color control under the overlay doesn’t work.

Until that happens I also found a work-around for background color by using the Attribute setting and an inline css style with “style” and then adding the following CSS rule:

root:before{
background-color: inherit;
}

This way the dynamic data from a custom field (in my case ACF) can be used in the element to set the background overlay through an inherited background color on the element that is parent to the pseudo element.

1 Like

Hi guys,
We’ve fixed this bug in Bricks 1.7.1, now available as a one-click update in your WordPress Dashboard.

Please let us know if you are still experiencing issues.

Best regards,
timmse