I found a much better way to use Elementor's dynamic color feature

[@ronrichardson175]

Using ACF it's simple to use a Check Box of colors where the choices might be: #ffffff : White #000000 : Black #ff0000 : Red You can also turn on "Other" to set custom color. It works great and thanks for the video! Keep up the great work!

[@woogonchung]

I agree. I thought so.

[@webliondotpro]

that will aslo prefent the client from forgeting the #

[@armalite6837]

ty

[@laurak7410]

I'm soooo glad that I'm not the only person on earth who get's excited whenever elementor shows a new feature. I love this video! You're doing an amazing job with this channel. Thank you so much!!

[@davidwalls2304]

Rino, that is an awesome use for this new Elementor functionality. I used your video on transparent headers and will be updating that website to use your suggestions. Great job!

[@realCREGuy]

Rino, you are by far the best tutor and master of all things Elementor - please keep these helpful videos coming!

[@rinodeboer]

I will! Thanks a ton 🙏🏻

[@linda_sue]

Excellent solution! Thank you, Rino! Edit: I've just watched it a couple more times and I had missed how you worked out the trick! How could I miss it, you were so happy with it. Thank you for sharing such a plum with us!

[@iwbowden]

I really couldn't imagine a valid reason for having dynamic colours in Elementor - but now I do! Good idea and excellent tutorial.

[@rinodeboer]

I had the exact same thing before I got this insight. Awesome to hear!

[@oscarcarlsson76]

Great tutorial as usual! If your logo is an svg-file you can add it as an "inline SVG" in elementor (instead of image) and then set its color with dynamic colors directly

[@cbmk788]

Your excitement about this new feature is very contagious. The video is very useful. Thank you very much! - From an Elementor newbie.

[@wgm247]

One of the best tutorials for something very useful. Well done!!

[@EricaDyson]

Wow. This is wonderful. Great for posts with different categories without creating a new post template. In short, brilliant. Thanks so much.

[@kevganhiga]

Thank you very much! It will save me me soo much time now that almost every client wants a transparent header. Elementor should pay you man!

[@jahidhasan6994]

i love his easy explanation about the topic ...stay blessed

[@hasebaa]

Very nice and clever use of dynamic Colors anc ACF. Here is a challenge for you. Design a sticky transparent header with the menu background changing color when you scroll. This will be useful to keep the header readable.

[@rinodeboer]

That’s an awesome idea. Thanks 🙏🏻

[@mikevinzenz1633]

@@rinodeboer Heb je hier toevallig een oplossing voor gevonden? Ben hard op zoek!

[@JohnScoggins]

I like you excitement in this video haha, you can tell you’re super happy about finding this out. Thanks for sharing the neat little trick with us!

[@shawfj1]

Thanks for the tutorial. Would it be possible to use this sort of set-up where the colour of the logo and text changes as you scroll down the page to respond to different background colours?

[@vleugjevakantie3706]

This is awesome! Got recommended to view your channel by the Elementor Community of FB. Not disappointed :)

[@HoefWijzer]

2:20 wow that website is so beautiful! 😍

[@rinodeboer]

Haha, yeah! I love it too, hahah

[@lucioramos6224]

@Lyle Oakley Man... That is a crime, isn't?

[@Jim.Hummel]

Rino, thank you!! I've been missing one little detail with ACF and you just connected the dots for me. I love your work and I REALLY love your videos!I'll definitely be adding this trick in my blueprint stack.

[@rinodeboer]

Awesome, thank you!

[@Owenoooo]

Really nice! Didn't even know that that's the way to put AFC at normal pages. Love this one! Thnx Rino!

[@MarieEveDemers]

Enjoying this channel - very clear & great tips (sometimes a bit fast but that's better than too slow!)

[@rinodeboer]

Great to hear!

[@DavidPrice51]

Thanks, Rino! What an excellent yet simple tutorial.

[@webliondotpro]

Amazing Idea!!! I taught also in using it with the categorie of a post. So that every post page has color matching accent with the category it belongs to

[@prodevsol]

I always enjoy watching your videos, please keep up the great work!

[@Aphex083]

This is so clever. I'm binge watching your videos at the moment, I sincerly thank you for all your quality and instructionnal content. Hats off !

[@mumairmughal9865]

Thank u SO much RIno For the such beautiful content u have made for us!

[@rinodeboer]

My pleasure!

[@gianmarcogiuliarig]

Thanks for this video, I got a question... what about yif you also want to make the header sticky and the background of the sticky header is the same as the menu color header.

[@essare108]

This was smart, Rino! :)

