NOTE: This does not work starting from Opera 9.50. I hope this will be solved soon, but I think the best solution is to VOTE for built-in sticky notes in Opera. So go VOTE, VOTE, VOTE!
Thanks to the fine cross-browser "Little Yellow Stickies" javascript code of Brian McAllister, the great power of the Opera browser, plus some modifications, improvements, integration in Opera and documentation by me, we can now enjoy a nice and useful tool: sticky-notes on web pages.
...in a nutshell:
This UserJS is not the same thing of a sticky-note widget for Opera, I can say this is something better and you will understand why by going into the trouble of setting this up and giving it a try. I'm sorry the setup process is not very simple for beginner users, but I've tried to be as clear as possible in the explanation.
If you have no time to go through this entire page and you are a power Opera user who already knows what to do when coming to customization stuff, here it is everything you need, in a nutshell:
Let's go slower now
Sticky-notes can be added anywhere on any page, resized, moved and removed: informations are saved into cookies, so every time a page is reopened (if the cookies have not been deleted of course) the stickies are there where left last time, reminding whatever you wrote...
Always an eventual fragment identifier (the part of the url following a "#") is ignored; you can also choose to attach the sticky to the page without parameters (that is, the part of the url following a "?" will be ignored), or to the entire domain.
Try clicking this, and see if you like the idea: (sorry, the demo worked before without "installation" but I think I've broken something with successive mods: I'll find the time to fix it, meanwhile follow the installation instructions to see the thing working in Opera. By the way, if you have an already configured user-scripts folder, I suppose you can quickly have a try copying these two files into it and hitting the button below: stickies.js - stickies_pwd.js)
Type something in, move it around, resize it, make another one... and when you've played enough hit Ctrl-F4 to close this page: oh, then come back please! (hit Ctrl-Z)
If you have cookies enabled, you should see your stickies where you left them ;)
Privacy
The sticky note information is stored in cookies, and as a result, will be sent to the server each time you request a page. To protect your privacy, by default the stickies are stored encrypted (this not applies if the sticky is created under localhost).
Please consider that with encryption the cookie size grows, and the specification restricts to about 3 KB the maximum size of total cookie data per page. Anyway the encryption can be selectively turned off when you don't care to send to the server the content written in the sticky (see the "help sticky").
Known bugs
You cannot attach stickies into Gmail because they have been disabled there, otherwise the userjs would hang the interface loading. If someone figures out how to fix that, let me know.
Really simple setup steps
Nice? Ok, follow these steps and you'll have a cookie-based sticky-notes system for the Opera browser in less than ten minutes. If it happens that you don't know Opera, I argue that probably you've not tried it... well, just download and install: it's absolutely free!
- Locate these settings file used by Opera: opera6.ini, the toolbar ini file, the menu ini file (the actual names may vary).
If in doubt: load Opera, than go to menu Help -> About Opera; under "Paths" you can read the path of the using "preferences" file opera6.ini. Load this file with an editor, and search for the string "Menu Configuration=", there will be the actual path and name of the menu.ini file; then search for the string "Toolbar Configuration=", there will be the actual path and name of the toolbar.ini file.
- Close Opera, and load opera6.ini in a text-editor: under section
[User Prefs]
, search for the entry
User JavaScript File=path\to\user_scripts
there you can read the actual path to the user-javascripts folder.
If this entry is missing, create the folder "user_scripts" into the profile folder of Opera, and add the line:
User JavaScript File=C:\Progs\Opera\profile\user_scripts
(of course changeC:\Progs\Opera\
with your Opera installation path).
Make sure under[User Prefs]
there are also the following entries with these values:
User JavaScript=1
Always Load User JavaScript=1
- Put the main user-javascript sticky-notes file into the right user-javascripts folder. Oh well, here it is the file: stickies.js ;)
(right-click on the link and "Save target as...", then browse to the user-javascripts folder)
- Do the same for this companion user-javascript file: stickies_pwd.js
(right-click on the link and "Save target as...", then browse to the user-javascripts folder)
Load this file in a text-editor, and change the "password" where you see:
return "password";
You can use whatever alpha-numeric string, you don't have to remember it, just take it not too much short (otherwise the encryption algorithm could often fail) and not too much long (if you care for your cpu cycles). Something like "5t1k135Rc007" will be fine...
Important note for Robo (or whoever wants to improve Robo's version): If you are going to add encryption support, please use the same password companion file (this one), so that stickies created with different versions will have compatible content if the two projects will be merged some day.
- Again in opera6.ini, under section
[User Prefs]
, search for the entry
Local CSS File=path\to\<stylesheet file>
there you can read the actual path and filename of the so-called "My style sheet" we're going to enable in Opera.
If this entry is missing, check there is a "styles" folder into the profile folder of Opera, and a user.css file in it (it could be empty though); otherwise, create from scratch the folder and the file user.css. Then add the line (under the[User Prefs]
section of opera6.ini ):
Local CSS File=C:\Progs\Opera\profile\styles\user.css
(of course changeC:\Progs\Opera\
with your Opera installation path).
Open the stylesheet file in a text-editor, and copy/paste (of course add to the existing code if you're already using a stylesheet file) this css code.
- Load Opera, than go to Tools -> Preferences -> Advanced -> Content (in Opera 9, click on the "Presentation modes" tab); click on the button "Style options..." and set like this:
(*) make sure that the "My style sheet" file request points to the actual stylesheet file we've just prepared).
Click OK. We use cookies to store stickies information: they have to be enabled, and not deleted on exit (unless you want to delete the stickies on purpose). So now go to the "Cookies" section of the already opened Preferences dialog, and make sure Opera is accepting cookies, and not deleting them when exiting.
- Open the toolbar ini file (we've already explained above how to locate the actual file). Let's add a "New sticky" button in the address bar of Opera.
You have the option to just click this New Sticky link; or, if you want to do it manually to be sure that you have the control of what you're modifying, it's easy too: under section
[Document Toolbar.content]
, add this after the last line:
Save changes.
- Now let's add a quick "New sticky" entry in the context menu. Open the menu ini file (we've already explained above how to locate the actual file). Under section
[Document Popup Menu]
, add this before the first line:
Save changes.
- To apply the changes to the toolbar and menu in Opera, just go to:
Tools -> Preferences -> Advanced -> Toolbars
Select the Toolbar setup and Menu setup entries you're using (that is, those corresponding to the active toolbar ini file and menu ini file), and press OK.
Well, we're ready to go: have a web page open, maybe your start page (now I use to apply general reminding sticky-notes there, rather than letting any desktop post-it application waste my system memory ;) You should see in the right side of the address bar (if enabled) the "New sticky" button, or just right-click on the page, and you'll find the "New sticky" entry as the first one in the context menu. Try applying some stickies, delete some, put stickies on various pages, place some others on specific places in scrolled down pages... Ok, time to test now: close Opera, then re-open it. Try loading the same pages: if everything is fine, your stickies are there right were you left them, their adesive stuff is a rather good-quality one!
- TIP #1: You can easily find (and selectively delete) the sticky-notes' cookies:
go to Tools -> Advanced -> Cookies...
In the search input field, type "sticky_": they'll be presented as single files representing every single sticky-note, under folders representing the host to which those stickies are related.
- TIP #2: Simple HTML tags will work into the stickies:
for example, you can use <b>...</b>, <i>...</i>, <u>...</u>, <br>, <hr>, <a href=...>, <img src=...> ... As a demo, you can try cutting/pasting this code into an empty sticky:
- TIP #3: Sticky-notes work almost good with Opera's
"file://"
protocol! ("almost", because the close button of the sticky is a little changed - you will see what I mean - so if someone figures out how to fix that, let me know)
How can this be useful? Here it is my way...
First, I type "file:" in the address field and Opera shows me the "Drives" page (going to "file://localhost/"). For my convenience, I've bookmarked the page and given the nickname "d", so with "shift-F2, d" or "F2, d, enter" I can access it very quickly. Look, we can stick notes in this Drives page, so this can turn in a "big board" where to stick our everyday notes (like real stickies on the monitor, but with the nice sticky of TIP #2 ;) Besides, we have access to all our folders in all our drives, and we can stick notes in them, wherever we want... so, they work like a kind of "folder-related notes", which can be useful sometimes and we can create them without adding real stuff into the folders :)
- Please have a look in this thread on Opera forums; there may be important fixes and advices to make this thing work better or to set it up with less effort, so that you don't have to wait every next update to this page in order to use the top of the notch stickies ;)
If you need some help, it's also the right place where there are chances you can obtain it: Opera users are often clever people :)
Changelog
v1.12 (9 September, 2006):updated: "stickies.js" file.
- Disabled in www.google.com/calendar to let Google Calendar work (of course stickies will not work there)
v1.11 (25 July, 2006):
updated: "stickies.js" file.
- Bug fix: editing a new sticky clears the default content, don't know when I've broken it.
- section "...in a nutshell:" added to this document.
- TIP #3 added to this document.
- added "Receive email when this page changes" link to this document through the changenotes.com service.
v1.10 (20 July, 2006):
updated: "stickies.js" file.
- Disabled in mail.google.com to let Gmail work (of course stickies will not work there)
v1.9 (12 June, 2006):
updated: "stickies.js" file.
- Removed the limit for text displayed in the stickies (full text is displayed, no more "...")
v1.8 (1 November, 2005):
updated: "stickies.js" file.
- Stickies created on localhost are not encrypted.
v1.7 (1 November, 2005):
updated: "stickies.js" file.
added: "stickies_pwd.js" file.
- Sticky's content transparent encryption/decryption, disabled if wanted.
- Small bug fix related to -p and -d parameters.
- Content added to the help-sticky.
v1.6 (27 October, 2005):
updated: "stickies.js" file.
updated: user stylesheet.
- Fragment identifiers in the url are always ignored.
- Used setAttribute() method to force styling of some elements.
- User stylesheet cleaned from unused stuff.
- User javascript cleaned from unused stuff.
v1.5 (17 October, 2005):
updated: "stickies.js" file.
- Bug fix: multiple parameters can be specified.
v1.4 (16 October, 2005):
updated: "stickies.js" file.
- Interaction is as unobtrusive as possible by default.
- Command-line parameters support.
- Temporary stickies.
- Defaults to click'n'edit, switch for clickable links.
- Domain-wide stickies always appear on top of visible area.
- Stick-on-top switch.
- Defaults to click'n'remove, switch for confirmation dialog.
- Temporary help-sticky with list of supported parameters.
v1.3 (14 October, 2005):
updated: "stickies.js" file.
- Editing is activated by doubleclick in the sticky.
- HTML tags are allowed and rendered.
- TIP #2 added to this document.
v1.2 (13 October, 2005):
updated: "stickies.js" file.
- Stickies cannot go out of screen anymore.
- Switches support to specify if stickies have to be attached to the unparametrized page, or to the domain, or to the exact url.
v1.1 (12 October, 2005):
updated: toolbar ini file, menu ini file, setup steps.
- Fixed "Reuse existing page off" bug.
v1.0 (10 October, 2005): First version.
Related Links on the Internet
Here are some links to the projects that made this possible; the order tries to show how one project inspired (or just "sprayed something in the air") the other...:
- Christopher Hester's Sticky Note Demo. I have never seen it in action, I know it used a (now corrected!) bug in the CSS parser of old Opera versions to work, so it was far from being useable; anyway I think the project deserves to be listed here.
- BrainJar's Generic Drag script. Cool: this project showed clearly how dragging of window-like objects was possible with javascript.
- Clugnut's Browser stickies. The first experiment (as far as I know) with javascript sticky-notes, moveable and resizeable but still not saveable, and not compatible with Opera.
- Shawn Rice's stickies. I have not tried it, but I think he was the first one to add cookie-based saving of the stickies, making them really "sticky". Great!
- Brian Mc Allister's Little Yellow Stickies Demo. The so good project which moved me in improving the thing, being it already fully Opera-compatible. Thanks again, Brian!
- Antonio Orlando's Sticky-notes for Opera. Well, the one you're reading now... It is the first browser integration (Opera) of javascript-based sticky notes (as far as I know), with several improvements introduced. Cool? ;) [plus the associated thread on my.opera forums]
- Robo's Sticky-notes for Opera. Another implementation of browser-integrated (Opera) sticky notes; still lacks several features, but has a wise and well-commented code, and setup steps are simplified. A nice project too!
Credits
- Brian McAllister, for the original "Little Yellow Stickies" javascript
- "Undertow", an Opera community member, for help in embedding images into javascript
- "gun", an Opera community member, for the "Reuse existing page off" bug fix and the create button link
- "Toman", a guestbook signer, for the tip on how to avoid closing Opera
- "NoobSaibot", an Opera community member, for the tip on how to avoid Gmail locking using the @exclude clause
- Opera Software ASA, for having made Opera, and for having released it free and with no ads