Wordpress Website Tutorial Course - Full 2023, Blog, WooCommerce, LMS, SEO, Page Speed Performance

Super-course: websquadron.co.uk/how-to-star...
Book your 1-2-1: websquadron.co.uk/socials
Flexbox Container Website with Blogs, Woo, LMS Courses, SEO & Kick-Ass Page Speed.
00:00 Intro
01:12 Domain & Hosting
03:33 Wordpress Settings
08:25 Plugins
be.elementor.com/visit/?bta=2...
wordpress.org/plugins/phastpr...
wordpress.com/plugins/wp-meteor
wordpress.org/plugins/code-sn...
10:22 Performance Settings
11:06 Code Snippets
Performance = • How to Boost Page Spee...
Codes = websquadron.co.uk/page-speed-...
Safe Mode = • Code Snippets - How to...
Purge = • Purge your Wordpress W...
14:02 Elementor Settings
16:09 Canva Images & the Colour Palette
www.canva.com/en_gb/
webaim.org/resources/contrast...
19:10 Compress images to WebP
bulkresizephotos.com/en
20:57 Image Titles
21:44 Custom Load Fonts
22:19 TTF to WoFF2
www.fontsquirrel.com/tools/we...
25:00 Add New Page
25:25 Elementor Interface
26:22 Global Colours
27:47 Global Fonts
29:20 Page Speed with Plugins/Snippets
31:00 Page Speed without Plugins/Snippets
pagespeed.web.dev/
32:33 Site Favicon
35:47 Templates
38:26 Header Templates
46:03 Create Menu
54:55 Header Display Conditions
56:23 Home Page
58:58 Footer to remove the Temporary One
01:01:19 Check Page Speed
01:02:20 Hero Banner
01:06:30 ChatGPT for content
01:15:23 Check Page Speed
01:16:06 Build the Rest of the Home Page
01:45:55 Check the Page Speed
01:47:39 Duplicate Page Plugin
01:48:27 About Page
02:00:15 Contact Page
02:13:35 Add Alternate Header
02:18:26 404 Template
02:21:30 Socials Page
02:29:37 Footer Template
02:31:46 Dynamic Year & Copyright
02:33:23 Privacy Policy, Cookies Policy, Accessibility Statement
websquadron.co.uk/product/sha...
02:35:47 Add Privacy & Cookies Policy to the Footer
02:41:15 Add Posts
02:45:33 Post Archive Template with Loop Grid
02:58:04 Post Archive Display Conditions
02:59:42 Blog Page
03:00:33 Add Gridbuilder for Post Filtering
wpgridbuilder.com/
wpgridbuilder.com/add-ons/ele...
03:04:11 Add Posts to the Home Page
03:06:50 Single Post Template
03:12:36 Single Post Display Conditions
03:13:05 Side Bar Template
03:23:37 Check Page Speed.
03:24:11 Add Woocommerce
wordpress.org/plugins/woocomm...
03:31:22 Woo General
03:32:37 Woo Products
03:34:20 Woo Tax
03:35:15 Woo Shipping
03:37:08 Woo Payments
03:39:15 Payment Gateways: Stripe & PayPal
03:45:00 Woo Accounts & Privacy
03:45:29 Woo Emails
03:46:15 Woo Advanced
03:47:53 Woo Multicurrency
03:49:07 Adding Products
03:52:14 Product Categories
03:53:00 Product Attributes
03:54:14 Product Details
04:02:05 Variable Product
04:09:03 Products Archive Template with Loop Grid
04:28:58 Products Archive Display Conditions
04:27:09 Duplicate Cart, Checkout Pages
04:29:21 Shop Page
04:31:49 Add Gridbuilder for Product Filtering
04:43:08 Single Product Template
.woocommerce div.product form.cart .variations th {
background-color: #ffffff;
text-align: left;
padding-left: 0px;
padding-top: 18.5px;
}
.woocommerce div.product form.cart .variations td {
background-color: #ffffff;
}
04:56:44 Single Product Display Conditions
04:59:12 Edit the Cart & Checkout Pages
05:01:49 Styling Cart Page
05:06:27 Styling Checkout Page
05:09:15 Styling My Account Page
.elementor-281 .elementor-element.elementor-element-00afd39 .woocommerce .wc-proceed-to-checkout .checkout-button { margin-bottom: 20px;}
05:15:36 Shipping Type based on Cart Total
www.codesnippets.cloud/snippe...
05:18:25 Add Cart to Menu
05:19:45 Adjust Headers
05:30:14 Add LMS Courses
05:34:03 Course Delivery Page
05:36:56 Course Promo Page
05:47:27 Exclude Courses from the Shop
05:50:45 Exclude Courses from Single Product
05:51:39 Separate Template for the Courses
05:53:52 Courses Display Conditions
05:55:50 Restrict Access to the Courses
wordpress.org/plugins/page-re...
05:59:58 Set Virtual Products to Autocomplete
www.codesnippets.cloud/snippe...
06:04:00 Adding RankMath
wordpress.org/plugins/seo-by-...
06:06:22 Google Search Console Connection
06:07:38 RankMath wizard & settings
06:16:46 Google Search Console & Google Analytics (GA4)
search.google.com/search-cons...
06:24:12 Home Page SEO
06:35:32 Products SEO
06:38:01 Posts SEO
06:38:47 Page URLs SEO
06:40:14 Instant Indexing
06:41:25 Initiate Indexing & Submit Sitemaps
06:43:53 404 Monitoring & Redirection
06:44:55 Tips on Backups, Security, & Font Clamp()
Clamp Responsiveness: • Why Clamp() improves R...
Backups: • Amazing FREE Backup an...
Security: • All in One WP Security...
06:47:26 Outro :)