[@AnnitaCaniglia]

Hey Rino! This is wonderfull, I am currently working on a website for which I have three different headers and this idea is perfect! I appreciate all your work and educational content :)

[@hy.c5576]

This is a game changer. Thank you so much for this tutorial!! Would also love to see one for off canvas menus as they’re also becoming quite popular. Again, great job!

[@chriscannon2490]

This a great tutorial!! I look forward to seeing more!

[@Shahhure]

You deserve a million subscribers, my man! 👍🏻

[@rinodeboer]

That’s the biggest compliment I’ve heard this month. Thank you 🙏🏻

[@bySterling]

I can’t believe I haven’t used the ACF before and what a great way to utilize!

[@harbourdogNL]

2:02 How did he get the logo in the middle of the menu? Did he have to make two separate menus, one for each side?

[@philipcolonias3785]

I am very happy to have met you, and I have learned but continue to learn elementor

[@withjulio]

Could we make a header dynamic color for each section in one page ?

[@DipeshSharma93]

This is really a cool method to dynamically changing logos and all on different pages. But I've one question, is it possible to change text color of a button on same page based on section's background color. (For ex. - if section has white background - Button will be black and vice versa.

[@PswACC]

I like your implementation of the new dynamic color feature.

[@TiloVentures]

What a great feature… thank you for taking the time to show us.. 👍

[@AmpersandBlack]

Dude, you are a genius. Now you only have to figure it out how to use de Price List widget dynamics capabilities with Woocommerce products. I don´t know what the Elementor team es waiting for!!!

[@alirezaebrahimi8384]

I did the same solution by writing some jQuery codes, it was a fantastic experience to solve the problem.

[@saimm8350]

I Have just found this Amazing channel ...Great content Brother ...Keep up the Good work Lots of Love

[@iqbalmauludy]

Really awesome! I have been looking for various ways for this, but it seems now my problem is solved.

[@just_jimmy]

Very nice implementation. Thanks for the tip. Will definitely use it

[@dishamadrecha1671]

I like the way u teach Plz make video on contact form 7 "how to insert mobile number"

[@alexandragolovenko6171]

That's very smart and creative. I have a follow up question to this video. What would you do if your client had an image carousel with images of different colors? Is there a way for the dynamic menu color to change color for dark and light images as as they rotate? I can't see how that would be possible, perhaps you know a way... Thank you!

[@justbeyoo8193]

fantastic, I just asked you this exact question on another of your video comment. Great Job !!!

[@adnanmahmud491]

Awesome tutorial as always :)

[@michellepace]

Hi there, thank you for this! Given this method is from 4 years ago, is it still your recommended method for Elementor Pro or could you point me in a better direction? Many thanks.

[@marisousa670]

best tip i've ever seen ... i'm impressed

[@josbogers8609]

What a quick answer. Thank you very much. I just read polylang, but I can't get out of it without help. So I would really appreciate it if there would be a video of that. regards , Jos

[@TutoDS2014]

Hi How to create that custom fields for pages and posts? I try set pages and posts but where I got to select custom field appear 2 options pages and posts If I use posts not work on pages

[@italoaguiar]

Congrats! Awesome video!

[@victorrenevaldiviasoto9728]

Very cool tips you present here!

[@andrewcomplainer]

Hello, is there anyway to change the color by scrolling inside a page? For example the menu is transparent with white text, which is fine at the top of the page, where all the backgrounds are dark but as you scroll down the text seems to vanish on the white background.

[@yngverodli]

Frikking genius Reno :-) I will use this too from now on. Thank you sooooo so much.

[@Makxbi]

Is it possible with this dynamic color feature to say.. have the site visitor change the color scheme of the entire site with a button press within the site? And to have it toggle through color schemes and eventually come back to the original one? I'm thinking of websites that do this, like Google fonts.

[@kylewalker4641]

