Is it possible with the Chrome API to let users assign a keyboard shortcut from within the extension popup or options page? Without them having to go to extensions page, scroll to the bottom and open keyboard shortcut menu.
In Chrome there's no method to assign a shortcut key programmatically, but you can add a button or a link in the extension popup that will open the built-in dialog.
popup.html:
<button id="hotkey">Assign a shortcut key</button>
<script src="popup.js"></script>
popup.js:
document.getElementById('hotkey').onclick = () => chrome.tabs.create({
url: 'chrome://extensions/configureCommands'
});
Notes:
chrome:// URLs can be opened only via chrome/WebExtensions API methods,
but not via <a href="..."> links directly.
You can still use a standard <a> link with a click listener shown above; just don't forget to prevent the default click event to avoid an error in the console:
document.getElementById('hotkey').onclick = event => {
chrome.tabs.create({url: 'chrome://extensions/configureCommands'});
event.preventDefault();
};
In Opera browser the URL is opera://settings/configureCommands
You can detect the browser using navigator.userAgent string
In Firefox there's currently no way to open this UI programmatically so you'll have to show an instruction to open about:addons page, click the gear icon, then choose "Manage extension shortcuts". However, Firefox allows setting the hotkeys programmatically using browser.commands.update.
Related
hi can anyone help me please
what i am trying to do is get another website to open in a new window / tab
so someone would go to my site and not only would my website open but also the other website in a new / tab window without having to click any link or any thing it would just automatically open the other site in new tab/ window
This is for opening another website in a new window/tab once your website has loaded completely.You don't need to click anything.Once your website is completely loaded,other website will automatically open.I have use www.thesiteIwant.com as the URL for the other site you want to open.
window.open("http://www.thesiteIwant.com");
The above code by default opens a new window but if the user has selected to open new URLs in new tab then it will open the above site in new tab.
Complete code:
<html>
<head>
<script>
function opennewsite()
//can be placed inside the head tag
{
window.open("http://thesiteIwant.com");
}
</script>
<title> mysite </title>
</head>
<body onload="opennewsite()">
/*adding onload event handler will execute the function once your site body (content) has been completely loaded*/
//all the content here.
</body>
</html>
you can try like this
<script type="text/javascript">
window.open('www.thedomain you want.com','_blank');
</script>
although based on the browser and it's settings it might work ok or not...
Hi I need to show a pop up in chrome extension. I have set my website as a chrome extension.
Here is the use case:
When the user installs the extension, and clicks on the extension icon, it should show a pop up asking his username.
When user enters his name and login, the pop up gets closed.
This name is stored in local storage.
When user clicks the extension icon next time, it checks whether his name is stored in localstorage If not then it should again show pop up otherwise it should navigate to my website.
Now what my problem is that
When I click twice on the icon only, only then pop up appears.
After I enter name and click login pop up gets closed which is fine
When I click again on icon, actually it should navigate to the website, but in my code it again shows pop up.
When I reload the extension, it works correctly.
Please help me.
Here is my background.js
chrome.browserAction.onClicked.addListener(function(tab) {
if(!localStorage.username){
chrome.browserAction.setPopup({
popup: "userinfo.html"
}); }
else{
//navigate to website
});
here is my userinfo.html
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="test.js">
</script>
</head>
<body>
<font face="sans-serif"><b>Enter your Email ID</b></font><br><br>
<form id="userinfo">
<table><tr><td>
<font face="sans-serif"><label for="user">Email</label></font></td><td>: </td>
<td><input type="text" id="user" /></td><span id="semail"></span>
</table><br><br>
<font face="sans-serif"><input type="submit" id="login" value="Log In"/></font>
</form>
</body>
</html>
here is my test.js
window.addEventListener('DOMContentLoaded', function() {
var user = document.querySelector('input#user');
var form = document.querySelector('form#userinfo');
form.addEventListener('submit', function(evt) {
evt.preventDefault();
var userStr = user.value;
chrome.runtime.getBackgroundPage(function(bgPage) {
bgPage.login(userStr/*,pwdStr*/); });
window.close();
});
});
anyone please please help me
Let's go one by one with your problems.
1.When I click twice on the icon only, only then pop up appears.
When you click on extension icon, your browserAction.onClicked handler gets executed and it just sets the popup. It does not open it. You have to click on extension icon again to open the popup. That is why you have to click twice.
2.After I enter name and click login pop up gets closed which is fine.
This is because you are redirecting to a new page which closes the extension popup.
3.When I click again on icon, actually it should navigate to the website, but in my code it again shows pop up.
Since you have setup popup for extension click, it has over-ridden the chrome.browserAction.onClick handler which is why you are not able to navigate to your website.
4.When I reload the extension, it works correctly.
This is because after reload, your chrome.browserAction.onClick is not over-ridden by popup and since login credentials are present in localstorage, your code does not over-ride it.
Solution1
In background script, check if the credentials are stored in localstorage then do not set the popup, else set the popup.
Add the handler chrome.browserAction.onClick to always navigate to your website. You know that if popup opens then your handler will not be executed.
When you store the credentials in localstorage and if they are correct, remove the popup.
To remove popup, you can try chrome.browserAction.setPopup({popup: ""});
From chrome.broswerAction API
onClicked
Fired when a browser action icon is clicked. This event will not fire if the browser action has a popup.
Solution2
Popup has the same permissions which background scrips have. So instead of defining chrome.browserAction.onClicked event, just write your code in popup script.
Check the localstorage, if credentials are present, create a new tab and open your page and close the popup with window.close()
Otherwise don't close the popup.
PS: I have not tried it. Just giving you an idea.
As per the title, I'd like to have an alert box display when a Google Sites page loads.
I've tried using the HTML Box and inline HTML but haven't had any luck as yet.
I have been able to generate the alert box via a link, but to display it when the page loads is where I'm struggling.
JavaScript:
<script>
$(document).ready(function(){
alert("My alert box content here");
});
</script>
I'm trying to build an extension for Chrome, but I'm a newbie and I'm having trouble understanding the Docs provided by Google. I want the extension to have a popup that shows a few buttons, and when a button is clicked, I want to run a script.
This is my setup:
popup.html
<button id="test1" onclick="getSite();">button 1</button>
<button id="test2" onclick="getSite();">button 2</button>
content_script.js
function getSite(){alert('getSite works!');}
I'm having trouble understanding how to use the chrome javascript api, as I see others saying use chrome.tabs.executeScript, but I can't figure out where that line goes. Can anyone help me? I'll give you a cookie! or just an upvote.. or maybe both?
You haven't mentioned on which page you want your scripts to run onclick, in Popup.html page or the page on which user is currently working on the browser. If it is just the popup.html page in which you want to execute your script, include them in popup.html page itself.
If however you want to execute them on the user's browser page, You will have to pass a message to your background page, which in turn will execute chrome.tabs.executeScript with current tab's id and {file: 'yourjsfile.js'} as arguments.
I think you are having this problem because of restrictions imposed by the Google Content Security Policy. It mentions that iniline javascript like the one that you have mentioned in you code will not be executed. Try removing the onclick="getSite()" from your HTML markup to content_script.js. Use addEventListener function to attach the event to the button.
I just made a Chrome extension. I followed this tutorial to get a nice button in my toolbar. Now if I load a page, the javascript in my extension gets executed.
Unfortunately, if I click the extension's button in my toolbar, nothing happens.
Question: How do I make the js get executed when I click the extension's button in my toolbar?
Thanks for your help.
Edit
I added background.html and it still doesn't work:
<html>
<head>
<script>
// Called when the user clicks on the browser action.
chrome.browserAction.onClicked.addListener(function(tab) {
var action_url = "javascript:mathjax.js";
chrome.tabs.update(tab.id, {url: action_url});
});
</script>
</head>
</html>
You have two options. Either, you can specify a "popup": "popup.html" in your manifest.json, then put the code in popup.html. In this case, the code will get executed in the popup (though of course you can communicate with your background page or anything else).
Probably better would be to put a callback in background.html by attaching a listener to chrome.browserAction.onClicked.
Chrome extension doesn't support inline javascript code in background.html.You must specify external javascript file.Also instead of specifying background.html you can directly specify external file in manifest file in background property.
I have answered similar question here.