[@SimoneWoodsArtist]

I’ve said it before, but I’ll say it again. THIS IS BRILLIANT. Thank you Imran. I’ve set aside next week to completely redo my website following this tutorial. As you suggest, I went and had a look at websites of others in my industry (some quite famous) for ideas, and even those who had their websites professionally designed/developed, had loads of problems. Especially on the mobile versions. I was shocked. You say this is a simple website you’re demonstrating but it way above what’s out there for most. The only feedback I have is perhaps add a quick vid in links about staging area/subdomains for those like me redoing a live website. (I had to go to another channel for that info as I had no idea). 😮 Love this channel - thanks again Imran.

[@jaoortega]

This is not just your biggest tutorial ever. This is the best free resource I've ever seen in the internet. Looking at the description content, truly well thought-out!👌 I will have to spare a day to munch on this efficiently. My team will benefit from this as well. Thank you Imran for doing this! We appreciate you all the way. All the best to your career.🎉

[@websquadron]

Big thanks Jao

[@dailypromos6477]

What a video tutorial it's a complete guide, Thank you so much for your effort !

[@BradK02]

Let me like this before watching. 6 hour video, that deserves a like.

[@DIYDollarBills]

Just went through the first hour and very detailed

[@ramjelico4043]

I've spent over $1000 on a course that shows less 20% of the intricate details explained here. Exceptional tutorial!

[@websquadron]

Many thanks - PS that was done 1 year ago. The updated and more intricate course is now here: learn.websquadron.co.uk

[@droneadventures.731]

Finally a person who knows the frontend and attaches importance to semantic aspects. Hats off. Thanks for the tutorial. I thought that I would not find anything meaningful on KZbin about WP. Greetings Imran.

[@websquadron]

Thanks :)

[@ARod75699]

Dang man. I can't wait to dig in and learn. Thank you for your hard work and giving so much to the community. GOD bless.

[@alexandersorbas1881]

Best guy on the internet !!!

[@tomtaox4]

This is the holy grail created from beskar steel, filled with beskar bars, delivered on a beskar plate of web building.... Amazing work, thank you :)

[@JohnXionidis]

This is a gem! Thank you very much for this video!

[@audunjemtland8287]

Your tutorials are the best on youtube. Others should learn from you. And you are soothing to listen to. It's reeeeally important.

[@fahadhafeez8086]

Very Well Structured. Thanks Imran.

[@paulinakaminska7788]

Wow! What a marathon 💪🏻 great job, thank you👍

[@marekrabiasz1175]

Dziękujemy.

[@mr.ransome4024]

This is how every KZbinr Teacher should teach, from start to finish, from 1 to 1835? I really like this video. To tell you the truth I slept through about 1/3 of it (12:00 AM start) BUT I know that most KZbinr Teachers leave 2/3 sitting on the table and say "Do this on your own time" or "Hey party people" (not good In my opinion just plain bad) The question is do you have something like "JNews" I really like that theme! I would pay you to do one! ONE MORE TIME, YOU ARE A GREAT KZbinR TEACHER. Please keep up the exceptional work. Please JNews? It is now 5:10 in the morning. Have a nice day. I will join your channel

[@websquadron]

Hehe. I don’t have a JNews or similar site but jump over to our Web Squadron Facebook Group

[@cablo69]

Well deserved the membership for this tutorial. I wished i had this tutorial in the past. Absolut gorgeous. Thx man

