Make Your Own Elementor Widget Using ChatGPT (5 Easy Steps)

[@muhammadbilalarif]

Thank youuuu please make more videos on elementor widgets

[@wpmaker]

More videos coming!

[@marjoriehopegross281]

You are amazing! Couldn't have made my website without you!

[@wpmaker]

Haha no you are amazing 🙏♥️

[@Thiarara_superWP]

creativity at a high level. I love the final product and the flower website idea. Look forward to have a upgraded product.

[@wpmaker]

Glad you liked it, thank you so much!

[@wpmaker]

It's finally here! Our full tutorial on how to make your own custom Elementor widget! Check out our channel for more cool WordPress / ChatGPT tutorials. I sincerely hope that these videos help & inspire you, thank you for watching!

[@MUHAMMADASHRAFMUNIR]

I am amazed to tell you I have created my first plugin by following your video. Thanks a Lot for the amazing tutorial.

[@nikasiradze13]

🤣 I'm trying to do a custom elementor widget with ChatGPT now and I saw your video 🤣 Nice timing

[@wpmaker]

Nice! I hope this helps, I'd love to see what you make 😃

[@asukagmbh]

Great video, thanks for the inspiration to create your own widgets

[@Sherri-i8u]

Wow! this is just amazing! thank you so much! I hope to see many more videos from you. you are such a great teacher!! I just finished learning your blog tutorial. with your teaching I might add it didn't look half bad at all. thank you. I'm going to give this a go now! your awesome!

[@wpmaker]

Haha thank you for the comment, glad it helps! More videos coming :)

[@Yosie432]

Easy to understand and very well explained. Thanks! Hope you keep making more videos like this one. Subscribed

[@wpmaker]

Thank you so much!

[@kkkkkate]

Love it. It's very informative. I hope you will have more and more video about creating custom elementor widgets.🥳

[@wpmaker]

Glad you liked it, thank you!

[@WordPressandSEO]

Well explained! Thanks a lot! I hope there will be more interesting videos about widgets. 😃

[@fransbrewis4776]

Love this type of content, thank you very much I am definitely gonna play around with this :D

[@wpmaker]

Thank you so much Frans, glad you like it! Highly recommend playing around with it, super satisfying to build something like this :)

[@DanielSpycher]

My first thought when I read the title was; Omg, another clueless "developer", but you proved me wrong! Well well explained and good lenght of the video. Only one thing I like to mention. If you are using this widget, the css and js code will be always inserted. This can be written in a external file and by using class or attribute names. This way you make your code leaner. Otherwise, great work!

[@wpmaker]

Haha, glad you liked it! Your recommendations are great. I just wanted to keep it as simple as possible for a complete beginner. Thank you so much for the comment!

[@ВасильВласюк-ь8т]

Hello Sir. I wanted to separate styles and scripts. How can I pass ID to style.css?

[@aiPROFITz]

I followed along and had a lot of fun making this widget! Great video 😎

[@invitify9948]

woaaa, incredible, please make videos for customize any plugin

[@konteche-learning828]

Thank you for the widget. Please make more useful widgets.

[@tanawitjnew2155]

You just giving me incredible ideas for me , very Thank you! from Thailand🔥

[@wpmaker]

So happy to hear that my man! Thank you.

[@codingcompiled]

Awesome stuff dude, it is nice seeing you diving into the whole coding side of things. I have been hearing about use cases of ChatGPT being used to teach code as well. I definitely feel it's a great tool to use but from my experience you have to prompt it but by bit for beat results.

[@wpmaker]

Definitely had the same experience, you need to know what to ask for. But now with GPT-4, it will probably keep getting better and better. It's insane how fast this field is making progress right now :)

[@markmckeown87]

Loving the ChatGPT content - subbed!

[@wpmaker]

Thank you so much Mark!

[@storworx4793]

Terrific research, thank you much!

[@wpmaker]

Thank you!

[@StevenDoig]

Champion, thank you. Would love to see a Divi equivalent.

[@wpmaker]

Thanks Steve, noted! Might give that a shot next :)

[@DarmaMatok-rz9md]

Great... Works Perfectly on my web...

[@lautarob]

Thank you!. Excellent content!. Subscribed!

[@VictoriaAlfredSmythe]

Very good. Thank you from manhattan

[@379rale]

Pure gold!

[@wpmaker]

Thank you sir!

[@prozuktibidda88]

Unbelievably awesome!!!!

[@Thebigrace-01]

thank you man

[@knightride9635]

Solid knowledge here, thanks a lot

[@wpmaker]

Thank you!

[@centraldeexames7300]

Awesome content dude!!!

[@wpmaker]

Thank you so much!

[@HatemFrere]

How professional are you... Greetings ❤, Subscribed done

[@wpmaker]

