Complete Responsive E-Commerce Website Using HTML - CSS - JavaScript - PHP PDO | Admin Login
ฝัง
- เผยแพร่เมื่อ 28 ก.ค. 2024
- how to make a complete responsive multi pages ecommerce website design using html css javascript php pdo from scratch.
create a complete responsive back end ecommerce website design template using html css javascript php pdo step by step.
the main feature of this website are:
✅ responsive header with toggle menu effect using vanilla javascript.
✅ responsive home slider using swiper.js
✅ responsive category slider using swiper.js
✅ responsive home products slider using swiper.js
✅ responsive about page.
✅ responsive reviews slider using swiper.js
✅ responsive contact page.
✅ responsive orders page.
✅ responsive shop page.
✅ responsive user register page.
✅ responsive user login page.
✅ responsive user profile page.
✅ responsive quick products view page.
✅ responsive shopping cart CRUD page.
✅ responsive wishlist CRUD page.
✅ responsive checkout form page.
✅ responsive search page.
✅ responsive footer using css grid.
✅ responsive dashboard page.
✅ responsive products CRUD page.
✅ responsive product update page.
✅ responsive placed orders page.
✅ responsive messages page.
✅ responsive admin accounts page.
✅ responsive users accounts page.
✅ responsive admin register page.
✅ responsive admin login page.
✅ responsive admin profile update page.
Buy Me A Coffee :
www.buymeacoffee.com/mrwebdes...
* SOURCE CODES *
drive.google.com/file/d/1nnaU...
DOWNLOAD THE SOURCE CODE FROM GOOGLE DRIVE ( INCLUDES IMAGES ):
( *you are free to use this source code )
How To Download
Step 1 :- click the google drive link ☝☝☝
Step 2 :- click on download link in the google drive.
Step 3 :- extract the zip file into your desired folder.
Step 4 :- open the converted files into your browser.
Step 5 :- open your editor and put your unzipped files into it and then edit it as you like.
font awesome cdn link:
cdnjs.com/libraries/font-awesome
google fonts:
fonts.google.com/specimen/Nunito
clip-path generator:
bennettfeely.com/clippy/
Editor : - visual studio code with Laetus: Dark Vibrant Theme
Browser : - google chrome
UI Tool : - Figma
localhost : xampp
Images / Video / SVG : -
01 - www.freepik.com/
02 - storyset.com/
03 - undraw.co/
04 - pixabay.com/
05 - unsplash.com/
06 - pixabay.com/
07 - www.flaticon.com/
08 - pngtree.com/
09 - www.pngegg.com/
New To My Channel Subscribe Now And See More Stuff Like This:
/ mrwebdesigneranas
timestamp:
0:00 demo
9:53 file structure
10:20 admin login form
#BackEnd
#Ecommerce
#MultiPages
![BOWKYLION - เจ้านายคะ (work-life imbalance) [Official MV]](http://i.ytimg.com/vi/6bFj8G2pOi4/mqdefault.jpg)
kudoos to you sir. completed 1 hr of this tutorial and felt like everything is so well explained that even begineer can easily understand. I am going to add this project in my resume with some modifications
Demo is just awesome
Excelente video, Mr. Web, sigue adelante,....
Thank you for your work
But i just have a question please
What are the php extensions that you use on you visual studio code ??
And how do you debug your php files ??
So nice I try it please make a study web in which we ask questions to public and answers by public with ratings and upload questions and answers of classes subject chapter s
Top, aprendi muito com este site, me ajudou muito.
Undoubtedly the best series to follow for ecommerce webiste. The code is so crystal clear to understand. He covers everything from start to end and videos are very very easy to follow. Just go for it.
But how to run this code and launch on google? I have edited the code...i need to launch it for business store purpose how to do it?
your work is awesome
can you please give a playlist link of this website in which it is made from scratch
Hi ,super nice work. i love it .Do you appear to code in POO too? that would be awesome
Very very beautiful ❤
I have tried your full stack food ordering website it was just awesome! No doubt this website will also be a great project 😃
hello sir do you know why does it show me error when I input 'admin' and '111' in the admin php?
It show me error when I input 'admin' and '111' in the admin how can solve
Is it possible to convert the php desktop form into a mobile application? Thank you so much!
How to covert this template to use with blogger website.?
is there a paiement section , for example VISA or mastercard ?
thanks for sharing such a greet job .i have a Q , if more than one users on the website and they both adding products in the cart , will have the same items in the cart ? or each user has his own cart ?
I have a solution for that as well
watch this video : th-cam.com/video/YfXDXzFjWQc/w-d-xo.html
every user can use cart with their unique id's
sir dont we have out of stock feature in this??
For those who're wondering why they can't see 'messages' by clicking on 'see messages' in admin dashboard, this is because sir has written messagess.php instead of messages.php, just remove the extra 's' of messagess.php in 'dashboard.php' file.
do you know why does it show me error when I input 'admin' and '111' in the admin php?
@@tayabasultanahossain585 same problem
@@tayabasultanahossain585 did you found the solution?
@@Avishek0109 are u using XAMPP server or another one
hey , help me , how we can add external product listing file in products and work it as same as in previous one
Admin login not working, showing incorrect password
Tbm não consigo fazer o log in
Please before you connect the admin how do you register his credentials on the database. I try on my way but it don't work
I cant reducd margin so img can be look big
how do I run the php files on chrome?
At SHOP BY CATEGORY, when it's a different name, it doesn't show up. I would like another name to be displayed.
no orders in the order page can u help me?
@Mr.web designer how can i add more than one product for example its only allowing me to enter one watch for the watch category but i want to insert more. Waiting for your reply i have project submission tomorrow
how can i change the dollar to peso?
Thank you so much sir for such an awesome website.
💗💗
Sir pls tells us that how you have added default values in admins table before admin login for the first time because im unable to logging in successfully in admin login page ...
i got the same problem
did you resolve it
Sir please make lots of tutorial like this project
Sure I will
I see that some trainings on TH-cam are using MySQLi, why you are not using it? does this mean that your code is vulnerable and risky/old ?, do you recommend using this way of coding or try to use mySQLi in coding with PHP ?
I use php pdo these days
How can I increase the statistics of people who visit my website?
❤
Can you add sub categories?
small question please, if I removed the user sign in from the backend, is that going to create a mess with the process of buying products for instance later on: EX: Imagine two people are trying to buy at the same time, so the backend is going to include the work of both and this is going to create a confusion in my opinion, am I right ?!
yep it going to mess up because signing creates a unique id for each user which is necessary to identify each user otherwise you will be confused which use buyed which product and the use won't be able to use wishlist and add to cart functions as well!
sir how to add product in category?
whenever i'm just upload your source code into live site it's not working phpmyadmin can not upload complete shop_db.sql files
How can I change the currency?
Why don't I see the steps to create each field in the dataBase database? Why don't you do that extra step in the video?
Nice
Thanks
@Mr. Web Designer I can't log in, they tell me it's incorrect. In your database in the "admins" table there is the Options section there is "admins" and a password in mine it does not appear.
Can you help me ? I really want to finish the project.
Same problem....please sir help us
@Mr. Web Designer i have tried working at the same time with you using this video but the admin login ain’t working and the sha1() also ain’t encrything in my database
Help me please
😓
how do your write sha1 for your passwords? show me the codes
Could you share the html part of the code ?
What tool did you use to change the dimensions at 26:17 ?
its no tool. Just click the three dot in the top of chrome nav bad -> more tools -> developer tools -> the toggle of device at the left most corner
nav *bar
products are not showing what should i do?
upload the product using admin panel,
watch this for help : th-cam.com/video/1BSpFRtVN7Y/w-d-xo.html
@@MrWebDesignerAnas yes I did that thanks 👍👍
what is AUTO_INCREMENT in admins table?
that means the 'id' or any number will be unique and automatically increment whenever new data is stored in database tables
@Mr. Web Designer i have tried working at the same time with you using this video but the admin login ain’t working and the sha1() also ain’t encrything in my database 😢 am kind of lost…! But this is the first part
show me your code!
copy and paste it in reply section!
@@MrWebDesignerAnas i saw the mistake. In your code you wrote $select_admin->rowCount() > 0
I just had to change > 0 to ==1
@@ndongueplouise6341 it doesn't work for me
@@experiance_williams it not going work!! Mine worked when I did insertion through a form
@@ndongueplouise6341 you can share the code ?
hello, where is the html part? thank you
How to add stock information
How can i change the dollar sign with my country's currency sign?
watch this for help : th-cam.com/video/rkeGg_ZyLuM/w-d-xo.html
excuse me sir, i tried to change the default username and password like example change the pass from 111 to admin, but it failed, can you help me ? i also change the database but it doesn't work
i m also facing the same problem, can you help if you resolved it
Good day sir. when I edit the PHP file, the website doesn't update at all. How can I fix this? I hope you'll respond.
You probably need to clear your cache. On Chrome, press Ctrl + Shift + Delete
Please, I work off-line, and when I turned on the site, I just worked, but the aesthetics disappeared, and I think the reason is Library awesome.
Yess bro ! It's because of CDN but it's very useful
Hi Mr. Web Designer i downloaded this and modify it because i have a project on my subject called Web Development and Technologies, do you want to see the improvements of this? I have it more features i added with stock, vouchers payment gateways including PayPal using API JavaScript SDK, Light and Dark Mode toggle, Media Queries so it can access to tablet, android and pc etc.
BTW Thanks for this :)
please post the documentation of this project
Sir i changed category img but it looks small pls help
use
object-fit:cover;
to fit the image according to your size
if i delete of change in any CSS file their nothing will be changed
?
why this happen with drive code?
use ctrl + f5 for cache refresh
@@MrWebDesignerAnas thank you so much
Mobile details option in table
Hi Mr. Web Designer thanks for your work you make a good job! please I have a questions on admin login page.... I enter username and password default but it's not working .... Where is problem?
same problem
same problem 😢
Same
hello brother how do i add admins information on database. if i insert it manually its not working.
Please help
open admin panel! and you can update admin user info from there
its good job and thanks for sharing the source code. but i have one question,,,,message in admin page could not deleted why??????????????
how did you login as a admin ? help me plz
where is the timestamp when adding pictures in database???
Hi it not connecting to z datebase??
watch this for help : th-cam.com/video/1BSpFRtVN7Y/w-d-xo.html
Cant delete messages
Can you help me in admin_login.php i was unable to login even after including data in the database.Kindly help me out on this.
i got the same problem
i've got the same problem as well. have you found a fix as i am still confused.
Mere vs code me Filtet sanitize ka option nahi a raha he
Please give me solution of this problem...!
download the extions for php in your vs code editor
@@MrWebDesignerAnas thanks
Where can I find the admin login panel please? Help
write admin in the link bar in front of project file
sir, how to open registration admin ?
you can find the admin_login file in the source and open it in the localhost
how to add images of the product using mysqladmin ?
watch this for help : th-cam.com/video/1BSpFRtVN7Y/w-d-xo.html
I have uploaded images but it is showing this error
Sir it has a database connection
yes! it has database in it as well
hi, great work! but i did encounter a problem which was: at the end when trying to login and progress to the next file it just doesnt do it and displays the error message. would this be a database connection issue? if so would you know how to fix it so that the login works correctly. thank you
watch this for help : th-cam.com/video/1BSpFRtVN7Y/w-d-xo.html
How to add products ?
watch this for help : th-cam.com/video/1BSpFRtVN7Y/w-d-xo.html
hello mera incorrect username or password ho raha he par login success nahi ho raha if else me maybe kuch prob he can you help me ??????????????
did you imported the database in your phpmyadmin panel first then first register if you are using it as a user
and if you are using it as a admin
the default password is : 111
and username = admin or admin@gmail.com
Same problem
Give me a second part
what did u do after 10:05...please tell
I dragged and dropped the project folder in the vs code editor and start editing!
@@MrWebDesignerAnas thanks
Sir png image kha se download karte ho
uska bhi link description main hai
@@MrWebDesignerAnas Maine download kya tha lekin PNG image background se white hoti hai
How to get shop_db database in phpmyadmin ?
watch this : th-cam.com/video/1BSpFRtVN7Y/w-d-xo.html
@@MrWebDesignerAnas it is good way to understand this!!!!!!!!!!!!!!!!!!!!
why its always incorrect username or password ?
did you imported the .sql file in your phpmyadmin panel first?
you can register admin or user first!
@@MrWebDesignerAnas thankyou for answering
@@MrWebDesignerAnas please where can i find the sql file
Idk why but login nhi horaha hai
did you imported database in your phpmyadmin panel?
@@MrWebDesignerAnas yes i wll but fir bhi incorrect username or password aa raha he
what is the function of this code, please ? ->>>>>>> oninput="this.value = this.value.replace(/\s/g, '')"
it removes the space line from the field wich means no one can enter the space text in the field!