update: as at now (5th Jan 2023) manifest.json 2 is deprecated. so if you're watching within this time, use (manifest_version:3) and remove "page_action" key and its values.
although its still giving me an error I removed all the stuff below "128": "/images/icon128.png" and changed the manifest number to 3 did I mess something up, sorry this is my first time doing this
For those of you who just like me wanted to ctrl+V ctrl+C "basics" here you are: { "manifest_version": 2, "name" : "", "description": "", "version" : "", "icons": { "16": "", "48": "", "128": "" }, "page_action" :{ "default_icon": { "16": "", "48": "", "128": "" } }, "content_scripts": [{}] }
I've wondered about this and looked into this a bit before, but I've never tried it out fully. Thanks for this walk-through! I wouldn't mind watching more episodes of this. Feedback for this video: the part about putting the icons in the manifest took quite long. I think it would be fine if you went over that a little faster.
@@ieatwebsites Hello i'm not sure if you'll respond to my request or even see it since this is an 9 month old video but I am wondering how to make it so that the backround changes to a new picture for example every 24 hours, so I can automatically get a new background every 24 hours.
here is the manifest file for anyone wondering also if you ever need to copy paste code from photos or videos just install the blackbox chrome extension it makes a few mistakes with comma and " those but you can just fix it up ok heres the code: { "manifest_version": 2, "name": "", "description": "" ,"version": "" ,"icons": { "16": "" ,"48": " " , "128": "" }, "page_action": { "default_icon": { "16": "" ,"48": "" ,"128": "" }, "content_scripts": [{}] } }
Damn you explained that so nicely! I had no idea how to make a chrome extension and always thought it's something only god-tier programmers can do but you broke that delusion of mine and for that THANK YOU!
first, i havent even got 2 mins into the video and i wish i could ask u a question already. understand, im genuinely brand new to this so im aware this is entirely a learning process, so with that in mind i completely appreciate anyone willing to take effort/time into teaching me a valued lesson :) at about 1:15 , u mention you will copy and paste the, "basics," referring to the foundation of the browser extension itself, is how i understood when u refer to as basics. i thought it was a good idea, you've been through this before and if its about efficiency, i understand and agree. i suppose with all of that being said im wondering, as someone who's brand new to this, am i supposed to do my best to copy that from what i see from da video into my own empty folder, create a file within that folder, named "manifest.json" then i can do my best to copy down from the video what u refer to as, "basics," the same exact way you do? that's my first question, does everything need to look exactly like how u have it, correct? all same spacing and everything? because i cant exactly tell how many spaces are in between certain characters. could u break this down to me? or point me in the direction of a video/forum where i can learn what im asking? i would genuinely appreciate that very much:)
hey! not sure how much coding experience you have, so apologies if i say something you alr know the person in the video is using visual studio code, and i'd suggest you download that since it's a pretty typical software among programmers. once you do, search up "visual studio code beginner tutorials" so you can get used to making files (which can help answer your first question). that'll also probably help you answer your second question about spacing, but regardless spacing doesn't really matter except for indentations (which you can do by pressing tab in visual studio code). lmk if you have any more questions, i'm happy to help!
How would I make the image stretched across the window not tiled Edit: I found a library about cssref (which is the same thing as the code in the css file) and I learned how to go into specific element classes and control a lot more. Unfortianently you cannot make it stretched but you can just change size
I've tried and it worked on google even though I had to change the image background to that one that you gave it seems that it's not available anymore. Then I tried with youtube and it didn't work, I wonder why...of course, I changed the matches link as well.
Very frustrating - this is the second Javascript / Chrome Extension where I followed along exactly and it didn't work. Would have been helpful if you copy and pasted your code for people to compare / follow along.
does this overwrite the existing css on a webpage with your new css file? or do you need to do a bunch of remove rules to get rid of conflicting css lines on the existing webpage?
I'm not sure. I think is like an extension of the css. But looks like normal CSS behaviour. If you say that x=1 at the beginning and later say that x=2... then x will be 2. and won't even matter that you wrote x=1 in the first place.
Ok, I got access to an IDE on replit. Now, I am downloading the file and then trying to upload the json file but it's greyed out when I try and upload the json.
Okay, I got super close - I am able to load the package and resolve all errors. However, I am facing one last problem - the google home page is not showing the image I selected :( It's just going black... Any tips?
Hey...this is an Amazing tutorial and walk through...do you have any idea as to how can we create a chrome extension that can help us autofill the job applications like workday one. I know some extensions exist that are similar but they are not really that efficient...or if you could point me to a similar resource. Thank you for this video and your help :)
Thank you for this perfect tutorial Can you please help me I want to make a site blocker addon that blocks a specific page or account not all the site and have the ability to block a whole site too. I am trying to develop a non profit site blocker addon for schools and I am having hard time as I am so new to programming I am trying to make it so it can check a url site like pastebin every time the browser opens and take the urls I post in post pastebin and add it to block list (I will update the list daily so I need it to check it every time the browser opens) And I want to make the list encrypted students cannot take blocked urls from the addon So can you please help like guide me to tutorials or links that explain these things or make a video about it so it will be content for the channel too Thank you very much and sorry for requesting many things I am lost and confused
@@greenwiener with an extension we can' t access to the settings of chrome or something like that? because the presence or not of a cross this kind of thing is relative to the software code, so if the extension access to some variables of chrome it should be able to change that
@@greenwiener with an extension we can't access to the settings of chrome or something like that? because the presence or not of a cross this kind of thing is relative to the software code, so if the extension access to some variables of chrome it should be able to change that
update: as at now (5th Jan 2023) manifest.json 2 is deprecated. so if you're watching within this time, use (manifest_version:3) and remove "page_action" key and its values.
tysm I was watching and google kept giving me errors
although its still giving me an error I removed all the stuff below "128": "/images/icon128.png" and changed the manifest number to 3 did I mess something up, sorry this is my first time doing this
also you gonna make sure you have, scripts.js, popup.html files in your directory. you can replace the names tho.
You're welcome.
@@1mrnewton I don't really know what you mean by that why do I need a scripts.js and popup.htlm file and what do they need in them?
For those of you who just like me wanted to ctrl+V ctrl+C "basics" here you are:
{
"manifest_version": 2,
"name" : "",
"description": "",
"version" : "",
"icons": {
"16": "",
"48": "",
"128": ""
},
"page_action" :{
"default_icon": {
"16": "",
"48": "",
"128": ""
}
},
"content_scripts": [{}]
}
thanks
god bless you :v
Thanks
youre a legend
thanks!
I've wondered about this and looked into this a bit before, but I've never tried it out fully. Thanks for this walk-through!
I wouldn't mind watching more episodes of this.
Feedback for this video: the part about putting the icons in the manifest took quite long. I think it would be fine if you went over that a little faster.
Thank you so much timo! Yes! Sometimes I focus on thing that are not very important 😂
@@ieatwebsites Hello i'm not sure if you'll respond to my request or even see it since this is an 9 month old video but I am wondering how to make it so that the backround changes to a new picture for example every 24 hours, so I can automatically get a new background every 24 hours.
the manifest part wasn't much help. he copy and pasted all that code and didn't tell us where we could get it
@@ieatwebsites Hey can you link the basic code for me? I have had trouble finding it, and I have to type it out manually.
@@ureo_umbreon8601 yes tht would be very helpful
This opened my mind 10x instead of using c# to control the browser Use this 😂
🤯
A nice ‘hello world’ for chrome extensions. Thanks! Looking forward to diving in.
You welcome! 😄
Pretty simple and to the point, for beginners like me.
Not to the point at all he spent 1/3 talking about images so he could reach 10 minutes and monitize
here is the manifest file for anyone wondering also if you ever need to copy paste code from photos or videos just install the blackbox chrome extension it makes a few mistakes with comma and " those but you can just fix it up ok heres the code:
{
"manifest_version": 2,
"name": "",
"description": ""
,"version": ""
,"icons": {
"16": ""
,"48": " "
, "128": ""
},
"page_action": {
"default_icon": {
"16": ""
,"48": ""
,"128": ""
},
"content_scripts": [{}]
}
}
ur awesome
They should pin your comment👍
Thank you Sir. This was perfect for my use-case. I just wanted to remove/hide a few things I did not want to see from a website I use regularly. 😁
This helped me gain a better understanding of how to start building a google extension. I appreciate you bro! Keep up the good work. New subscriber
That’s great! You are very welcome.
Damn you explained that so nicely! I had no idea how to make a chrome extension and always thought it's something only god-tier programmers can do but you broke that delusion of mine and for that THANK YOU!
This icon can't have 16x16 px the quality is too high!! I changed the dimensions with a photo editor and a 16x16 px icon is very very bad quality!
This was a great intro video. Thank you so much! Definitely going to play around with chrome extensions now!
Thank you!!
in 3:14 you say it is 16 pixels, however below it says 154x154, does it not have to be 16? can it be any random dimensions as long as it is a square?
Can you make a video for manifest version 3?
Ig this is outdated
I'm grateful for the knowledge that you have given me, truly a good place to start.
can i have the manifest.json file so i can copy and paste
I watched other videos but I didn't like it
You are just excellent
A great effort in zooming in on the screen, explanation and everything
Thank you
Glad you liked the videos. You are welcome! 😁
the code didnt work for me idk why, can you put it somewhere so that i can copy and paste it?
hello I had an idea but I don't know if it can be done with a chrome extension, could you tell me what you think about it
Thank you a lot for this tutorial
need more tutorials if possible about creating chrome extensions.
Will manipulating page css stop working, because Alphabet is Implementing Manifest v3 right now?
.json file not showing up in load unpacked
the image for the background of the search engine isn't working for me. any ideas why?
Great starter tutorial! Thank you!
Thank you!
Such a good tutourial.
Really helpful mate! Great content! Wish you will create more content like these! Good luck! 😊
Thank you so much. 😁
why there is no chrome extension tutorials , there is just videos like this that shows you how to install google chrome
I just did it for the first time! Awesome video! Thank you!
thank you so much you inspired me
This was great. Almost exactly what I was looking for. Guessing we can add an array of domains to matches?
i want to add JavaScript and do automatic things like checked in 1000 cells ratio
You can probably do that by calling the js in the json
Thanks man!
wholesome video
first, i havent even got 2 mins into the video and i wish i could ask u a question already. understand, im genuinely brand new to this so im aware this is entirely a learning process, so with that in mind i completely appreciate anyone willing to take effort/time into teaching me a valued lesson :) at about 1:15 , u mention you will copy and paste the, "basics," referring to the foundation of the browser extension itself, is how i understood when u refer to as basics. i thought it was a good idea, you've been through this before and if its about efficiency, i understand and agree. i suppose with all of that being said im wondering, as someone who's brand new to this, am i supposed to do my best to copy that from what i see from da video into my own empty folder, create a file within that folder, named "manifest.json" then i can do my best to copy down from the video what u refer to as, "basics," the same exact way you do? that's my first question, does everything need to look exactly like how u have it, correct? all same spacing and everything? because i cant exactly tell how many spaces are in between certain characters. could u break this down to me? or point me in the direction of a video/forum where i can learn what im asking? i would genuinely appreciate that very much:)
hey! not sure how much coding experience you have, so apologies if i say something you alr know
the person in the video is using visual studio code, and i'd suggest you download that since it's a pretty typical software among programmers. once you do, search up "visual studio code beginner tutorials" so you can get used to making files (which can help answer your first question). that'll also probably help you answer your second question about spacing, but regardless spacing doesn't really matter except for indentations (which you can do by pressing tab in visual studio code). lmk if you have any more questions, i'm happy to help!
@@jujipotle thank you! appreciate your thoughts and time :) gon go learn
Best intro on how to create extensions for Chrome, thanks
where can i find the script for manifest.json?
best for getting started . upload website permission based videos if you can.
I have done all the things correct but the extension isn't loading
how do i get those shadows on the window corners on windows 10, like the old ones
Great Thanks
😀 thank you for making tutorial
You are very welcome. 😁
thanks man
How would I make the image stretched across the window not tiled
Edit: I found a library about cssref (which is the same thing as the code in the css file) and I learned how to go into specific element classes and control a lot more. Unfortianently you cannot make it stretched but you can just change size
my google background is not working
i have followed each steps but still
Thank you, this was a great way to start learning Chrome development! Awesome!
thank you
fudge I'm on a Chromebook I need to learn how to make files on this thing
Is it possible to share information between two different peoples extensions
For example if P1 types in bean it will show up for P2
I would also like to know the answer to this
I already made mine, but I'm getting stucked by security bs(not really) and my js script isn't running.
thanks a lot
tysm!!!!
I've tried and it worked on google even though I had to change the image background to that one that you gave it seems that it's not available anymore.
Then I tried with youtube and it didn't work, I wonder why...of course, I changed the matches link as well.
I am also trying it right now but my extension is not activating do u know why ??
Manifest version 2 will be deprecated, use version 3 and instead of "page_action" you shall put "action"
Can i have the start you copy pasted in to the document at the start?
This was pretty straightforward
What a clear explanation man, really appreciable 🙌🙌🙌, great
You're a life saver, just what I wanted. Thanks!
thanks!
I love you
How do I get the star that makes it a "wildcard"?
Very frustrating - this is the second Javascript / Chrome Extension where I followed along exactly and it didn't work. Would have been helpful if you copy and pasted your code for people to compare / follow along.
yeah
How to Remove all ads and replace with my photos, text, link in javascript chrome extension, can you send code or some hints
Thank you !!
Keep going the good work ❤️❤️
how the photo link came from where u used in CSS
how do i do this but for youtube
does this overwrite the existing css on a webpage with your new css file? or do you need to do a bunch of remove rules to get rid of conflicting css lines on the existing webpage?
I'm not sure. I think is like an extension of the css.
But looks like normal CSS behaviour. If you say that x=1 at the beginning and later say that x=2... then x will be 2. and won't even matter that you wrote x=1 in the first place.
It doesn't appear when I search things on google
New world！
the backgroung image is not covering over 'images' 'gmail' and my account
really cool for beginners thank you
You welcome!
Who can help me create a Chrome Browser Extension for my SEO Tool website please ?
Wers the browser u uysed to get that script up called\
how can this extension be added as bookmarks
?
my exstention is still gray :(
thank you! will be building a chrome extension thanks to this tute
Have fun!
Quick question: Is is required to register as a developer in chrome app store to upload and test your extension?
To upload, yes, to test, no. To test, just enable the developer mode on the extensions page and upload your extension’s folder.
Nice,I got what I needed,thanks ,such a clear explanation,love it
but how do i make it so it appears everywhere?
what is the difference between manifest v2 and v3 regarding this video ?
from 2023 manifest v2 will no more work
Super helpful! Thank you.
How do I make my vs code look good like yours?!?!
You can create your own theme or install a theme.
@@ieatwebsiteswhat are your settings? Show pls!!!!!!!!!!!!!!!!!
can I use this in sublime text also?
Yes!
I am just starting out. Dumb question: But what's the IDE on the left? How do I get that?
Ok, I got access to an IDE on replit. Now, I am downloading the file and then trying to upload the json file but it's greyed out when I try and upload the json.
Okay, I got super close - I am able to load the package and resolve all errors. However, I am facing one last problem - the google home page is not showing the image I selected :( It's just going black...
Any tips?
🙋im here for first tim e for subscribing
how do i get that coding thing
What is the program you are using on the left window the whole time when you are coding? Kinda new into this and would appreciate if anyone replies.
visual studio
@@andper0 Thanks
It's Visual Studio but you can just do it with file explorer if you want.
@@Visoriz Thanks bro
I cant load icon idk why i was followint the tutorial
it said:Could not load icon 'images/icon16.png' specified in 'icons'.
Could not load manifest.
make sure your file path is correct
You will have to Load the image as a separate file in the same folder
Love this. Can you tell me a way to execute some js?
i made one
No clue how to do this in windows 10 instead of Mac. I could fumble around in the dark I guess.
Why do you have to point to at least 3 different logo files in your manifest? Why not just point to a svg single vector images and be done?
Oh my gosh this was great! Thank you, can I ask why manifest has to be set at 2?
it is 3 now
Hey...this is an Amazing tutorial and walk through...do you have any idea as to how can we create a chrome extension that can help us autofill the job applications like workday one. I know some extensions exist that are similar but they are not really that efficient...or if you could point me to a similar resource. Thank you for this video and your help :)
Really clear.
Awesome thank you ☺️👍
You welcome!
Thank you for this perfect tutorial
Can you please help me I want to make a site blocker addon that blocks a specific page or account not all the site and have the ability to block a whole site too. I am trying to develop a non profit site blocker addon for schools and I am having hard time as I am so new to programming I am trying to make it so it can check a url site like pastebin every time the browser opens and take the urls I post in post pastebin and add it to block list (I will update the list daily so I need it to check it every time the browser opens) And I want to make the list encrypted students cannot take blocked urls from the addon So can you please help like guide me to tutorials or links that explain these things or make a video about it so it will be content for the channel too Thank you very much and sorry for requesting many things I am lost and confused
good luck
Hello, I have a question, is it possible with an extension to remove the cross at the top right corner to close the window?
no. it's a part of a window not a website.
@@greenwiener with an extension we can' t access to the settings of chrome or something like that? because the presence or not of a cross this kind of thing is relative to the software code, so if the extension access to some variables of chrome it should be able to change that
@@greenwiener with an extension we can't access to the settings of chrome or something like that?
because the presence or not of a cross this kind of thing is relative to the software code, so if the extension access to some variables of chrome it should be able to change that
how can replace code
A beginner like me doesn't know what program you're using on the left side of the screen. I guess I need the pre-beginner...
That's Visual Studio IDE.
It's vscode, this will work in any text editor