fixAO3 ✍️#

Provides OpenGraph tags and redirection for items on AO3.org. Should be pretty easy to hack for non-AO3 sites; just change the references to https://archiveofourown.org and you should be good to go.

If you'd like to support further work, you can tip me on ko-fi! Also props to Fujocoded's AO3.js for making this possible.

self-hosting#

you too can self-host if you want to change the visuals or just have a different redirection url or something. the main things you need installed are:

• Bun
• Probably some process manager like PM2 (you will also need Node.js for PM2)
• A web server that allows reverse proxying (I use Caddy)

How to run:

• copy .env.example to .env, and update the variables in there to be whatever you want them to be. the lists of existing themes and fonts can be found in the src/lib folder, for setting defaults
• bun --bun next start will run the application. if you're running it through pm2, do pm2 start --name=fixao3 bun -- --bun next start
• set up a reverse proxy on your domain or subdomain to localhost:3000
• it should, theoretically work (installing imagemagick from source is the hard part. wheeze)

How to customize:

• stuff like site name, meta description, etc. are set in site variables. right now the ARCHIVE var is only used for what to display on the bottom of cards because I'm not sure how AO3.js supports other archives apart from that it does.
• basically all the styles are in src/app/globals.css
• add fonts to src/lib/baseFonts.js and src/lib/titleFonts.js, and themes to src/lib/themes.js (titleFonts already grabs all the baseFonts as long as you don't remove ...baseFonts from the array)
• icons are svg components stored in src/icons if you don't like my icon choices
• add font files to the fonts folder. they have to be either ttf or otf (sorry, no woff/woff2, next/og hates those as it turns out)