Help: Use TiddlyWiki as webpage, allowing edits on certain pages

Hello All!

I have recently been exploring TiddlyWiki as a potential solution for wiki software on my webpage. The installation went great, and I love the small size, portability, and functionality TiddlyWiki offers so far. My real issue is implementing TiddlyWiki into my website (, I’d love to implement it in my “Contribute page,” but adding it seems to be a real challenge. To be clear, I do not want just a static webpage, I want users to be able to edit and change certain pages (If someone could show me how to lock certain pages to editing as well, that would be great!). I know it’s a lot to ask, especially condensed in one question, but I’d really appreciate it if someone could answer or point me in the right direction. Thanks!

Hello @Finn_Lancaster,
Tiddlywiki is a great tool for personal note-management, and it really excels at that area.
However, when it comes to multi-user scenarios it always fails.
There were some attempts along the years to make it possible to share edit permissions and scope notes to users, but all them were buggy and just proof of concepts. IMO the reason why all those attempts failed it’s because it is not in the nature of Tiddliwiki to handle this, and it was designed from it’s roots as a personal (very personal) wiki solution.


My original idea, I believe, would have worked. Basically, before tiddlySpot was down, it would have been possible just to call an iframe src=“tiddlyspotURL”/iframe (can’t add correct <> signs in snippet because of sanitizing policies, I assume). With TiddlySpot not an option now, however, this approach wouldn’t work.

The reason this same approach will not work on NoteSelf is because there is no identifying string in the URL. For example, the URL would be something along the lines of, meaning that every user using that iFrame would either see an error, or their own notebook if they’d made one. In other words, there is no direct link to each TiddlyWiki notebook.

I don’t think just using iframes can be a solid way of managing different users.
However, allowing to jump directly to one specific notebook on NoteSelf by Url is something I wanted to do for a long time. This project is something that born when I was much more enthusiast but much less skilled, so it has some unexpected limitations.
But, even with that feature, it will not suit the requirements of an iframe based architecture like the one you explained because each notebook is local to each user, so you will still need a central place to sync everything (something NoteSelf provides) and different users per notebook, and at that point, you can just ask each user to login and they will have their notes there.

I am still able to view the notebooks on my website (all I want available is the one I made), but edits do not sync or save. Looking at the Error Logs, I can see {sw failure DOMException: Failed to register a ServiceWorker: The document is in an invalid state.} What’s strange to me about this is that the HTML is directly copied from the (Working) NoteSelf download, and just hosted as an HTML embed option.

Update: Via Google Drive and the amazing (and free) DriveToWeb ( I was able to support cloud syncing and saving. Basically, I uploaded the HTML file to drive, and then configured drivetoweb to create a url for it. So far, it works when called in iframe, and saves from any address on the web. There is one small bug, that is: for any devices besides my PC, they are sent to the “Create a New TiddlyWiki” page. I am debugging now, hopefully just modifying some localStorage attributes should do the trick to load mine cross-platform.

localStorage will alwasy be local to your computer. You need to include some logic to read the URL and point to one file or another.

@danielo515, could you please explain this [quote=“danielo515, post:7, topic:331”]
You need to include some logic to read the URL and point to one file or another.

The URL seems to be fine, it points to the correct file and is accessible online. The issue is that when the user opens the file, it sends them to their tiddlyWiki pages, instead of mine. What I figure I need is some sort of inserted code in the html file that tells TiddlyWiki what to open. My original presumption was that their was some sort of key in localStorage, as the localStorage of different tiddlyWikis seemed to be different. For one, there was a value storing the title of my TiddlyWiki, as well as one “mrview with a long string value.”

Do you happen to know of any identifying code I could add to show my TiddlyWiki? In case you want to see what it’s doing, the html file is hosted at the URL before being sent to my site.