You can make the logo an svg with that uses outlines and has a fill colour of #000000 then you can change the colour of the logo within elementor aswel

[@guerriergetho]

Hi, thank you much for this tuto, please help , I would like to know how I can do to have active icon, for example I created a mobile menu, I inserted a link but when I give click to open the page opens, but the color of the page icon active does not change, what code and id I must use to have this function? i use elementor, thanks for your help

[@michaeloliver6745]

Freaking genius you are!!! And I don’t even know how it works but it’s a fantastic idea!!

[@mortenskerra5911]

Regarding your logo, you could use a SVG file ( inline SVG) instead of an image file, here you have the option to change the color of the logo and on the background, so it must be possible to use the same color variable you have set up and yes you are not the only one who breaks the skull with these small tasks but who fills so much, really cool idea ...

[@PhilDodici]

Thank you!! Do you know if it is possible to set in this way: a slider of images, transparent navbar with white text for some images, dark for others?

[@itsviney]

Great idea. I think if I ever use this method though, instead of a colour picker I'd create a drop-down with a pre-defined list of colours to choose from.

[@Studio-Kulialma]

I have an upgrade to your idea. Instead of adding a color picker field, add a True False field, change the label names to Dark mode and Light mode and add a value (the color hex) to each one of them. In elementor use this field in the dynamic color picker.

[@DominikWernerCreativeArt]

I ran into an issue with that, with using a transparent background fading in into a solid background by using custom css - Is there a way to make that dynamic too?

[@tsepkinmedia]

Not really related to the topic, but I noticed you have the whole webside predesigned somewhere, you send it to the client and if they aprove, you move on? Can you share how you do that? Thanks!

[@aru4820]

why did I not find this channel before?!

[@furthergadgets8122]

Thank you so much for giving us this is very amazing video :)

[@MrBalloonatic]

would it not be better to just use acf to make a checkbox/toggle switch for dark mode and then automatically change the colour and logo for them?

[@ariestwn]

can you create another tutorial if the header is sticky and the default background was transparent and then change color to black when the header scrolled.

[@VladimirKurian]

great tutorial! This is also possible now with the new Kadence theme without creating a header and footer in Elementor.

[@learnwithnorwebs]

Hello, please I need your help. I have a website I designed it's homepage using Elementor Pro. It has a sidebar with Advert Banners. It also has a top banner at the header. These advert banners are not Adsense but normal advert pictures that will be placed there and changed from time to time. I don't want my client to go into the template and change the banner image, cos he may spoil the layout of the template. How do I make it possible for him to change the images dynamically from the dashboard?

[@sachindsouza14]

Hello , I have favor to ask from you, i.e. in my elementor Nav Menu that I created, all of the button colors change except for the HOME button when I hit on the preview button, the animation part of it works fine, it's just that the color does not change as per the parameters that's been set, could you please help me sort this issue, thanks.

[@kevganhiga]

Check the active color in the style tab.

[@stefanpfadt4353]

Hi, great videos! Any chance you can help me with an issue: I want to make social icons change the colour automatically from background to background (that is, page to page). My icons are white, but many pages I have are white background so I cannot see the icons. Is there anything to make them automatically adjust to the background?Automatically switch to black when I scroll down for example?

[@ramonzeira]

How to combine that with a sticky transparent header that gets opac on scroll? Are those compatible?

[@wpexplaind9823]

How does this affect page speed as opposed to using two different headers? Is it faster? Slower? Currently I'm using two different headers with different display conditions. If I were to implement this, it will require a DB call for the dynamic fields. Have you noticed a difference in page load time? Has it negatively affected page speed at all or has there been a positive impact? The tutorial is great, but these are my concerns around implementation. Also, I'm assuming this can be accomplished using another tool other than ACF like Jet Engine by crocoblock or Toolset.

[@edwards9845]

Good stuff mate!

[@flexpixels]

Hey Rino, Thanks for the tutorial. Can you make a tutorial on how you start a WordPress website? Are you using a blank theme as a starting point or prebuild theme that you modify to fit your needs? Thanks!

[@segundoeliezerdelacruzfarr5498]

How can I do to have a white logo and when downloading it is black, like changing all the div to another color along with the letters?

[@aminmiri7901]

