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!
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!!
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!
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!
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
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.
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?
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.
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
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 :)
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.
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.
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!
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!!!
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.
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.
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 ...
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!
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.
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.
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
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...?)
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?
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.
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
Thank you! You can tell ACF on what kind of pages you want the option to appear. So that means that you can also do this for blogposts or any other CPT. Hope this answered your question!
@@rinodeboer I meant creating an Archive page for a CPT with elementary and design how this CPT should be shown. Or another example, how to show a list of CPT by a current category... Do you know what I mean?
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!
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.
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
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?
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.
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
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!
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.
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.
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?
Hey Rino. I was just wondering how you went about creating your contact button in your header navigation? Is it actually part of your nav menu, or is it just a button with a custom link?
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!
I agree. I thought so.
that will aslo prefent the client from forgeting the #
ty
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!!
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!
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!
Rino, you are by far the best tutor and master of all things Elementor - please keep these helpful videos coming!
I will! Thanks a ton 🙏🏻
I really couldn't imagine a valid reason for having dynamic colours in Elementor - but now I do! Good idea and excellent tutorial.
I had the exact same thing before I got this insight. Awesome to hear!
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
One of the best tutorials for something very useful. Well done!!
Your excitement about this new feature is very contagious. The video is very useful. Thank you very much! - From an Elementor newbie.
Wow. This is wonderful. Great for posts with different categories without creating a new post template. In short, brilliant. Thanks so much.
2:20 wow that website is so beautiful! 😍
Haha, yeah! I love it too, hahah
@Lyle Oakley Man... That is a crime, isn't?
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!
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.
That’s an awesome idea. Thanks 🙏🏻
@@rinodeboer Heb je hier toevallig een oplossing voor gevonden? Ben hard op zoek!
This is awesome! Got recommended to view your channel by the Elementor Community of FB. Not disappointed :)
i love his easy explanation about the topic ...stay blessed
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?
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.
Awesome, thank you!
I always enjoy watching your videos, please keep up the great work!
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!
Really nice! Didn't even know that that's the way to put AFC at normal pages. Love this one! Thnx Rino!
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
Enjoying this channel - very clear & great tips (sometimes a bit fast but that's better than too slow!)
Great to hear!
This was smart, Rino! :)
Thanks, Rino! What an excellent yet simple tutorial.
Thank u SO much RIno For the such beautiful content u have made for us!
My pleasure!
You deserve a million subscribers, my man! 👍🏻
That’s the biggest compliment I’ve heard this month. Thank you 🙏🏻
What a great feature… thank you for taking the time to show us.. 👍
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 !
This a great tutorial!! I look forward to seeing more!
I like your implementation of the new dynamic color feature.
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 :)
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.
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.
I am very happy to have met you, and I have learned but continue to learn elementor
I can’t believe I haven’t used the ACF before and what a great way to utilize!
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!
Very cool... thank you for your sharing...
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!!!
I Have just found this Amazing channel ...Great content Brother ...Keep up the Good work
Lots of Love
Very nice implementation. Thanks for the tip. Will definitely use it
Really awesome!
I have been looking for various ways for this, but it seems now my problem is solved.
Could we make a header dynamic color for each section in one page ?
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.
Check the active color in the style tab.
I did the same solution by writing some jQuery codes, it was a fantastic experience to solve the problem.
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.
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 ...
I like the way u teach
Plz make video on contact form 7 "how to insert mobile number"
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!
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.
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.
Very cool tips you present here!
Congrats! Awesome video!
best tip i've ever seen ... i'm impressed
Thank you so much.
Frikking genius Reno :-) I will use this too from now on. Thank you sooooo so much.
great tutorial! This is also possible now with the new Kadence theme without creating a header and footer in Elementor.
Awesome tutorial as always :)
why did I not find this channel before?!
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
Freaking genius you are!!! And I don’t even know how it works but it’s a fantastic idea!!
fantastic, I just asked you this exact question on another of your video comment. Great Job !!!
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...?)
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?
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.
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
Awesome as always.
Really awesome. Looking forward to more Elementor tips. What about custom post types loops and single templates?
Thank you! You can tell ACF on what kind of pages you want the option to appear. So that means that you can also do this for blogposts or any other CPT. Hope this answered your question!
@@rinodeboer I meant creating an Archive page for a CPT with elementary and design how this CPT should be shown. Or another example, how to show a list of CPT by a current category... Do you know what I mean?
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!
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.
Good stuff mate!
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
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?
Hey, what plugin do you use for white-labelling your dashboard ??
is it possible to use it while changing slides (i.e. some slides dark, some white), instead of on different pages? thanks
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?
Hi, LWP sir Rino, is your Elementor is in Pro version for this tutorial? thank you
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.
Brilliant
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?
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?
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
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!
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.
Thanks ! How does it works with Crocoblocks instead of ACF ?
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.
Thank you so much for giving us this is very amazing video :)
Awesome Frank!
No problem David!
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?
Well done! Your feed is very useful.
This is as excellent as all of your tutorials, Rino but when, Oh when, are you going to launch your elementor pro container course?
In a few days the pre sale will start!
I will upload a separate video about it!
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?
If this can work with sticky header? when a page is dark o light background?
This is bad ass. Thanks man!
Thanks! Very helpful video!
Do you think it's possible to create with the same method a Dark/Light theme switcher?
I don't understand 😥. In wich page did you edit the logo and color for the header?
Amazing work! Thanks very handy! 👏
Hey Rino. I was just wondering how you went about creating your contact button in your header navigation? Is it actually part of your nav menu, or is it just a button with a custom link?
He! It’s just a button with a link. Keeping things simple 👌🏼
How to combine that with a sticky transparent header that gets opac on scroll? Are those compatible?
Good stuff! can you use this for scrolling in the same page?