[@TheJanrig]

Excellent tutorial 🎉👏🏼

[@TheDesiMarketer]

You are amazing Imran. Thank you!

[@MelTaylor]

Wow. Excellent work Imran. Nicely laid out. Easy to access specific topics. Thank you.

[@TravellingWithKash]

Thank you for this video!!! So much value in one video.

[@MD_jadaan]

all in one .. bro u braked the roof of WordPress courses -- Love u

[@websquadron]

Big thanks!

[@poprostualik2400]

Incredible tutorial, the best one I could imagine. Top notch quality of teaching, lots of surprisingly funny inserts, reasoning behind actions very well explained, I am definitely going to support this channel and purchase the paid version of tutorials- big thanks for all of that 🙌

[@websquadron]

Glad it was helpful!

[@HarishKumar-qb2ns]

Eagerly awaited video 😍😍😍 Thanks Imran…

[@coffeebot3000]

This is amazing. I'm going to have to set aside some time to go through this 7 hour monster. Thank you, Imran!

[@harbourdogNL]

This is massive. Thanks for all the sheer hard graft in putting this together. It's going to be a huge help to me. Every vid you do is always educational. Elementor should have you as their video person, really.

[@brianlangley7412]

Wow, just wow. I don't know whether to thank you profusely or hate you for being so good :)

[@hrrokib1193]

Thank you very much. Don't change like others.❤

[@nidarahman2305]

Wow. Can't wait to follow this

[@mrlou_st]

Thanks for all the value! Hope the bests 4 ur proyect

[@mikemarks5706]

This is a very good video to watch - Yes it took me 4 days but well worth it - Thank You very much

[@theproductivemanager]

My goodness!!! I loved every second of this tutorial!! Thank you thank you thank you 🌟 The way you teach is so captivating - interesting, easy to follow, fun and entertaining all at once. Thank you once again 💖

[@mammythailand]

Wonderful and so useful ! Thanks a lot

[@danielrindraniaivo6141]

Waiting for your biggest tuto ever. thanks Imran this is a very efficient tuto I must admit

[@ImakIlaha]

Great tutorial!!! 😊 Thank you vey much!!!

[@IsotonikStudios]

This may take me as long to work through as it did for you to edit, so much golden stuff!!

[@blaz667]

Amazing! Thank you so much. 👍

[@jonathanbanks1972]

Been waiting for very long time, like a year, look forward getting back into it 😁 will update once site done ❤

[@Mobilecat1]

Thank you so much sir this is incredible course

[@websquadron]

You are most welcome

[@malikyasirsattar1483]

great work can not wait to get started and start learning

[@webnim-uk]

Thank you so much, great job, lots of amazing information! :)

[@WirewalkerDon]

I cannot recommend this enough!🔥🔥🔥I have a lot of Wordpress experience and am truly happy to find someone that knows all of the little secrets that most experts miss. And your thoroughness is outstanding (even deleting non-essential files). Just straight up honest and solid advice. Thank you!

[@sergiurus4115]

