Your WordPress tutorials are always the best! Especially as a non-native English speaker, your speaking pace really helps me understand the content. What's even more amazing about your videos is that you go into detail about things that are confusing to a beginner. You don't just give the right answer, you show the wrong answer first and explain why you shouldn't do it, which is really helpful. It's also very helpful to see the videos of you finding and fixing the little bugs you encounter while working with Elementor. Thank you so much for providing such high quality guides on TH-cam.
You are such an experienced WordPress developer. You know every little setting that affects the design. Please make more videos and also how to add the header in this type of design. Thanks for your service ❤️
As a wordpress designer, nothing was harder there converting Figma to WP but for me there were manyyyyyy other things for learning to be proficient in WP 😅Thank you teacher 🥳🥳🥳🥳🥳🥳🥳🥳🎉🎉🎉🎉🎉🎉🎉🎉🥹🎉🎉
The way of teaching is much better and I love it. But if we used for the Hero Champion text will not need padding for separate screen sizes I think, but we are no code developers.😘
Regarding the alignment, as mentioned in the 31:10 minute, where a Mac screenshot is used, it is convenient to use PowerToys on Windows. Nice tutorial!
After building a few websites I've quickly realised that I dint enjoy the development side, too much time and too much headache. So in all honesty it's better working with a developer and sticking to the design aspect because that's what I enjoy more.
there is actually a way to do it in the free version. Just add another container above the entire design and add a top margin to it set to negative whatever size you have your container set to. This will actually place the container above your hero image. Then you jest need to make the headings clickable by setting them as buttons. Hope this makes sense
@@tonybp No problem. If you cant see the header menu on top of the hero section, just change the header z-fold to 1 so that it will appear above the hero page. Forgot to add that
Thank you for sharing! Would you consider adding a number of these in-depth tutorials with different design layouts to your Elementor course just focused on design? I would be happy to pay extra to have access and I’m sure others would too😊
Amazing video as always, Rino! 🚀 You really have a talent to explain even complex things in a beginner friendly way and break it down to the steps that are understandable for all :)
Love your videos. Can you tell me if there is purpose to designing a website on Figma first and then Elementor. I have experience with Elementor so, when I designed on Figma I felt that it was a waste of time when I had to do it all again on Elementor. I was initially hoping I could somehow export it to Elementor. I am assuming Figma is for people who just want to design websites with no intentions of them being functional.
Hello ! I have to ask details about your frame setting in Figma, I have already watched your video ( on TH-cam and in the course, which I have bought) about the 1120 px matters instead of 1140 px. That's cool, I understand the matter but how do you set Figma? I mean you use a frame larger than 1120 and then you set a column sistem 1120 px large within that frame? Do you? Thank you very much, your tutorial are simply the best.
In Figma you can set it up by adding a grid, then putting it on columns, then 12 columns, 75px wide per column and 20px gap. Then you exactly get 1120. Thank you for your purchasing the course btw 🙏🏻 I hope you like it
i am waiting for the day that someone will create an WordPress plugin that you'll be able to export Figma websites and convert them in to fully dynamic website using containers
Rino, what are your thoughts on Figma (or other design platforms, too I suppose) plugins that claim to automatically convert your design to a Wordpress website?
Good question, I have tested the 2 most popular tools that promise to convert Figma to Elementor. Both were overpromising and underdelivering. It takes a lot of fixing to get it right, which takes skill. That skill and time you could also use to build it yourself in (probably) the same amount of time. So not a big fan yet.
Dankjewel. Met deze video wel ja. Ik kan niet alleen maar advanced videos blijven maken, soms moet er ook wat tussen zitten voor beginners, zodat zij ook kunnen groeien :)
Hey! Thanks for the interest. Yes, I do offer a discount, here is the info: My Elementor Pro Mastery livingwithpixels.com/elementor-course (discount code for YT subscribers: LWPYT )
Yea, I agree. There is a way to connect it to your global colors, but that requires digging into the CSS. So I wanted to keep it simple for this tutorial.
No, you can just install the Elementor plugin and make this page (or a simple website) completely for free. But if you want a website with a domain name then you will have to pay a few dollars per month for hosting.
Your WordPress tutorials are always the best!
Especially as a non-native English speaker, your speaking pace really helps me understand the content.
What's even more amazing about your videos is that you go into detail about things that are confusing to a beginner. You don't just give the right answer, you show the wrong answer first and explain why you shouldn't do it, which is really helpful.
It's also very helpful to see the videos of you finding and fixing the little bugs you encounter while working with Elementor.
Thank you so much for providing such high quality guides on TH-cam.
we want more and more video Figma to elementor design like this!
th-cam.com/video/xzNj-nK2Vik/w-d-xo.htmlsi=1uBy3iv6PfNP9Y-y
Better then this
I like how you position yourself to keep your focus. 'Webdesigner and no-code developer'.
You are such an experienced WordPress developer.
You know every little setting that affects the design.
Please make more videos and also how to add the header in this type of design.
Thanks for your service ❤️
As a wordpress designer, nothing was harder there converting Figma to WP but for me there were manyyyyyy other things for learning to be proficient in WP 😅Thank you teacher 🥳🥳🥳🥳🥳🥳🥳🥳🎉🎉🎉🎉🎉🎉🎉🎉🥹🎉🎉
Silent follower here. So glad for you sharing your knowledge ❤
th-cam.com/video/xzNj-nK2Vik/w-d-xo.htmlsi=1uBy3iv6PfNP9Y-y
Better then
Wish I had this tutorial 3 years ago 😢 - can’t believe I’ve done so many work arounds 😢😢😢😢. Excellent vid thank you
You're such a great teacher Rino. GREAT job.
The way of teaching is much better and I love it. But if we used for the Hero Champion text will not need padding for separate screen sizes I think, but we are no code developers.😘
Regarding the alignment, as mentioned in the 31:10 minute, where a Mac screenshot is used, it is convenient to use PowerToys on Windows. Nice tutorial!
After building a few websites I've quickly realised that I dint enjoy the development side, too much time and too much headache. So in all honesty it's better working with a developer and sticking to the design aspect because that's what I enjoy more.
Absolutely, always do what gives you energy👌🏼
Very enjoyable Rino. Always something to be learned from your tutorials.
th-cam.com/video/xzNj-nK2Vik/w-d-xo.htmlsi=1uBy3iv6PfNP9Y-y
Better then this
Fantastic tutorial! Have really loved this series :)
Can't wait to see the header tutorial 👍
there is actually a way to do it in the free version. Just add another container above the entire design and add a top margin to it set to negative whatever size you have your container set to. This will actually place the container above your hero image. Then you jest need to make the headings clickable by setting them as buttons. Hope this makes sense
@@DubiDesign Thanks for the tip! 👍
@@tonybp No problem. If you cant see the header menu on top of the hero section, just change the header z-fold to 1 so that it will appear above the hero page. Forgot to add that
Thank you for sharing!
Would you consider adding a number of these in-depth tutorials with different design layouts to your Elementor course just focused on design?
I would be happy to pay extra to have access and I’m sure others would too😊
Yes, I have already planned a few for TH-cam. My course is more an overview of all the techniques so that you can apply it to any design.
Can’t wait for the course
Amazing video as always, Rino! 🚀 You really have a talent to explain even complex things in a beginner friendly way and break it down to the steps that are understandable for all :)
31:37 For Windows users press:
Win key + Shift + S
To make a Screenshot of a specific area of the screen
i totally love what you do!
Awesome! Have been waiting for a video like this from you Rino.
Amazing step by step video as always 😊
Thank you so much Rino de Boer❤
I watched this Figma tutorial today and I Design it as well🙏
Nice to hear!
@@rinodeboer Thank you Sir 🙏
I was the one that Tagged you on Instagram with the design Sir 🙏
Hey Rino, thanks for this! Been waiting since the Figma video 😂
looking forward to see more tutorials like this
th-cam.com/video/xzNj-nK2Vik/w-d-xo.htmlsi=1uBy3iv6PfNP9Y-y
Better then this
awesome build loved the designa and website
th-cam.com/video/xzNj-nK2Vik/w-d-xo.htmlsi=1uBy3iv6PfNP9Y-y
Better then this
This is a good video for beginners. Are you going to make an advance version?
Great video for begginers like me. Thank you!
I used this previous video to model my website. Nice to see it being transferred though.
Nice job 👍👏🎉🎉❤❤
Could you make another tutorial for advanced Wordpress devs? Still struggling with translating ideas from Figma to WP.
You are the best, thanks for this great tutorial!
Nice one Rino
Can you please make a video about your bedroom office setup? 😁
I learned a lot thanks
In the beginning, you mention that you normally set up a lot more things in the site settings/inside WordPress. Do you have a video about this?
31:49 Window+shift+s for windows
First 😋😋😋 Im glad to see you back.
Love your videos. Can you tell me if there is purpose to designing a website on Figma first and then Elementor. I have experience with Elementor so, when I designed on Figma I felt that it was a waste of time when I had to do it all again on Elementor. I was initially hoping I could somehow export it to Elementor. I am assuming Figma is for people who just want to design websites with no intentions of them being functional.
Good question, I made a video that answers this question: th-cam.com/video/iLEr67qVHrg/w-d-xo.htmlsi=sUIcoW0ZXq2MItiJ
Gebruik je altijd alleen maar de breakpoints tablet portrait en mobile portrait? Of ook de laptop en de horizontale layouts?
Ik gebruik vaak ook de laptop en tablet landscape. Widescreen en mobile landscape zijn vaak overbodig.
Hello ! I have to ask details about your frame setting in Figma, I have already watched your video ( on TH-cam and in the course, which I have bought) about the 1120 px matters instead of 1140 px. That's cool, I understand the matter but how do you set Figma? I mean you use a frame larger than 1120 and then you set a column sistem 1120 px large within that frame?
Do you? Thank you very much, your tutorial are simply the best.
In Figma you can set it up by adding a grid, then putting it on columns, then 12 columns, 75px wide per column and 20px gap. Then you exactly get 1120. Thank you for your purchasing the course btw 🙏🏻 I hope you like it
@rinodeboer thank you! I am at 50% of the course and it's fantastic, you go deep in Elementor 😍
Awesome to hear 💪🏼😎
i am waiting for the day that someone will create an WordPress plugin that you'll be able to export Figma websites and convert them in to fully dynamic website using containers
It kinda already exists - fignel
Rino, what are your thoughts on Figma (or other design platforms, too I suppose) plugins that claim to automatically convert your design to a Wordpress website?
Good question, I have tested the 2 most popular tools that promise to convert Figma to Elementor. Both were overpromising and underdelivering. It takes a lot of fixing to get it right, which takes skill. That skill and time you could also use to build it yourself in (probably) the same amount of time. So not a big fan yet.
Top video, lekker bezig 👍
nice design 🤩 how much you charge for this design?
Rino, je kanaal is erg mooi gegroeid en ik waardeer de inhoud, maar zijn we weer terug bij de eerstejaars?
Dankjewel. Met deze video wel ja. Ik kan niet alleen maar advanced videos blijven maken, soms moet er ook wat tussen zitten voor beginners, zodat zij ook kunnen groeien :)
Sir why we choose Figma for design? Why we prefer it over Elementor?
Perfect. Thank you
don't be sorry for the Windows users. the same feature is on PRT SCN button and then you activate Snipping Tool.
Thanks for sharing 🙏🏻
Do you have any video on website SEO OPTIMIZATION..PLEASE SHARE THE LINK
Thank you!
Funny to see that you're experiencing the same issue with buggy Elementor :p
Is it possible to go from Figma to Figueroa and Olympic Blvd. in Los Angeles?
Hallo Rino, I love your videos and would love to purchase your course. Do you offer a discount promo code for the course?
Hey! Thanks for the interest. Yes, I do offer a discount, here is the info: My Elementor Pro Mastery livingwithpixels.com/elementor-course (discount code for YT subscribers: LWPYT )
thank you for this
Nice. But I'd prefer a more flexible and elegant method than hard-coding the color red for CHAMPION in the title
Yea, I agree. There is a way to connect it to your global colors, but that requires digging into the CSS. So I wanted to keep it simple for this tutorial.
Use the following code in the title box:
Fight like a champion
Thank you for adding that!
whats the extension name that your are using for measuring the width and height of the box?
It's just the screenshot feature in Mac, using Cmd, Ctrl, Shift, 4
Also, any reason for showing InstaWP instead of using Local or another local host instead?
Because the set up is so easy so beginner friendly. But I also use localWP. Maybe next time.
When I want to put red color on the "champion", it makes a huge gap between 2 rows. Can you help me?
Use -tags instead of a paragraph/-tag. Those are inline and doesn't break the line apart.
Another Danger 😊
Mooi man.
Do you need to pay first to use elementor?
No, you can just install the Elementor plugin and make this page (or a simple website) completely for free. But if you want a website with a domain name then you will have to pay a few dollars per month for hosting.
So basically, we just need to redesign it all over again in Elementor and can't magically export it from Figma? 😅
16:15 This is very disappointing to say the least. Avada has done a beter job in this.
both you and ferdy say "faal"
instead of file lol
Yea its very hard for Ferdy and me because we are Dutch. Its an accent thing.