Love it, thanks for the tuts! For anyone wondering, Laravel updated their package.json, which doesn't include SASS so here is what worked for me: { "private": true, "scripts": { "dev": "npm run development", "development": "mix", "watch": "mix watch", "watch-poll": "mix watch -- --watch-options-poll=1000", "hot": "mix watch --hot", "prod": "npm run production", "production": "mix --production" }, "devDependencies": { "axios": "^0.21", "laravel-mix": "^6.0.6", "lodash": "^4.17.19", "resolve-url-loader": "^3.1.2", "sass": "^1.32.8", "sass-loader": "^11.0.1" } }
For anyone wondering, Yes, it is worth your time. Watch the tutorial; it is really impactful. It's straightforward and clear. I have learned a lot from this, and I don't usually write comments.
1:54:11 the funniest thing here is that u write border : 0 ; at the bottom and u was asking why the the border is not showing hehehe , Thanks mate for your efforts
Great tutorial. There is unfortunately not very much information at all about custom theming with WooCommerce on UA-cam, thankfully this video came to the rescue. Very much appreciated!!
coming from some one who watches lot of these videos , u r one of the best , right up there the way u explain everything precise but very efficient , u r rock star , thanks a lot .
I posted a comment earlier where I voiced some critique about you using SCSS and NodeJS(npm) and such. While my opinion still stands I just wanted to say that this tutorial has been really valuable for me and that I appreciate you taking the time to make this video!
Hey mate. Thank you. I know its a bit of a shit tutorial, focusing on stuff that's probably not needed. I'm going to re-do a WooCommerce tutorial that is more focused on hooks and actually getting it working on a blank theme already created. All the best mate
@@mrdigitalau Can't wait for it to drop. In the meantime I'm still busy following the WordPress Theme Development From Scratch series which is actually very good and probably the best out there. Once again thanks for putting in the time/work to educate the dev community!
I've had the pleasure or rather displeasure of working with woocommerce, and there's a hell of a lot of junk to wade through to stylize it. Still better than magento though! Great tutorial though, I personally would have left out the basic home / about pages etc as you've covered that in the other videos. I thought about writing my own small custom e-commerce plugin, but then there's the backend to completely style. That being said this is one of the best 'english' woocommerce tuts on youtube so far.
You explain everyting in nice and easy way. Great content. Could you create more videos for example: how to create custom plugin in php for woo or how to make some changes in existing plugins? Or something about backend in php usefull for woo or about API and how to connect it. Thank you!
Thank you very much sir. This is an amazing tutorial. I have been looking for things forever. This marks a new beginning in my web designing.. Thanks again.
For your hosts on mac you can simply open your terminal and type sudo nano /etc/hosts then voila enter in your new host and save and exit (shortcuts will be displayed at the bottom of the terminal for you, the exit shortcut is to save too)
Hi great tutorial I loved it I have implement it I am getting problem showing products at shop page when I click shop no data show can you help where I am wrong
this tutorial is perfect for my current project which is redesigning an existing Woocommerce website. Just want to know if its better to create a custom theme than use a theme builder like Elementor or Page Bakery? My personal choice is to create a custom theme, but I need to consider the time and effort it will take. I have plenty of experience in web development using Angular, HTML5 and SASS, but none in woocommerce and wordpress, so there might be a steep learning curve to consider..
Thanks Johndel, appreciate it. In my honest opinion, a custom coded theme will always be better than one using a drag and drop page builder. It will be faster and you won't need to know the ins and outs of a pagebuilder or have a reliance on it. At the end of the day, time is money, so if you can achieve what you need to do to make money then do what you think is best. I can only tell you what I would do. Good luck mate!
This is an outstanding tutorial, covering a lot of necessary details. I have a confusion and request you to please guide me. Please let me know, how to install nodejs and laravel on hosting server? Are we allowed to install such softwares on servers and which tool or tools do we use ? Your answer will be highly appreciated. Thanks
Alot of things make sense to me now. I thought alot of it was coded by some genius (maybe in the beginning), but now I see that it is mostly imports and npm. I would have never known. I should have come here when you first uploaded.
I've been programming for a decade now, mostly software tho, done a few years of web dev too but not with WordPress, this is why I'm here. It helped me a LOT. You seem extremely experienced. But it kinda bothers me your indentation, 8 spaces indentation? but the worst part is that you're not even consistent, I saw you do 12 and 4 spaces indentation too. This and the closing of the php tag to just open another one in the next line made me cry a little bit. I just think it's much cleaner like this... instead of this But maybe you did like that because you were thinking ahead and knew you would put some HTML in between those bad boys(which I don't really know if you did, because I skipped the stuff I already knew). Regardless, great video, appreciate it.
Amazing tutorial. A lot to learn in a short period of time. I am following your webpack setup (34:15) the exact steps and it doen't work. Probably because since then Webpack has been updated?! but in the video you are creating the webpack.mix.js inside the theme folder. If you run npm start watch after this it is going to break, unless you create webpack.mix.js up in your project folder (same level as package.json), but then you have to create the src folder here there as well at the same level (./src). Can you help me with the configuration please? How do I set the webpack config to look for the webpack.mix.js where you saved it? (inside the theme folder)
@@riponroy116 I am not sure if it is good practice how I have solved it, but I just moved the webpack.mix.js file to be in the root folder instead of in my theme folder and then changed the configuration in it to point to the .scss and .js files inside the mytheme/src folder. It works.
Good way to start! THANKS =) Just another way to tweak the columns issue (for instantce, in 1:52:00, and in 1:56:00) is to overwrite the styles in your custom SASS file, such as: .woocommerce-columns, .u-columns, .col2-set { @extend .row; } .col-1, .col-2{ @extend .col-lg-6; } This way you don't need to mess with the woocommerce files
Great tutorial, many thanks 👍 Current WordPress tutorials are really hard to find on UA-cam, or anywhere as far as I know? It would be great if you could make more theme & plugin development tutorials? Your teaching is concise and comprehensive, cheers. 😀👍 Just out of interest is there any specific reason why you didn't use local by flywheel?
Thanks Sean, appreciate your feedback mate. Hope it helped. I guess I'm just used to XAMPP , will check out Flywheel and maybe do a tutorial with it in future :) Cheers
@@mrdigitalau Yeah , I think its good to show the XAMMP way too. I find flywheel a bit laggy at times, but like I said its hard to find understandable WP tutorials. You could get a little niche going mate. Cheers. 👍
Great tutorial I'm following you step by step and pausing to enter the codes because I'm determined to build a online store without paying a website designer.
1:22:00 for the sidebar, i have a problem, my problem is i has add 2 side bar. for example page sidebar in this lesson i already design it with css but for the second side bar i create it in new div but it class or id still same as page side bar. my question is how i can do it in dfferent div with different id or class. oh my english hope you understand sorry for my english im using google translate
Would you happen to have a tutorial where you customize the country and state dropdown? Would be awesome, as I'm currently stuck in that part of the checkout page.
Hey Mr Digital, thanks for helping me get started with developing my own website! I just have a query, now that I've taken it live :) Any changes I make to the CSS don't appear on the site. For example changing the font color in _header.scss, whether in cpanel or the theme editor, doesn't appear on the live site, or in the source code. Even after clearing the cache, and trying various browsers on different devices. Does this mean I have to make the CSS changes on localhost, then upload the files to cpanel every time?
Hey Paul, You're welcome mate. Yes that is right. SCSS is a pre-compiled version of CSS. You need to compile your SCSS using NPM RUN WATCH/NPM RUN PROD (When you are ready to go live) and it will compile it all and put it into the CSS file. Maybe just upload the new version of the CSS. otherwise, just edit the CSS file in your theme. It is not the best way to go about it, ideally you would use something like GitHub which you would push your changes to and then you can pull the updates from your server - but I will need another tutorial for that :)
Thanks so much for posting this tutorial! It took me an embarrassing amount of time to get through it lol... I had to start over many times. Largely due to the fact that the webpack is different on the website now... There were two things I still can't figure out... 1) I couldn't get the border to work on the check out forms even when I typed !important... 2) My payment method for the checkout does not have any forms for some reason... It's just a space that you can't type in? I tried inspecting and playing around but still can't figure it out.
Is it realy necessary to add 150mb node package on my server that will slow my page just because of Sass? Isn't better just compile with live sass VScode extension and only upload plain css?
Absolutely not. You shouldn't be putting the node modules folder on your server anyway because it is only needed locally. Upload your theme without the node modules folder :)
Are you on Udemy? Reason I ask is: I've taken a few courses on WordPress on Udemy, and this tutorial is better than just about every one of the courses I paid for. Something about the way you present the information and process makes it all clear and easy to digest. If you do get on Udemy, please post a link.
I am stuck at 10:00. I am on a Mac and first issue was to find the httpd-vhosts.conf file (it is through a different path that I found it). After editing this file and my host file and changing the urls in wp-option, I have woocommerce.test (in google) showing me my folder structure with the folder wordpress, and when I click on it got the error: this woocommerce.test page can't be found. Can anyone help me with that ? :/ Thanks for your tutorial Mr Digital ! ;)
Thanks for your video. I made my theme following your video. but i can't explain why i haven't my footer when I create new pages... ? and also, why I can't update those new pages with the plugin Elementor....
@@mrdigitalau I fixed it! In fact I just forgot an "e" in my function dynamic.sidbar() on my page sidebar.php so WordPress couldn't found the function. Hihi thank you for your quick answer. Now I am looking for a toggle menu for my main menu.
Mr. Digital, Followed the directions to setup laravel copied into webpack and packagejson and getting a mess of errors. 95 packages are looking for funding run `npm fund` for details found 33 moderate severity vulnerabilities run `npm audit fix` to fix them, or `npm audit` for details followed a few suggestions on npm site and nothing has worked. wondering if it works for you using current script version on githib?
Hey , thanks for the video , i coundt have the node_modules after running the commend npm install : giving me this : up to date, audited 1 package in 451ms does anyone have a solution for this issue ?
This has been great! I would really love to use vanilla CSS for this, but can't seem to make media queries work. It seems to completely ignore them. Do you have any idea why that might be? Thanks again.
@@SeanFreitas @media screen and (max-width: 900px) { .menu { display: none !important; } } before this I set it up with display: grid. That works. If I switch them around then it doesn't display at all, so it seems to be ignoring the media query. Thanks!
@@SeanFreitas Well, I tried a bunch of tests and it doesn't seem to catch the media queries. All other css works fine. I started to put together the laravel webpack, but I'm a beginner using Atom on a mac, so I need to figure that out. I've never had this trouble with a media query.
Hello sir, I want to add woocommerce in available theme , how to achieve this? I have html theme and I am creating a header.php,footer.php,index.php,function.php,style.css file also create woocommerce folder and paste file in theme-woocommerce from to woocommerce plugin but i am not getting product page content proper visible please help me
"Allowed memory size of 524288000 bytes exhausted (tried to allocate 262144 bytes) in C:\xampp\htdocs\wordpress\wp-includes\cache.php on line 126" That's when I finished the functions.php file at 32:15 Some help?
Really nice and useful video! Many thanks, Mr Digital! I would like to know if is it possible to divide my JS files and import them as we can do in SASS? If so how can I import files in my app.jss? I'm currently learning this world of Backend development and it fascinates me!
Hello, I am facing problem in woocommerce checkout page.whenever i refresh page it didnt reset blocks fields of checkout page and even if i close tab and open again with checkout link,data didnt reset.help me
Hi.. Thanks for the tutorial. I'm a beginner in web development (wordpress) and this helped me a lot. I'd like to know, instead of template-shop.php, I can also create pages like page-cart.php, page-checkout.php and configure as it should be?
Hello! Yes absolutely. Doing it that way will mean the actual page needs to be called Cart, or Checkout. So if someone changes the name, it will actually not work. So it's probably better to use templates as opposed to relying on the name if that makes sense.
Hello Mr Digital, I'm having an issue about 24/100 score in lighthouse. Would like to know if it's better to write it manually rather than use the elementor & plugins?
Love it, thanks for the tuts! For anyone wondering, Laravel updated their package.json, which doesn't include SASS so here is what worked for me:
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "mix",
"watch": "mix watch",
"watch-poll": "mix watch -- --watch-options-poll=1000",
"hot": "mix watch --hot",
"prod": "npm run production",
"production": "mix --production"
},
"devDependencies": {
"axios": "^0.21",
"laravel-mix": "^6.0.6",
"lodash": "^4.17.19",
"resolve-url-loader": "^3.1.2",
"sass": "^1.32.8",
"sass-loader": "^11.0.1"
}
}
Thank you!
thank youu
The unsung hero.
For anyone wondering, Yes, it is worth your time. Watch the tutorial; it is really impactful. It's straightforward and clear. I have learned a lot from this, and I don't usually write comments.
1:54:11 the funniest thing here is that u write border : 0 ; at the bottom and u was asking why the the border is not showing hehehe , Thanks mate for your efforts
This is an excellent tutorial.
I would REALLY love a part 2 on how to go deeper into WooCommerce and add more functionality.
Hey thank you! Yes I am looking into doing this please subscribe and you will be notified once it becomes available :) Cheers
@@mrdigitalau Can't wait for that! Thanks so much Mr Digital!
@@mrdigitalau Would love to watch part 2
Me too really !
part 2 master!!! thanks for the class!!
39:31 "I will show you the power, my young padawan!" :D You are a great teacher. The first video that makes it all clear. Thank you!
Thanks Alex :) Appreciate it man
Great tutorial. There is unfortunately not very much information at all about custom theming with WooCommerce on UA-cam, thankfully this video came to the rescue. Very much appreciated!!
Thank you no problem you are welcome
coming from some one who watches lot of these videos , u r one of the best , right up there the way u explain everything precise but very efficient , u r rock star , thanks a lot .
I've been looking for the tutorial like this for months, thanks for the great lesson.
You're welcome Usama!
I posted a comment earlier where I voiced some critique about you using SCSS and NodeJS(npm) and such. While my opinion still stands I just wanted to say that this tutorial has been really valuable for me and that I appreciate you taking the time to make this video!
Hey mate. Thank you. I know its a bit of a shit tutorial, focusing on stuff that's probably not needed. I'm going to re-do a WooCommerce tutorial that is more focused on hooks and actually getting it working on a blank theme already created. All the best mate
@@mrdigitalau Can't wait for it to drop. In the meantime I'm still busy following the WordPress Theme Development From Scratch series which is actually very good and probably the best out there. Once again thanks for putting in the time/work to educate the dev community!
@@mrdigitalau did this get made? 2024 now and struggling to find any tutorial on coding a woocommerce theme from scratch!
Mr. Digital, make some long more advanced WordPress tutorial on Udemy. We will buy it. You are the best instructor on WordPress I have seen.
And done i have build an client theme watching this tutorial Thank you so much dear.
Thank you very much! all tutorials are all I really needed. excellent specific .. really great!! appreciate you all!!
Fantastic, great tutorial. Very simple and understanding. I appreciate your efforts. Thanks!!!
Excellent tutorial, absolutely great. If you are new to WP or not. Useful no matter your level
Thanks Jorge!
I've had the pleasure or rather displeasure of working with woocommerce, and there's a hell of a lot of junk to wade through to stylize it. Still better than magento though! Great tutorial though, I personally would have left out the basic home / about pages etc as you've covered that in the other videos. I thought about writing my own small custom e-commerce plugin, but then there's the backend to completely style. That being said this is one of the best 'english' woocommerce tuts on youtube so far.
Senior Developer looks like this ;)
Love your tuts.
I enjoy your tutorials. They are full explained and consistent!
Glad you like them! Take care Roman
You explain everyting in nice and easy way. Great content. Could you create more videos for example: how to create custom plugin in php for woo or how to make some changes in existing plugins? Or something about backend in php usefull for woo or about API and how to connect it. Thank you!
Thanks man you help me so much I wish you the best of luck and every success in business.
What shall i say, all i have to say is just thank you for this video you are just awesome in fact you are a philanthropist.
Haha, thanks very much. Glad you enjoyed.
Great Tutorial! Very clear and specific. Thanks a lot.
Que tutorial mas completo! una joya de verdad ;) Thanks a lot for this, gonna help me to start building eCommerce from scratch.
Thanks for this tutorial, it is very great and it'll help me with e-commerce in wordpress. I like so much your tutorial.
No worries Danillo - you're welcome mate!
Thanks.. . explained simply. Expecting more tutorials on different topics
Sure 👍 More to come soon mate!
very great tutorial u have made I not only understood the woo-commerce but I also got how to use web pack very very interesting
Thank you very much sir. This is an amazing tutorial. I have been looking for things forever. This marks a new beginning in my web designing.. Thanks again.
The guide that I really need right now, thanks!
You're welcome :) Good luck
This is how tutorials should be.
PID(s) are processus ID given by windows to each service and program you start, the same PID you'll see in task manager
Thanks mate. Appreciate it :)
You are the king of WP IMHO
For your hosts on mac you can simply open your terminal and type sudo nano /etc/hosts then voila enter in your new host and save and exit (shortcuts will be displayed at the bottom of the terminal for you, the exit shortcut is to save too)
This is a wonderful tutorial. Only needed some basic info about theme building for woocommerce, but the whole tutorial is great.
Thanks mate. Appreciate it
Hi great tutorial I loved it I have implement it I am getting problem showing products at shop page when I click shop no data show can you help where I am wrong
this tutorial is perfect for my current project which is redesigning an existing Woocommerce website. Just want to know if its better to create a custom theme than use a theme builder like Elementor or Page Bakery? My personal choice is to create a custom theme, but I need to consider the time and effort it will take. I have plenty of experience in web development using Angular, HTML5 and SASS, but none in woocommerce and wordpress, so there might be a steep learning curve to consider..
Thanks Johndel, appreciate it. In my honest opinion, a custom coded theme will always be better than one using a drag and drop page builder. It will be faster and you won't need to know the ins and outs of a pagebuilder or have a reliance on it. At the end of the day, time is money, so if you can achieve what you need to do to make money then do what you think is best. I can only tell you what I would do. Good luck mate!
@@mrdigitalau didn't expect a quick response like that. thanks for the advice! i'll take the risk and go w/ custom coded theme.
Thanks!
Awesome video! Really helped me understand how WordPress works
This is an outstanding tutorial, covering a lot of necessary details. I have a confusion and request you to please guide me. Please let me know, how to install nodejs and laravel on hosting server? Are we allowed to install such softwares on servers and which tool or tools do we use ? Your answer will be highly appreciated. Thanks
Alot of things make sense to me now. I thought alot of it was coded by some genius (maybe in the beginning), but now I see that it is mostly imports and npm. I would have never known. I should have come here when you first uploaded.
I've been programming for a decade now, mostly software tho, done a few years of web dev too but not with WordPress, this is why I'm here. It helped me a LOT. You seem extremely experienced. But it kinda bothers me your indentation, 8 spaces indentation? but the worst part is that you're not even consistent, I saw you do 12 and 4 spaces indentation too. This and the closing of the php tag to just open another one in the next line made me cry a little bit. I just think it's much cleaner like this...
instead of this
But maybe you did like that because you were thinking ahead and knew you would put some HTML in between those bad boys(which I don't really know if you did, because I skipped the stuff I already knew).
Regardless, great video, appreciate it.
Amazing tutorial. A lot to learn in a short period of time.
I am following your webpack setup (34:15) the exact steps and it doen't work. Probably because since then Webpack has been updated?! but in the video you are creating the webpack.mix.js inside the theme folder. If you run npm start watch after this it is going to break, unless you create webpack.mix.js up in your project folder (same level as package.json), but then you have to create the src folder here there as well at the same level (./src). Can you help me with the configuration please? How do I set the webpack config to look for the webpack.mix.js where you saved it? (inside the theme folder)
Did you able to solve it? If then could you share the solution?
@@riponroy116 I am not sure if it is good practice how I have solved it, but I just moved the webpack.mix.js file to be in the root folder instead of in my theme folder and then changed the configuration in it to point to the .scss and .js files inside the mytheme/src folder. It works.
this is a nice tutorial, please, please, we need part 2, but more deeper into woocommerce
Thanks 3000 times sir for this effort which makes my big problem resolve
Good way to start! THANKS =)
Just another way to tweak the columns issue (for instantce, in 1:52:00, and in 1:56:00) is to overwrite the styles in your custom SASS file, such as:
.woocommerce-columns,
.u-columns,
.col2-set
{
@extend .row;
}
.col-1,
.col-2{
@extend .col-lg-6;
}
This way you don't need to mess with the woocommerce files
what a gem of channel. awesome stuff :)
This is a best WooCommerce tutorial I've ever seen, thank you sir!
Thanks Evgeny, much appreciated!
Really professional. I'm not even trying to make my own Wordpress theme but I'm hooked nonetheless XD
Thanks heaps, much appreciated!
very helpful video to any one who wants to learn wordpress development
Guess i watched 5 minuets of this and you got yourself a new subscriber ;) thanks, for this great tutorial and specially for the timestamp.
Thanks Poya appreciate it! Cheers
Very useful totorial, many thanks! I kindly ask, why to build a theme from scratch when you can use Rey theme?! 🤔
Excellent Work Mr. Digital!! Cheers
Great stuff sir. Could you please make a video how to develop or maybe customise woocommerce product layout?
and/or woocommerce product widgets ?
amazing tutorial, would love more custom woocomerce theme tutorials if you get a chance to make them
Thanks for creating this tutorial!! This is exactly what I was looking for. It's really comprehensive and I've learnt so much from it. :)
Thank you very much :)
Great tutorial, many thanks 👍 Current WordPress tutorials are really hard to find on UA-cam, or anywhere as far as I know? It would be great if you could make more theme & plugin development tutorials? Your teaching is concise and comprehensive, cheers. 😀👍 Just out of interest is there any specific reason why you didn't use local by flywheel?
Thanks Sean, appreciate your feedback mate. Hope it helped. I guess I'm just used to XAMPP , will check out Flywheel and maybe do a tutorial with
it in future :) Cheers
@@mrdigitalau Yeah , I think its good to show the XAMMP way too. I find flywheel a bit laggy at times, but like I said its hard to find understandable WP tutorials. You could get a little niche going mate. Cheers. 👍
Great tutorial I'm following you step by step and pausing to enter the codes because I'm determined to build a online store without paying a website designer.
1:22:00 for the sidebar, i have a problem, my problem is i has add 2 side bar. for example page sidebar in this lesson i already design it with css but for the second side bar i create it in new div but it class or id still same as page side bar. my question is how i can do it in dfferent div with different id or class. oh my english hope you understand sorry for my english im using google translate
Please upload a video to adapt the woocommerce single product page into a figma draft.
Amazing tutorial, luoooouved it. Really helped me :)))))
Would you happen to have a tutorial where you customize the country and state dropdown? Would be awesome, as I'm currently stuck in that part of the checkout page.
great tutorial!many thanks.
subscribed - waiting for another great video woocommerce.
very helpful video...excellent for basic theme from scratch.
9:07 - why did you drag the file to the desktop and edit it there instead of doing that in the etc folder?
It doesn't seem to allow you to edit it within that folder. Anyway - check out Laragon my friend, much better solution than XAMPP.
Thank you ! It's really helpful when we start working with WordPress ;)
Hey Mr Digital, thanks for helping me get started with developing my own website! I just have a query, now that I've taken it live :) Any changes I make to the CSS don't appear on the site. For example changing the font color in _header.scss, whether in cpanel or the theme editor, doesn't appear on the live site, or in the source code. Even after clearing the cache, and trying various browsers on different devices.
Does this mean I have to make the CSS changes on localhost, then upload the files to cpanel every time?
Hey Paul, You're welcome mate. Yes that is right. SCSS is a pre-compiled version of CSS. You need to compile your SCSS using NPM RUN WATCH/NPM RUN PROD (When you are ready to go live) and it will compile it all and put it into the CSS file. Maybe just upload the new version of the CSS. otherwise, just edit the CSS file in your theme. It is not the best way to go about it, ideally you would use something like GitHub which you would push your changes to and then you can pull the updates from your server - but I will need another tutorial for that :)
@@mrdigitalau Awesome, I'll just upload it then :) I wouldn't mind another tutorial haha, thanks again!
Hi,
Thank you for your great tutorials
excellent video !
That's necessery to use bootstrap with woocommerce ? I don't use a framework
Hi Gaetan, definitely do not need to use Bootstrap -I just use it because it's very popular....
Thanks so much for posting this tutorial! It took me an embarrassing amount of time to get through it lol... I had to start over many times. Largely due to the fact that the webpack is different on the website now...
There were two things I still can't figure out...
1) I couldn't get the border to work on the check out forms even when I typed !important...
2) My payment method for the checkout does not have any forms for some reason... It's just a space that you can't type in? I tried inspecting and playing around but still can't figure it out.
Excellent Tutorial. Waiting for part 2
Is it realy necessary to add 150mb node package on my server that will slow my page just because of Sass?
Isn't better just compile with live sass VScode extension and only upload plain css?
Absolutely not. You shouldn't be putting the node modules folder on your server anyway because it is only needed locally. Upload your theme without the node modules folder :)
How do you list themes on search on Wordpress theme store Thanks
Thank you Sir!!!!! :) Really helpful. Must watch tutorial! The best so far :)
Thanks for this tutorial, it's great.
Just one question, how would I configure webpack with this setup to refresh the browser on save?
1:41:00 woocommerce start (note for myself)
at about 43:00 you might get an error at npm run prod
just run this its for the bootstrap 5 "npm install @popperjs/core"
Are you on Udemy? Reason I ask is: I've taken a few courses on WordPress on Udemy, and this tutorial is better than just about every one of the courses I paid for. Something about the way you present the information and process makes it all clear and easy to digest. If you do get on Udemy, please post a link.
Hi Yumei, No i'm not on Udemy but I am looking into it - thank you and I will let you know :) Cheers
I am stuck at 10:00. I am on a Mac and first issue was to find the httpd-vhosts.conf file (it is through a different path that I found it). After editing this file and my host file and changing the urls in wp-option, I have woocommerce.test (in google) showing me my folder structure with the folder wordpress, and when I click on it got the error: this woocommerce.test page can't be found. Can anyone help me with that ? :/
Thanks for your tutorial Mr Digital ! ;)
Thanks for your video.
I made my theme following your video. but i can't explain why i haven't my footer when I create new pages... ? and also, why I can't update those new pages with the plugin Elementor....
Hi Zeineb. You are welcome. Do you have a copy of the code you are using on your page? Please paste it in here. Cheers
@@mrdigitalau I fixed it! In fact I just forgot an "e" in my function dynamic.sidbar() on my page sidebar.php so WordPress couldn't found the function. Hihi thank you for your quick answer.
Now I am looking for a toggle menu for my main menu.
I’ve a website on IONOS using Wordpress will me setting the hosting up effect that website or do I need to do something to host the website myself?
i got the problem i cant see my js or css file on view source page but i added them into function.php file correctly.
Mr. Digital, Followed the directions to setup laravel copied into webpack and packagejson and getting a mess of errors. 95 packages are looking for funding
run `npm fund` for details
found 33 moderate severity vulnerabilities
run `npm audit fix` to fix them, or `npm audit` for details
followed a few suggestions on npm site and nothing has worked. wondering if it works for you using current script version on githib?
i'm from Brazil, excellent tutorial yours
Listen How can I make the template wider. I want the website that I working on be a bit wider instead of blog width.
Recommend post the files on Github for reference and bookmarking sections of the video
small work for some huge improvement for viewers
Great tutorial
Bro, AWESOME! . Keep up with new videos! really helpful, Thanks a lot.
Hey , thanks for the video , i coundt have the node_modules after running the commend npm install : giving me this : up to date, audited 1 package in 451ms does anyone have a solution for this issue ?
This has been great! I would really love to use vanilla CSS for this, but can't seem to make media queries work. It seems to completely ignore them. Do you have any idea why that might be? Thanks again.
Hey Billy, show us what your media query looks like, cheers!
@@SeanFreitas
@media screen and (max-width: 900px) {
.menu {
display: none !important;
}
}
before this I set it up with display: grid. That works. If I switch them around then it doesn't display at all, so it seems to be ignoring the media query. Thanks!
@@SeanFreitas Well, I tried a bunch of tests and it doesn't seem to catch the media queries. All other css works fine. I started to put together the laravel webpack, but I'm a beginner using Atom on a mac, so I need to figure that out. I've never had this trouble with a media query.
why should we install vue/axios and other dependencies?
Dude, where you involved in the creation of the wordpress software ? i've rarely seen someone so knowledgeable on the matter !
Hello sir, I want to add woocommerce in available theme , how to achieve this?
I have html theme and I am creating a header.php,footer.php,index.php,function.php,style.css file also create woocommerce folder and paste file in theme-woocommerce from to woocommerce plugin but i am not getting product page content proper visible please help me
"Allowed memory size of 524288000 bytes exhausted (tried to allocate 262144 bytes) in C:\xampp\htdocs\wordpress\wp-includes\cache.php on line 126"
That's when I finished the functions.php file at 32:15
Some help?
Really nice and useful video! Many thanks, Mr Digital! I would like to know if is it possible to divide my JS files and import them as we can do in SASS? If so how can I import files in my app.jss? I'm currently learning this world of Backend development and it fascinates me!
Hello, I am facing problem in woocommerce checkout page.whenever i refresh page it didnt reset blocks fields of checkout page and even if i close tab and open again with checkout link,data didnt reset.help me
how to show the different types of products?
Hi.. Thanks for the tutorial. I'm a beginner in web development (wordpress) and this helped me a lot. I'd like to know, instead of template-shop.php, I can also create pages like page-cart.php, page-checkout.php and configure as it should be?
Hello! Yes absolutely. Doing it that way will mean the actual page needs to be called Cart, or Checkout. So if someone changes the name, it will actually not work. So it's probably better to use templates as opposed to relying on the name if that makes sense.
@@mrdigitalau Thank you. It perfectly makes sense
It is excellent work....If I follow this way to develop theme ,can i sell this any platform?
I agree with previous comments, this is an amazing tutorial.
Thanks Dragan appreciate it mate!
Hello Mr Digital, I'm having an issue about 24/100 score in lighthouse.
Would like to know if it's better to write it manually rather than use the elementor & plugins?
Thanks. Love from Bangladesh.
How you setup webpack? I can't do it. I'm from Bangladesh.
Amazing tutorial.. Thank you very much.
Great vid! What if I want to display my products on my frontpage?
Hey Zachary you can use a short code
@@mrdigitalau thanks!