Thank you so much!

[@arnauduu3765]

Great! Thanks, very interesting!

[@SunakshiA]

Loving the ChatGPT content .

[@dimejisaheed7546]

Wow!

[@jaredspooley9273]

Great Video! The text area conditional statement could also be used in the javascript code to only show the overlay if this is set to 'yes'. I found Javscript seemed to give some errors in the console as it was trying to show an element that didn't 'exist'. 🙂

[@wpmaker]

Great tip Jared, thank you!

[@digital.olimon]

I'm enjoying your custom widget. Works great for a portfolio. I'm just trying to get chat gpt to add a unmute button now 😁

[@digital.olimon]

Managed to get chatgpt to add a video unmute/mute button when you mouse over the container 🤗

[@wpmaker]

My man, love to hear that! Awesome that you got it figured out, and a great extension to the widget :)

[@wpmaker]

PS: I love your portfolio design, as well as the way you've expanded and used the widget haha. Beautiful idea and design 👍 best of luck!

[@ambersaugier4112]

This is great!❤

[@rakesh.dsouza]

Very good one bro... can you make a tutorial to include 2 or more widgets in ONE plugin... so that for every NEW design we don't have to do many that many plugins...

[@wpmaker]

You can register a separate widget in the same plugin. Try asking ChatGPT how to add (or how to register) another widget inside your plugin, it is pretty good at showing you this sort of thing! :) I will also consider it for a future video, thanks for your comment and suggestion!

[@endritsusuri7974]

Awsome!

[@barmolino]

Sure great idea mate keep doing it

[@rocaivan]

It would be great to have a Widget creator option natively in Elementor.

[@gabrieleferrari2266]

You can start from unlimited elementor widget plugin

[@wpmaker]

Maybe one day! :)

[@rocaivan]

@@gabrieleferrari2266 Native option would be much better.

[@moments.xyz11]

thank you sir you are the best

[@buildingabetterwebsite]

this is amazing :)

[@utsabdeepray6030]

Thank you so much for this tutorial. Needed it badly. I want to know more about how to achieve something using API. Can you please make a video that. How to connect with you?

[@muhaa5578]

Nice

[@rahulbaghel1680]

Make more elementor widgets & custom plugins bro

[@Cozyroomz1]

Can you please make a video on how to create a lightnovel or webnovel wordpress website?

[@matejcalic4008]

👏🏼👏🏼👏🏼

[@etsytipsandtricks7781]

this is so awesome.Creating our own widgets for elementor or any page builder out there. But what happens if you update elementor?Will the widget be overwritten?How to fix this without using child theme.

[@PerryPalmtree]

Just use a child theme, there are plugins to generate the Hello Elementor theme

[@latefilms2]

Ok this is amazing tutorial to learn with used it to design a custom testimonial widget. honestly hope ChatGPT-4 can learn more about elementor and help me figure out padding issuse with code. Also thanks for this amazing video

[@Ali_dev]

Please can you make booking plugin like "yith booking for woocommerce"

[@thozhathozha]

I am also like tha video and subscribed

[@SamSteward-u2i]

please tell me where is the code you mention in the video 2:56 / 21:14

[@clarea_zoanctionct]

Can you make a main menu element for elementor? The idea is to make a single page website with scroll effect whenever we click each item menu link to each of block inside the single page website?

[@sulaimanalmaraghi]

I did a QR code generator with chat gbt for Wordpress 😍 that you can give any product a unique QR code 😍

[@wpmaker]

That's awesome, love to hear it!

[@gabrieleferrari2266]

Please make a video that explains how to createwith ChatGPT a functional .json template simply from a prompt

[@wpmaker]

Hey Gabriele, unfortunately I don't think it can write that (at least for now) :)

[@AmanSpace365]

million dollar video wow can you mke video how to create and sell plugin

[@wpmaker]

Glad you liked it! I'll keep your suggestion in mind, thank you!

[@0619ricardo6190]

are you selling that widget or is it possible to download it and try it?

[@wpmaker]

You can download it for free from the description of the video. You can also watch the video and learn how to make it yourself :)

[@Bhardwajweb]

awesome bro bro plz make a video on elementor form data to mailchimp. i am using mailchimp api all data is going nicely to mailchimp but problem is when i am testing if same users want to fill the form it is giving error 401, 400 some time how to fix it please let me know or make video

[@wpmaker]

I'm not sure what your setup is exactly so I don't know. I'd try Mailchimp's support, they might be able to help you figure out where the problem is.

[@mohobbathjahan7515]

Can you give me the code for the gallery of photos as you showed.

[@wpmaker]

You can download the final code from the video's description :)

[@Bhardwajweb]

i had also made few wp plugins using chat gtp for marquee text like news channel ( tickers) if anyone needs you can ask me or comment on this

