i have made one chrome extension and below is my manifiest.json file
{
"update_url":"http://clients2.google.com/service/update2/crx",
"name": "Example",
"version": "1.0",
"manifest_version": 2,
"description": "Example Dictionary",
"browser_action": {
"default_icon": "16x16.png",
"icons": ["128x128.png"],
"default_title": "Dictionary",
"default_popup": "index.html"
},
"icons": {
"16" : "16x16.png",
"48" : "48x48.png",
"128": "128x128.png" },
"content_scripts": [
{
"matches": ["<all_urls>"],
"css" : ["jqm-demos.css","jquery.mobile.min.css"],
"js": ["index.js","jquery.js","jquery.mobile.min.js"]
}
]
}
now when i load popup.html page is looking like
but when i load extension it will be look like
Your manifest file should look like this:
{
"update_url":"http://clients2.google.com/service/update2/crx",
"name": "Example",
"version": "1.0",
"manifest_version": 2,
"description": "Example Dictionary",
"browser_action": {
"default_icon": "16x16.png",
"icons": ["128x128.png"],
"default_title": "Dictionary",
"default_popup": "popup.html"
},
"icons": {
"16" : "16x16.png",
"48" : "48x48.png",
"128": "128x128.png"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"css" : ["jqm-demos.css","jquery.mobile.min.css"],
"js": ["index.js","jquery.js","jquery.mobile.min.js"]
}
]
}
According to your snapshot, you should assign "popup.html" to default_popup property. This field means which page do you want to be shown in popup dialog when user clicked the browser action icon.
Hope this is helpful for you.
Related
I don't know where came wrong. The chrome extension keep on showing error
manifest.json
{
"name": "CatExtension",
"description": "Coding train practice-communication between background script and content script",
"version": "1.0",
"manifest_version": 3,
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "/images/cat.png"
}
},
"background": {
"service_worker": "background.js"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"content.js"
]
}
]
}
background,js
chrome.action.onClicked.addListener(buttonClicked);
function buttonClicked(tab) {
console.log(tab);
}
It shows error
Where is the error?
I am developing a chrome extension. I want to redirect to a custom html page when new tab is created.
This is process.js file.
chrome.tabs.onCreated.addListener(function() {
alert("hello");
window.open('https://ucsc.cmb.ac.lk/', '_self', false);
});
This is manifest.json file.
{
"manifest_version": 2,
"name": "xxx",
"version": "1.0",
"description": "xxx",
"icons": {
"128": "icon128.png",
"48": "icon48.png",
"16": "icon16.png"
},
"browser_action": {
"default_icon": "icon16.png",
"default_popup": "popup.html"
},
"background": {
"scripts": ["process.js"],
"presistent": true
},
"permissions": [
"storage",
"notifications",
"contextMenus",
"tabs",
"activeTab",
"http://*/",
"https://*/"
]
}
alert is working. but it is not loading the page.
You are probably looking for Override Pages.
Add this code to your manifest file:
"chrome_url_overrides" : {
"pageToOverride": "myPage.html"
},
You can try this:
window.open('https://ucsc.cmb.ac.lk/', '_blank', false);
So I made a chrome extension but the "default_icon" under "browser_action" is not working for me. I can't see the icon when I reload the chrome extension. Is there something I might have been missed?
manifest.json
{
"name": "New Extension",
"description" : "Base Level Extension",
"version": "1.0",
"manifest_version": 2,
"content_scripts" : [
{
"matches" : [
"<all_urls>"
],
"js" : ["content.js"]
}
],
"background":
{
"scripts" : [
"background.js"
],
"browser_action": {
"default_icon": "icon.png"
}
}
}
I have the "icon.png" in the same folder and both "content.js" and "background.js" have 2 console.log statements which are working fine and showing up!
Try moving the "browser_action" block outside so it is not nested in the "background" block.
{
"name": "New Extension",
"description" : "Base Level Extension",
"version": "1.0",
"manifest_version": 2,
"content_scripts" : [{
"matches" : [
"<all_urls>"
],
"js" : ["content.js"]
}
],
"background": {
"scripts" : [
"background.js"
]
},
"browser_action": {
"default_icon": "icon.png"
}
}
https://developer.chrome.com/extensions/manifest
I want that if any of my webpage loads I want to simply display a simple alert on the page.
manifest.json
{
"manifest_version": 2,
"name": "Chrome Ext Demo",
"description": "chrome extension tuts",
"version": "1.0",
"content_scripts": [
{
"matches": ["http://*/* "],
"js": ["jquery.js","eventPage.js"]
}
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"tabs", "http://*/"
]
}
I have jquery stored locally in my chrome extension folder.
eventPage.js
$("document").ready(function(){
alert("hiii");
console.log("hii");
});
I am new to building Chrome Extension. Any help would be appreciated.
Please remove the useless space in your "matches": ["http://*/* "]field, it doesn't match a valid url.
If possible, remove useless permissions if they are not used.
{
"manifest_version": 2,
"name": "Chrome Ext Demo",
"description": "chrome extension tuts",
"version": "1.0",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["jquery.js","eventPage.js"]
}
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"tabs"
]
}
I'm developing a chrome extension, popup.html saves some data into extension's local storage (key:viewMode value:WYSIWYG)
When I'm trying to retrieve the data using Chrome Storage API from script.js, it says that viewMode is undefined.
Here is manifest.json
{
"manifest_version": 2,
"name": "LoremIpsum",
"description": "Dolor sit amet",
"version": "1.2.8",
"permissions": [
"http://*.exemple.org/*",
"storage"
],
"browser_action": {
"default_icon": {
"19": "icons/19.png"
},
"default_title": "LoremIpsum",
"default_popup": "popup.html"
"icons": {
"16": "icons/16.png",
"19": "icons/19.png",
"48": "icons/48.png",
"128": "icons/128.png"
},
"web_accessible_resources": [
"img/*.png",
"smilies/*.gif",
"style.css"
],
"content_scripts": [
{
"matches": ["http://*.exemple.org/*showtopic*", "http://*.exemple.org/*act=ST*"],
"css": ["style.css"],
"js": ["jquery-1.10.2.min.js", "popup.js", "script.js"]
}
]
}
I just realized that I made a dumb error while setting chrome.storage.local. I've passed arguments as an array instead of passing them as an object.