X
Tap here to go to the mobile version of the site.

Support Forum

How can I assign a favicon to a Javascript bookmarklet?

Posted

Hi there...

I'm pretty good with computers but haven't delved into the nuances of userChrome.css, and I *think* that's where my solution lies.

Background: due to something I can't nail down in my security settings, the Instapaper plugin isn't able to function as intended, but I discovered that I was able to get the Javascript bookmarklet to behave. Good deal--one less plugin to drain my system. HOWEVER, I'm one of those nerds who keeps oft-used links in the toolbar with the text removed. That means this link has the generic globe for an icon--and I really want the Instapaper I as a visual cue.

I've been digging around online trying to find the solution, but while I've gotten as far as determining that I need to tell FF what icon to use in a userChrome.css file--none of the info I'm finding quite matches up with the variables I have to provide. I don't understand how to specify the bookmarklet without using the name field (as it's blank). When I try using the full Javascript string bad things happen, and I'm not sure how to explain wildcards within the context so I could just use "instapaper.com" or something.

I am so frustrated by this seemingly easy task! Plus, I'm used to being able to do some searching and sort things out. Not this time... brain hurts! Can someone please show me what the code snippet to accomplish this looks like?

I don't care if the ICO is remote or sits in the chrome folder locally.

Thank you soooo much!!

-Esh

Hi there... I'm pretty good with computers but haven't delved into the nuances of userChrome.css, and I *think* that's where my solution lies. Background: due to something I can't nail down in my security settings, the Instapaper plugin isn't able to function as intended, but I discovered that I was able to get the Javascript bookmarklet to behave. Good deal--one less plugin to drain my system. HOWEVER, I'm one of those nerds who keeps oft-used links in the toolbar with the text removed. That means this link has the generic globe for an icon--and I really want the Instapaper I as a visual cue. I've been digging around online trying to find the solution, but while I've gotten as far as determining that I need to tell FF what icon to use in a userChrome.css file--none of the info I'm finding quite matches up with the variables I have to provide. I don't understand how to specify the bookmarklet without using the name field (as it's blank). When I try using the full Javascript string bad things happen, and I'm not sure how to explain wildcards within the context so I could just use "instapaper.com" or something. I am so frustrated by this seemingly easy task! Plus, I'm used to being able to do some searching and sort things out. Not this time... brain hurts! Can someone please show me what the code snippet to accomplish this looks like? I don't care if the ICO is remote or sits in the chrome folder locally. Thank you soooo much!! -Esh

Chosen solution

Hello! I found one method in "other-speaking part of internet" and traslated...I think it can help you:)

PROS:

add icon to bookmarklet he uses windows.open leaves no blank pages for

MINUSES:

it reloads the current page (instead of leaving the page behind) Firefox POP-ul blocker cannot be enabled to allow javascript: the generated HTML page to load pop-up windows, so you need to click Allow each time

This is the code:

<a href = "javascript: '& lt ;! DOCTYPE html & lt; html & gt; & lt; head & gt; & lt; link rel = & icon" type = "image / png & quot; href =" http : //www.tapper -ware.net/devel/js/JS.Bookmarklets/icons/next.png" / & gt; & lt; / head & gt; & lt; body onLoad = & window.open (\ 'http: //example.com', \ 'test \', \ 'status = 0, toolbar = 0, location = 0, menu bar = 0, changeable = false, scrollbars = false, height = 379, width = 379 \ '); SetTimeout (\ 'history.back (-1); \' 100); & Quot; & Gt; & Lt; / body & gt; & Lt; / Html & gt; '; "> Bookmarklet </a>

This link that you want to add to your page, the user needs to drag this link to the bookmarks bar (you can use this feature to add bookmarks to the script), the bookmark does not have an icon until the user has clicked it at least once.

So, how it should work: 1. redirect the user to the generated HTML page from the bookmarklet (which makes the icon possible) 2. onLoad open the window you need using "windows.open" 3. redirect the page back using history.back (-1) "

In theory, everything happens so quickly that the user does not see the new page, the current page has just reloaded, and new windows appear.

Read this answer in context 0
Quote
leetp4nd4 1 solutions 7 answers

Chosen Solution

Hello! I found one method in "other-speaking part of internet" and traslated...I think it can help you:)

PROS:

add icon to bookmarklet he uses windows.open leaves no blank pages for

MINUSES:

it reloads the current page (instead of leaving the page behind) Firefox POP-ul blocker cannot be enabled to allow javascript: the generated HTML page to load pop-up windows, so you need to click Allow each time

This is the code:

<a href = "javascript: '& lt ;! DOCTYPE html & lt; html & gt; & lt; head & gt; & lt; link rel = & icon" type = "image / png & quot; href =" http : //www.tapper -ware.net/devel/js/JS.Bookmarklets/icons/next.png" / & gt; & lt; / head & gt; & lt; body onLoad = & window.open (\ 'http: //example.com', \ 'test \', \ 'status = 0, toolbar = 0, location = 0, menu bar = 0, changeable = false, scrollbars = false, height = 379, width = 379 \ '); SetTimeout (\ 'history.back (-1); \' 100); & Quot; & Gt; & Lt; / body & gt; & Lt; / Html & gt; '; "> Bookmarklet </a>

This link that you want to add to your page, the user needs to drag this link to the bookmarks bar (you can use this feature to add bookmarks to the script), the bookmark does not have an icon until the user has clicked it at least once.

So, how it should work: 1. redirect the user to the generated HTML page from the bookmarklet (which makes the icon possible) 2. onLoad open the window you need using "windows.open" 3. redirect the page back using history.back (-1) "

In theory, everything happens so quickly that the user does not see the new page, the current page has just reloaded, and new windows appear.

Hello! I found one method in "other-speaking part of internet" and traslated...I think it can help you:) PROS: add icon to bookmarklet he uses windows.open leaves no blank pages for MINUSES: it reloads the current page (instead of leaving the page behind) Firefox POP-ul blocker cannot be enabled to allow javascript: the generated HTML page to load pop-up windows, so you need to click Allow each time This is the code: <a href = "javascript: '& lt ;! DOCTYPE html & lt; html & gt; & lt; head & gt; & lt; link rel = & icon" type = "image / png & quot; href =" http : //www.tapper -ware.net/devel/js/JS.Bookmarklets/icons/next.png&quot; / & gt; & lt; / head & gt; & lt; body onLoad = & window.open (\ 'http: //example.com', \ 'test \', \ 'status = 0, toolbar = 0, location = 0, menu bar = 0, changeable = false, scrollbars = false, height = 379, width = 379 \ '); SetTimeout (\ 'history.back (-1); \' 100); & Quot; & Gt; & Lt; / body & gt; & Lt; / Html & gt; '; "> Bookmarklet </a> This link that you want to add to your page, the user needs to drag this link to the bookmarks bar (you can use this feature to add bookmarks to the script), the bookmark does not have an icon until the user has clicked it at least once. So, how it should work: 1. redirect the user to the generated HTML page from the bookmarklet (which makes the icon possible) 2. onLoad open the window you need using "windows.open" 3. redirect the page back using history.back (-1) " In theory, everything happens so quickly that the user does not see the new page, the current page has just reloaded, and new windows appear.
Was this helpful to you?
Quote

Question owner

Thanks so much!

Thanks so much!
Was this helpful to you?
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.