Ao3 Formatting - Tumblr Posts

nothing else makes me appreciate my coding phase in middle school, where I learned html and css on khan academy, like formatting on ao3

I have so much confidence and power now! If only I could remember the closing forwardslash!

hey so i was going to reblog your post abt the ao3 formatting bc i dont know how it works and then figured an ask might be easier so;

can you teach me- i mean you dont have to, youre the first person ive seen and im not sure where else to find out how to do that-

i remember looking at instructions awhile ago and just being even more confused too so like 💀

yeah of course, anon! ao3 also has a rich text editor now, which has everything but hyperlinks i think, so if you choose that option, then you won't need most of this.

anyways, here are some basics:

in coding, formatting "commands" are nestled between sideways carats (these things: < >) use two of them. the one furthest along in the text has a forwardslash (this thing: /) to signify that the command's over

when you write your work, each paragraph needs to be surrounded by <p>your paragraph</p> . if you want to go a line down but you don't want the big paragraph space, then insert </br> which is a singular command. there isn't a pair of them for that one.

here's a formatting example; if you want to make something bold, use this command: <b>text i want bolded</b>

it would appear like this: text i want bolded

remember! the commands will do what you tell them to, so they don't appear in the final text - they just disappear! thus, you should finish writing whatever you want and then add the commands.

here's a little list of commands:

bold: <b>bolded</b>

italics: <i>italicized</i>

underline: <u>underlined</u>

paragraph break: <p>paragraph</p>

line break: </br>

i recommend doing indents using eight spaces. for them to show up, though, they have to be in between the <p> command and the first line of your text. otherwise they won't show up. see here:

<p> The first word of my fic.</p> (depending on your Tumblr it actually might not show up :( but I promise there's an indent there if you do it on ao3!)

now here's the command for hyperlinks, which is slightly different from the others on here. you have to add the link you want within the carats. here's an example: <a href="https://archiveofourown.org/">link to ao3</a>

it would look like this when published: link to ao3

so here's one you can fill in:

<a href="link">hyperlinked</a>

when i want to do anything more complex than that, i usually search on W3 schools, which has good HTML resources. here's their thing on basic HTML formatting and HTML hyperlinks

hope this helps! if you need any more instruction or have any more questions, just DM me.

I write my fics out in Google Docs and then paste the text into Ao3 when I'm ready to post it. Does anyone else have the problem of pasting with italics? If there's a word in italics next to punctuation, Ao3 will add in a space for some reason and it's kind of infuriating.

One of the AO3 translation volunteers (Min) created a Google Docs script to handle issues when copying from a doc into AO3. It’s really easy to use

create a copy of this google doc. It contains the script that will do all of the HTML formatting for you.

Delete all of the text from the document.

Write or paste your fic/chapter into the document.

Go up to the top menu and click the new menu option Post to AO3, then choose Prepare for posting into the HTML editor

Note: because this is an apps script, you’ll need to give it permission to run the first time. 

The script will automatically mark up your document with the required HTML that you can then paste into the AO3 composition window. \o/

To revert your text back to normal, just go back up to that menu and choose Remove HTML. It will look like regular text again. 

Once you have the doc, you can make a new copy of it for each new fic you write and that way you’ll always have that script available when you need it :)

For other cool stuff, read this post from @ao3org - which is where I found this script in the first place ❤