[@iswin-2861]

how can i add another widget ? Cause when i try to upload the file again with a new name i dont find it in elementor i only have the first one

[@wpmaker]

You'll have to look through the code and change the names of the plugin itself, and of the widget, so that they are unique (they can't be the same in two separate plugins if you install it twice). You'll have to do this carefully because they have to be changed in multiple places. Play around with it and you'll get it to work! :)

[@ManishSingh-wl5ey]

Can I create widget for flatsome UX builder by following this video?

[@wpmaker]

You can definitely try to ask ChatGPT about it. I'm not too familiar with Flatsome, but if there's a way to insert custom widgets into it, GPT should know about it :)

[@baylonyap1113]

wow

[@kevinpatel1143]

is this only for pro?

[@wpmaker]

No, this works fully only with Elementor free :)

[@unit-spe7558]

I installed this plugin WP, but i don't find him, in anycase, when I edit page or article, contrary with your other plugin for instagram, that I find almost Immediatly. In sidebar Widgets, I tried to find him. Can someone help me please ?

[@wpmaker]

Hey, it should be in your Elementor sidebar. You could type "WP Maker Image" in the widget search box and it should show up. Of course, make sure the right version of the plugin is installed and activated on your website (link is in the video description), as well as an up to date version of WordPress and Elementor. I hope you've found it, let me know if you keep running into this problem :) good luck!

[@unit-spe7558]

@@wpmaker Thank you very much for your answer, I didn’t realize I had to install your personalized elementor in the first place, I had to install the official. I'll test that. Ok I get it now, it is necessary that I'm in "modify with elementor" mod, when I'm in my page or article modification, for see your widget. Ok, I was thinking that will function like your Instagram widget.

[@wpmaker]

@@unit-spe7558 To clarify, you don't need any personalized version of Elementor. You just install the official Elementor plugin. Then you install the plugin we made in this video (from the link in the description), in addition to Elementor. This one simply adds the additional widget that you see in the video, to Elementor's options. Yes, you need to be in the Edit with Elementor interface to use this widget :) the Instagram one is a Gutenberg block, while this is an Elementor widget. Best of luck!

[@bobelism]

esti tare! mi-ar placea sa colaborez cu tine :)

[@detailmasters-calgary2109]

your video links don't work?

[@wpmaker]

Hello sir, the links are working on my end :) are you still having this problem?

[@detailmasters-calgary2109]

@@wpmaker I managed to install my elementor pro to this test page, my brain hurts, there's certainly a learning curve. Thanks for the tutorial. I'll press on and let you know how it goes

[@wpmaker]

@@detailmasters-calgary2109 There's certainly a learning curve, making a plugin like this from scratch is a fairly advanced endeavour, even with tools like ChatGPT. There's no need for Elementor Pro for this video (I'm not using it in the video either), the Free version is enough. But there's no downside to having Pro also. If you keep at it I'm sure you'll make it to the end result and learn a lot along the way! Good luck!

[@detailmasters-calgary2109]

@@wpmaker Thanks, I first read this reply wrong. I thought you were letting me know that a link on my website didn't work lol, and it wasn't working so I went and fixed it so now it works, this is how little sleep I have had lately LOL then I came back to let you know that my video link was working and to let you to know to try it again OMG I'm going Nuts. sigh. So... Thanks eh!

[@fatjay9402]

how does this work .. because chatGPT is stuck in 2021 :) ?

[@wpmaker]

Elementor was released in ~2017, so for the most part that's not a problem. I do mention this in the video and give some tips on how you can get more up to date code in case something doesn't work right :)

[@RamiYushuvaev-nf1eo]

Very bad code. The main `plugin.php` file uses deprecated registrations methods.

[@markmckeown87]

Have these just been deprecated in the last 2 years or so, beyond the knowledge limit that ChatGPT has?

[@wpmaker]

This doesn't seem to be the case, I couldn't find anything about the methods being deprecated and there are no PHP deprecation warnings when running the plugin. It is simply the easiest/simplest way to register a new plugin with the fewest lines of code, and for simple projects like this there is no downside to it.

[@jmarino715]

Do another video like this, except use Oxygen instead of Elementor. That one I would actually take the time to watch. IMHO: Oxygen > Elementor in just about every way.

[@serusok]

йоур инглишь из пьорфект

[@nicevideomancanada]

your video is too fast it's difficult to keep track

[@pedrocosta1889]

in configuration put spees ,5

[@nicevideomancanada]

@@pedrocosta1889 oh yeah, Thanks. I'm sure it helps you to make a shorter video as well. Thanks for the tip.

[@ahmed11782]

Sir please create another video like this.

[@instagramaccount6748]

Create post grid

[@wpmaker]

Check out my Blog tutorial! We create a post grid there :)