Can I put a HTML code in my chrome extension's icon? According to the Google API (setBadgeText) this isn't possible.
Is there any way to put it there?
While .setBadgeText is, as implied by name, text-only, you can draw anything and set that as your icon.
You'll need to draw on a <canvas>, extract image data and use .setIcon({imageData: /*...*/}) to update the icon.
See this question for a brief example, and maybe this article.
It's not quite "using HTML", but with some work you can output anything to your icon.
Badge is plain text only as can be seen in source code. There's no way around.
Related
I've tried searching for this, and the closest related question that I could find was from 3+ years ago and had to do with the incognito window being dark, while a normal chrome window was light back then.
Now that we have the ability to have a light or dark mode browser, it's hard to find an icon design and color that looks good for both light and dark modes. Here's an example:
In the image above you can see that the first and third icons are black, so they are hard to see when using dark-mode. The middle icon (the one I'm using for my extension)looks great on dark mode, but terrible on light mode. See below:
So does anyone know if there is there a way to detect the browser mode (light or dark) and swap out the icon?
Thanks to wOxxOm I was able to figure this out.
First, I needed to create a content script (which I called toggleIcon.js) and add it to the manifist.json file.
Then I added the following to toggleIcon.js - which sends scheme: "dark" to my background.js file if window.matchMedia matches prefers-color-scheme: dark.
Then in my background.js file I listen for that message, and if request.scheme == "dark" I use chrome.broserAction.setIcon to change the paths for each of my icons to the dark version.
This effectively overrides my original icon paths as declared in the manifest.json file (as shown below).
The only downside I see is that this requires a content_script, which if you want your extension to work on any page, requires you to also add "matches": ["<all_urls>"] to your extension, which slows down the approval process. Which is why in my comments above I mentioned I had been avoiding using a content_script.
Also, I think it makes sense to use the version of your icons that work best on light-mode as your default, because I think the chrome extension page will pull from these for some of the icons they use (and that page has a white background). As an example, here's how my old icon looked (not enough contrast).
Hopefully this helps someone else!!
I need to download the "Municipalities in Bosnia and Herzegovina.svg" (map) file from this page, but I have no idea how to download it, i.e. to find a link to the image on the page. I found sodipodi:docname="Municipalities in Bosnia and Herzegovina.svg" in the source code, but that still doesn't help me. Could someone link to the svg file and perhaps explain how they deduced where the file is stored?
Assuming you have the rights to use the map. Make sure you do.
The SVG is embedded into the code of the page. You need to cut and paste it from the page source.
The following instructions are for Chrome. Other browsers will be similar.
Mouse over the light grey area of the map.
Right-click, then select "Inspect" from the menu
The browser web tools pane should open with the <svg> element selected.
Ctrl-C to copy
Paste into your favourite text editor.
"Save Page As"
Chrome(right click)
Firefox (menu/Alt or Ctrl + S), then choose the "just SVG" option in the dropdown menu.
Internet Explorer (get Firefox or Chrome, its about time!)
An easy way to download the SVG is using a browser extension. For example, on the Chrome browser there is the SVG Export extension which allows you to view & download the SVGs on a given page. Of course, always make sure that you have the rights/permissions to download the SVGs.
i am creating an "iBook Author html widget", That perform some calculation(a simple calculator), Everything work perfectly but my problem is that i want to show widget on page rather then "Default.png" image, and my widget should not be open in popup and workable in place where it is placed.
Is there any setting in plist which can change behavior?
We ran into the same problem when building our first book. iBooks Author doesn't support inline HTML widgets, unfortunately. If you want inline behavior, you have to use one of the existing widgets (video, slideshow, etc.).
You can customize the Default.png file (documentation here) but that's about it.
How do you change the text within the extension library dialog box? No matter what I do, the text remains the same size. I can see the font change in the designer cleint but not in the browser. I tried looking at it with IE Developer Tools but I can't even see the text anywhere.
I have no idea what was going on yesterday but it just wasn't working. I was simply trying to set the text size of a computed field inside a dialog box. I changed the font size in the properties of the computed field and seems to work now, We have seen these issues on our dev server before.
I am not sure if you can change the text with text options but you can if you use HTML, and it should also work with CSS.
Standard <h1><h2><h... oh you get the idea works for me.
Could you please help me !!!! For example, I load some page into opera/Firefox etc., there is a text on the page (which is a link). What I need is to find position of the text on the screen and send mouse click to that position. Is it possible to do? If you can, give an example please!!!!
Use jquery. Examples on the site as well, for example: http://api.jquery.com/category/events/
You won't need to find the position of the link to click it. If using jQuery, the code would look something like:
$('a#id-of-link').click();