Does that work for sections? I mean if I need to scroll the header, then if the section is dark the header nav should be white and if the section is white the header nav should be dark

[@maxcondor72]

Hello congratulations for the video. I tried using your technique on my site. I added a custom field to the taxonomies. My intention was to create colored boxes with the name of the taxonomy. the background, however, is not colored with the dynamic field.

[@vitalivitali3645]

is it possible to use it while changing slides (i.e. some slides dark, some white), instead of on different pages? thanks

[@michaellasambouw]

Hi, can you show me how to make a popup with elementor pro that will check a data on a simple database and sending back the data into another popup. For example the popup is for checking a barcode number with a search button, When the search button is clicked, the data will be searched in a database. if data is found, another popup will appear showing the entire data. If data is not found, another popup will appear instructing the user to register the data. I am confused about which combination of Elementor and plugin to do? please enlighten me.

[@sy_ox]

Amazing work! Thanks very handy! 👏

[@laurabarriuso1013]

Have you ever try to created a menu with one word that be different to the rest. I know someone who made it with DiVi but i dont know how to do it with elementor

[@DannoPritch]

Hey Rino, I’m loving your videos. Could you tell me how you add a logo to the admin sidebar? I think it’s a really nice touch for clients. Also, could I suggest a video for you to create? I think it would be great to know what your base setup is for a new site, i.e. what theme and plugins you start with before each build.

[@ar_dani_]

I don't understand 😥. In wich page did you edit the logo and color for the header?

[@AbzDogg]

Hey, what plugin do you use for white-labelling your dashboard ??

[@dantepaule6720]

Hi, LWP sir Rino, is your Elementor is in Pro version for this tutorial? thank you

[@thomaslarmit6434]

Is er een manier om de kleur van de tekst in je header te veranderen wanneer je naar beneden scrollt? Bovenaan wil ik de tekst zwart hebben, maar wanneer je naar beneden scrollt wordt de header ook een donkere doorzichtige kleur, waardoor de zwarte tekst weer moeilijk leesbaar wordt. Dus de tekst zou ik dan graag willen transitionen naar wit. Is dit mogelijk (met custom css of iets dergelijks...?)

[@marszu-com]

Well done! Your feed is very useful.

[@haltama]

Very cool... thank you for your sharing...

[@analuzsandrea8165]

If this can work with sticky header? when a page is dark o light background?

[@techwolfcave]

Awesome as always.

[@rswebmarketing]

Thanks ! How does it works with Crocoblocks instead of ACF ?

[@riegaldutoit5792]

hello can you make a tutorial on how to change the drop-down menu button for phone i mean when you press on the drop down button then there is a background how can i change the color of the bacground in elementor

[@sebastiansaini4297]

Good stuff! can you use this for scrolling in the same page?

[@rocaivan]

Do you think it's possible to create with the same method a Dark/Light theme switcher?

[@Joeyinsane69]

Hello, have you done a tutorial on creating a fully responsive transparent header? This is something I am struggling with on elementor. I get odd whitespaces at top of page from header changing height even though I set min height.

[@rinodeboer]

Yes I have! Here is that video: kzbin.info/www/bejne/j2rZn6tsib-jaKc

[@mohamadhannan453]

Hello Can u put all sourse to make these tips with you?

[@PakaBassPlaya]

Hi! How about using ONE true/false field within the ACF and incorporating conditional usage of elements thanks to Dynamic Conditions plugin? It will look nasty in the Elementor editor because two logos and two menu versions have to be in place, but should work great on a live website.

[@rinodeboer]

Hmm, alright. Are you talking about conditional logic? If so, I would love to learn about that. I hope it's not too complicated. Do you have a link with explanation? Nevertheless, I will put this on my to do list to research it.

[@PakaBassPlaya]

@@rinodeboer I was thinking about using this plugin: wordpress.org/plugins/dynamicconditions/ (there is a vid from WPTuts in the plugin's description showing its functionality). Basically it allows to show or hide an Elementor element if a certain condition is met. You could put both black and white menus and logos in the header and show only an appropriate one, depending on the trigger configuration. It seems to be a more straight forward solution to your problem, especially if a design change has to be made. One logo change in the header would affect all pages and posts.

[@rinodeboer]

Sounds very promising. Will look into this soon.