well done! it`s finally out, appreciate the hard work :D

[@websquadron]

Now, I will crash and burn on my desk.

[@vivianaknight3750]

Thank you for this amazing video!!!!

[@jlucyk]

Amazing video!!!!

[@Melissa_Lawrence]

Omg, 6 hours!!! Wicked❤❤❤❤

[@webtappers7863]

AMAZING!

[@JubranZakri]

Wow, Imran, your tutorial is absolutely awesome! , I learned so much from it and discovered many useful tools that I didn't even know existed. Your explanations were clear and easy to understand, which made following along a breeze. Thank you so much for putting in the time and effort to create such a helpful resource. I really appreciate it!

[@shaveenarosh7657]

6 hours!!! Thank you for your great effort

[@RAGE_2024]

Amazing video, amazing work 👏, very professional 👍

[@MariaFernanda-sh6he]

Thanks for this great tutorial. You are awesome. I am looking forward to buy your course.

[@websquadron]

Big thanks :)

[@diolievecbdproducts8378]

27:06 My new Ringtone........

[@bardai21]

Great video! Very informative and organized. ;)

[@ahtishambsr]

That's one of the best tutorials I've ever seen about WordPress. Thank you.

[@websquadron]

Wow, thanks!

[@FahadNazirRyk]

Very informative Tutorial. Thank you for sharing 🙏

[@paulburgess4954]

Awesome content, it's redefined the way I have built my site. Wish I'd had all this info 12 months ago. A breath of fresh air, it feels like I've been wading through treacle now. Imran I can't thank you enough!

[@websquadron]

A better course with Step by Step Notes is coming in 2 weeks!

[@neomirozow1586]

This tutorial is an absolutely brilliant job, Imran!! Watched every minute for last 4 days and took a tune of notes and link references. Thanks you so much!

[@websquadron]

Glad it helped!

[@phkoon]

That's an AMAZING tutorial! I'm amazed on how I didn't get to it until now. There are so many useful tips. I'll still get to watch every bit of it, but for now I'm searching for how to set a FAQ which is friendly for the clients to edit it

[@robertrado7576]

Just started, but great ideas, thanks!

[@mahbubjubayer9453]

Wow🎉, watching now

[@visualmodo]

Truly good work!

[@TheBandoCouple]

I've decided I'm going to scrap the current website and redo it from scratch using your tutorial for reference. You covered,a lot of key essentials early on that are absolutely tedious having to do later on down the road, especially pertaining to media files. Resizing 16gb worth of images is going to be a blast 😂

[@websquadron]

Sounds to me like the images need shrinking down in size for sure! Good luck and keep me posted on how it goes :)

[@MrMediatoday]

Very nice and useful information video- thank you 🙏 ❤

[@Darkacademyowner]

Really good tutorial Imran. Need more like that

[@websquadron]

The latest and more in-depth versions are now here: learn.websquadron.co.uk

[@onorlidmedina]

Awesome tutorial 👍🏻great work

[@alain_laroche]

Thanks! This tutorial is amazing!

[@websquadron]

Big thanks!

[@shanafaganphotography2486]

omg this video is pure gold!!! and thank you so so much for taking the time to create and actually give out this for free!! You have no idea what those website speed options in particular did for my website since before!! massive difference in page insights!! Thanks a mill!:)

[@websquadron]

Thank you so much!!

[@andraszsigray7220]

Thank you very much! Its a very nice job, you are a good teacher!!!

[@websquadron]

Thank you! 😃

[@MainstreamEnt]

Hey thanks I wanna thank you for all your tips I finally implemented about 88% of everything you put out there on my website and now my page speed is 85 once I get rid of bookly and there 8 plugins we will get that 93% lol I just haven’t found a replacement yet

[@alexd1931]

Hi Imran, this video couldn't have come at a better time. It covers a few things I was questioning in detail. Thank you for doing this, probably one of the best tutorials on how to build a website using Elementor!

[@websquadron]

Big thanks Alex

[@sergiokiselov1458]

Hi! Its great tutorial! Real course that we can watch and learn a LOT! Thank you and have a great day

[@websquadron]

Glad it was helpful!

[@claudiobrites5871]

Hey brother I gotta tell you I'm a webdesigner and grapgics designer since 2001 and this is exactly my "modus operandi" spot on! Just change UK for PT and Elementor for Beaver Builder. I'm switching to Elementor and found your video and that was the most perfect fit I could ever ask for. It was like a UK mirror thank you so much for the time it took you to do this, I hope you get a Million views. Thank you!

[@websquadron]

Big thanks for your amazing words :)

[@israelamos8896]

Thanks a million for this wonderful course. Please keep up the great job sir.

[@websquadron]

Most welcome!

[@JayMunoz760]

Good stuff 👌

[@fernandoeduardotejadaolive8212]

you are the best 👍

[@tunacagla6445]

Best ever. Much better than many paid courses. I watched the whole video. Now I will watch it again and go through it step by step and create my consulting business website. Starting with the pictures that I will need and the text and so on. Thank you very very much.

[@websquadron]

I may release a JSON File that has all of those as wireframes for FREE very soon.

[@chantscreen]

Many, many thanks. Looks fantastic and a major help! I'm sure that there will be a lot of people like me who'll have fingers crossed that you'll repeat in Bricks!

[@websquadron]

Soon yes. I wanted to get this one done, and then I will try something similar. It may be smaller in size, but will focus on the Full Site, Blogs, Woo. If this video doesn't get lots of views then i have to consider the unpaid time that goes into the big videos. This one took 62 hours!!

[@chantscreen]

It looks like it did take hours to perfect. Dedication! Thanks. PS. When you do the Bricks version is there any chance you could major on CSS Grid?

[@websquadron]

@@chantscreen CSS Grid seems to be the way to go with Bricks, so yes, I'll keep that in mind.

[@raptorcreate]

awesome work in advance. watch it later.

[@klefnet]

Didn't meet you earlier but greater video on KZbin

[@zackma]

I took your course on UI design strategy with WordPress over the course of two days. I found it to be very informative and helpful. You covered a wide range of topics, from the basics of UI design to more advanced concepts like responsive design and accessibility. I particularly appreciated the way you broke down complex concepts into easy-to-understand terms.

[@zackma]

I also appreciated the fact that you provided real-world examples throughout the course. This helped me to understand how the concepts I was learning could be applied to my own work. I would definitely recommend this course to anyone who is interested in learning more about UI design with WordPress.

[@maxitomix]

just been thru the first hout. HOLY MOLY THIS IS A TREASURE. Thank you so much!

[@websquadron]

You're very welcome!

[@maxitomix]

I am now more than 3 hours in. Still impressed. Very complete. I like your style. Will keep going.

[@abdulrehmanazharmahmoodbha1416]

Amazing

[@websquadron]

Thanks

[@alexandersorbas1881]

36:27 LOL f'n lovely !

[@anam7735]

Bravo 👏

[@anam7735]

I am a web designer from Serbia and I learned a lot from you, thank you Ana

[@saucydee1]

I had to rewind it to watch the satellite or whatever it was, go by at the beginning. lol

[@bhtanvin621]

BOOM 💥💥

[@rh619]

awesome

[@user-ch7xn6mk5l]

This very good video

[@websquadron]

Keep a lookout for a new course being launched tomorrow.

[@TheJanrig]

Thanks

[@websquadron]

Many thanks

[@IsmaelCalvimonte]

Genio!

[@claudiobrites5871]

Obrigado!

[@macdeesh]

I made once the filtering system, without plugin, by using tabs widget and short-code for the content of the tab. The tabs titles can be styled as buttons, and it works very well.

[@websquadron]

That would work really well too and I’ve used that as well especially now that we have the improved tab layout.

[@WilhelmCazimirovici]

Man, this is the best video that I found, complete and easy to understand! Beside this, PLEASE, PLEASE, PLEASE!!!!!!!!!!!!!!!!!!!!!! Tell ve how you did with those 3 monitors in da back, I am also a Star Wars fan and I really want to make one, the same, for my office room at home. I don't do internet, so your's will remain unique online. PLEAAASE!

[@websquadron]

I used the Atmoph 2 windows

[@WilhelmCazimirovici]

@@websquadron Thank you! You should ask them to pay you 🤷🏼‍♂️

[@WilhelmCazimirovici]

I'll use your sponsored link

[@alro7779]

I'm wasting too much time on trying to create a Menu Header like you, even after having installed the plugin you mentioned. I will follow you along on this tutorial anyway and try to get as much information as I can. I wish I could take your course, but I can't afford its price... and I'm not saying it's too much pricey, it's just that I don't have that money just now. Cheers!

[@websquadron]

The course is more abut business. This video will help you to build a site.

[@alro7779]

@@websquadron I'm planning to start a website creation business. Thanks!

[@perinho5349]

Awesome tutorial as usual Imran! In fact, your youtube channel is the only source I go to when it comes to Elementor. Do you suggest setting up rank math locally or I should do it once it goes live? Thanks!

[@websquadron]

Better to do it when Live in case the URL or links etc change address.

[@abdullahowolabi1351]

You've covered everything, A-Z, thank you for always being there, o the group and live chats every week, no one else does that, you deserve a gallon of Pepsi Max, I just finished the tutorial. Please I have a question though, why did you submit the posts and products sitemaps separately too when they were included in the first one automatically created by rankmath.

[@websquadron]

Just to be sure I submit them again to reinforce

[@annastahl7135]

Thank you so much for this video! I learned so much. Skipped everything about WooCommerce though since I won't have a web shop on my site. Feel like I missed the wrap up of what the site eventually looked like but I'll live with that ;) Question: if I have a "Coming soon" page up and WP maintenance mode activated - I suppose I won't be able to check the speed while I'm building?

[@websquadron]

No, but - you could test the actual home page URL and just leave WP Maintenance off. Just go to Wordpress > Settings > Reading > and set the Home Page to be the Coming Soon Page. Thus the URL = Coming Soon, and you can still test the Home Page Score.

[@CrystalRicotta]

I’m only 30 minutes in but good suggestions for the fonts - converting the true type font to woff‼️ Appreciating the Woo Commerce section too 💸

[@websquadron]

Awesome. I often don’t stress the Woff2 in previous tutorials so I want to make that I advise better :)

[@vinsuphub]

🔥

[@zohaibmalik5253]

stunning work ! sir kindly provides all the images that u have used in this website..

[@websquadron]

Keep an eye out next week when a new course comes out.