Latest Post

How to download adobe illustrator pre-activated download now….. Adobe Illustrator|How to design Shield shape logo in adobe illustrator #Shorts

Want to go from design prototype to a live WordPress website in the fastest way possible? Moving from Sketch / Photoshop / Figma (or any other prototyping tool) to WordPress has never been easier, now that you can visually recreate any design using Elementor! In this Monday Masterclass, we show you the exact process our team at Elementor uses to create templates, landing pages, and complete websites. After watching the video you’ll be able to: ✓ Recreate any site using Elementor ✓…

40 thoughts on “From Design Tool to WordPress [Photoshop, Sketch or Other] – Monday Masterclass

  1. BG says:

    This partly explains why so many of these wordpress templates all look so basic and resemble eachother. This template being shown is soooo basic you dont even need to do sketch first, this is so basic you can do this straight in Elementor.

  2. abhi4u20 says:

    How do you decide height?

  3. This is superb. I have been searching for this. Thank you very much…

  4. Alex Karpov says:

    About 50px on top here

  5. it would be awesome if we have wireframe templates inside elementor…..

  6. daily planet says:

    Is there any other easy way here..this is too is BS..isnt it?

  7. Sreylin Y says:

    I just wonder how could he finish the whole one when he just finished some part. Please kindly tell me.

  8. Hey, I love the video! In the video, you mentioned that you have a hero image that you already resized in photoshop. I am having trouble in elementor with getting my hero image to fit properly without distorting. How did you accomplish resizing your image for the appropriate dimensions? Are there any tutorials you have on this? I have made a few websites using elementor and this has been a common problem, even if I design a banner in photoshop with a canvas size of 1200×400 Px when I go set up the background for the header it distorts and on tablet/mobile, it does not respond. I have been looking for this solution everywhere. Please help share any advice!

  9. How about UI/UX with Elementor ??

  10. So, instead of designing smth in sketch and then reimplementing it in Elementor. Why wouldn't one just design smth in the Elementor right away?

  11. Hi! thank you for everything!!! Just one question. I got lost when you applied a -90 to the margin on mobile. It passed so quickly that i have troubles understanding that move. why was it necessary to apply a -90 on that margin? aren't the different versions (desktop, tablet, mobile) supposed to be independent from one another? so I can set the properties from zero of each view? Why did you decided to compensate with a -90 on that version? Thank you in advance.

  12. Deepak Kumar says:

    Can can you show how to add parallax effect to the diagonal divider

  13. Why use a design tool when you can just prototype with elementor? Wouldn't this save a lot of time?

  14. Rawad Merhi says:

    So I have recently designed a website with Adobe XD, However, I'm unable to resemble it with Elementor, for instance, with Elementor the padding between each section is different compared to the design in XD. How would I create the website accurately? Is there a grid system in Elementor?

  15. নাইস ওয়ান।

  16. That's why I <3 Elementor

  17. Sean Dungan says:

    Im curious as to what height you used in Sketch when making the templates for the actual design of the website. I realize you said 1200 px for the width but what about the height?

  18. Please don't ever use oblique type, never ever again, you're hurting the souls of the typography community, and giving a terrible example to a new generation of creators. Actually, the Elementor team should just remove the option from the Typography panel…

  19. Skopelos says:

    Great video and managed to replicate everything you did at first go! Any idea where I could look to find out how you created the rest please…??

  20. Tom Sobczyk says:

    Is there a workflow or plugin that would automatically sync the exported local files to wordpress and if I update a file it would automatically update in wordpress? I'm pretty lazy so that's my dream workflow 😀

  21. FYI, for the padding adjustments in Tablet (07:30) and Mobile (08:00) view, the narration refers to setting percentages when if fact the video shows setting pixels (PX is selected above the padding boxes instead of %).

  22. Why would you want to design in something other than WP and elementor for your draft and designing?

  23. It would be super helpful to have X Y-axis. I know right where I want something but then I have to jack around with padding to get it where I want it. Maybe I'm thinking about it the wrong way. ?

  24. moriza Nova says:

    Since this video recommend deaign with elementor widgets in mind. Would be awesome if someday there is Elementor Ui kit

  25. Erica Dyson says:

    Well I think more of the same if you see what I mean. It's the settings you use that are very helpful. Actually I didn't like the design at all but that's immaterial. You use padding a lot more and it's handy to understand just how you do things and improve our workflow. So more of the same.. if you see what I mean. The explicit explanations are critical ie don't skip over steps that you think are obvious because they may not be to lesser mortals!

  26. Alex Kikot says:

    I myself too

  27. BJ Nicholls says:

    Looking forward to more breakpoints and landscape views for portable devices.

  28. Big Thanks Elementor

  29. Hello, I would like to know when a template or tutorial on how to make a Neighborhood and City Directory with Elementor will be coming out because I only see for one page sites or for specific category like dentist, lawyer and etc. I love Elementor and I own Pro and watch all your notifications Thank you and I look forward to Carlos do Brazil.

  30. Hamid says:

    Hey whats the best wp theme for building websites for clients?

  31. belitafalcon says:

    Justo lo que estaba buscando ☺️

  32. Jeremy Gard says:

    Great video. Thanks. Really helpful. Should be using more pre-design work in PS before going to WP. This will help me. Also, just something I noticed, you are saying % when setting padding etc, but the setting in Elementor is on PX. I'm sure it's not a big deal though.

  33. Finally something useful! Can you show us whole process? Thanks

  34. PapaRatSan says:

    Make a video on how to make custom Registration Page and User Dashboards by using elementor

  35. Awesome! I Learn something new every week! Go Elementor!

  36. Perfect video i was looking for a long time

  37. Clement Yo says:

    Hi, do have reference how to get free resources lightweight video file for background in hero section that we can use for any website project? (including for clients)

Leave a Reply

Your email address will not be published. Required fields are marked *