hushpiper: (telephone game)

Dreamwidth is a great platform, but one of its biggest downsides is its post editor: it can be finicky, and it doesn’t allow you to save multiple drafts, making it difficult to write anything lengthy. You can use a text editor on your computer to draft the posts, but that chains you to a single device and can lead to lost drafts.

My answer to this issue is StackEdit, an in-browser markdown editor that can sync with Google Drive (or Dropbox) and exports to HTML that can be pasted directly into Dreamwidth. [personal profile] jesse_the_k  has a great writeup on general markdown use for Dreamwidth here, but we’re going to take a slightly different tack: rather than using Dreamwidth’s built-in markdown capabilities, we’re going to use StackEdit to export to HTML that we can paste into Dreamwidth’s editor.

Getting Started

So to start with, get yourself over to https://stackedit.io/ and click “Start Writing”. Go through the tour if you like, give the welcome file a read. Summary of the most important stuff is this:

  • The bold/italics/etc buttons at the top work basically how you would expect; more detailed formatting is outlined in the welcome file.

  • Click the folder icon on the top left and you can create new files and folders, or delete or rename new ones.

  • Click the StackEdit icon at the top right, and you can sign in with your google account in order to sync everything in the cloud.1

When you’ve finished making your post, click the StackEdit icon at the top right and click “Import/export” and then “Export as HTML”. In the box that pops up, select “Plain HTML” and then click “COPY” (not “OK”). That copies the HTML onto your clipboard.

Now! Go to your Dreamwidth and click “Post”. In the editor, click the “HTML” tab and paste. Then click “Preview” at the bottom to see what it’ll look like on your journal. Fill out the other post fields as you like and make changes as needed2, and post. Voila!

1. If you choose not to sync with the cloud, all your files will be in your browser’s local storage. Don’t clear your cache, or you’ll lose it!

2. I suggest you stick to the HTML tab though: the rich text formatter has its own ideas of what HTML should look like, and it may quickly become unwieldy. If you need to do any major editing, I say head back to StackEdit for that.


Cloud Sync & Workspaces

I know Google’s walked their promise to not be evil way back, but signing in with a Google account is where the best features of StackEdit come into play–so I really do recommend it. To do that, click the StackEdit icon on the top right, click “Sign in with Google”, and do the whole sign-in thing–you know the drill.

That will immediately start syncing your files to your Google account, keeping them backed up and synced between devices. (Want to write on your phone? Just go to the site in your mobile browser and sign in, and all your files will be right there and ready to work on.3)

But there’s even greater rewards to be found in utilizing workspaces. Workspaces can be synced with specific Google Drive folders, making the files easy to access outside of StackEdit if you want to. They also allow an extra level of organization, as each workspace has its own set of files and folders.

  1. Go to your Google Drive and create a folder for your workspace. I have a folder for each fandom that I do a significant amount of writing for. Make sure it has a unique name not used elsewhere in your drive, or you’ll have trouble later.

  2. Add a Google Drive-backed workspace by going to the StackEdit menu, clicking “Workspaces”, then “Add a Google Drive workspace”.

  3. Click “Choose folder” and select the folder you created in step 1, and then click “OK”. The choose folder dialog won’t show you your drive’s folder structure, only individual folders, which is why you need it to have a unique name.

  4. Click “OK”. The new workspace will open up in a new tab, and StackEdit will set up shop in the folder, creating .stackedit-data and stackedit-trash folders for itself. Any new files and folders you create in StackEdit will be saved to this folder in markdown format.

3. I use mobile Firefox and have noticed issues with creating line breaks in StackEdit there. (Sketchy workaround is to keep at least one character in front of your cursor whenever you want to make a line break.) I don’t know whether that also happens in other mobile browsers, and haven’t bothered reporting the bug yet, but it’s worth noting.


Other Notes

StackEdit can do almost all the editing you’ll need to do, but not, unfortunately, all. You’ll need the Dreamwidth editor to do Dreamwidth-specific things like tagging a user (like <user name="hushpiper">) since StackEdit won’t recognize that as valid HTML. It’ll just get stripped out.

However, any standard HTML is also valid markdown, so if you want to do something fancy that StackEdit doesn’t natively support but that can be accomplished with HTML, just write it out in HTML and it’ll be there in your export. Superscript is one example I used above.

StackEdit considers two line breaks to be equivalent to a <p> tag, which in my opinion is way too much space between paragraphs when translated onto Dreamwidth. I'm sure there's a good workaround so that it doesn't do this, so watch this space for updates.

Profile

hushpiper: tell her that's young / and shuns to have her graces spied / that hadst thou sprung / in deserts where no men abide (Default)
hushpiper

May 2022

S M T W T F S
123 4567
891011121314
15161718192021
22232425262728
293031    

Syndicate

RSS Atom

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Jul. 8th, 2025 04:13 am
Powered by Dreamwidth Studios