Ladystuck Remix editing progress

[edenfalling]

I have finished the edits for one of my Ladystuck Remix fics. I also wanted to do a cool thing with Unicode, but apparently AO3 doesn't support what I was trying to kludge it into doing. *sigh* I went with my backup option instead -- it serves the same purpose, but it's not nearly as aesthetically pleasing.

Now I am going to eat lunch and spend my afternoon editing the other remix fic. I think I know what the thematic throughline needs to be, so it's just a question of what tweaks, insertions, and deletions will best bring it out.

-----

ETA, 8:30pm - And I have edited the second remix, yay!

Comments

[heliopausa]

The arcana of ao3! I wanted very much to do a boxed text recently, but couldn't find a way to do it. (Or maybe, was too impatient to work until I did find a way.) Was it a layout thing that you were trying to do?

[edenfalling]

It was a font thing, actually, and while I found the right Unicode characters and the approved way to write them, AO3 refused to recognize that what I'd typed was meant to be instructions, and also deleted all the plaintext in and around the Unicode stuff. :(

But I can help you with text boxes! You do them via CSS work skins.

You have two basic options. The simple one is to open the editing page for the story in question. In the gray box labeled 'Associations,' the last field (after collections, and gifts, and series, etc.) is one that says 'Select Work Skin.' There should be three public work skins available in the dropdown menu. Choose 'Homestuck Skin.' This will allow you to use a bit of code to create text boxes in the particular fics to which you've chosen to apply that skin. (It will also allow you to do a whole bunch of other, colorful text effects, but they are irrelevant so who cares.)

Then you go into your actual story text (you have to be using html rather than rich text, FYI; I have NO IDEA how to do this in rich text) and, around the bit of text you want to put in a tidy gray box, you type the following:

<div class="block"> text you are putting in the box goes here </div>

That will make a text box!

However, you will not be able to adjust the dimensions of the text box, because this one is set to mimic the formatting from the Homestuck webcomic instant messenger dialogue boxes and you can't change a public skin that thousands of other people rely on to produce certain specific effects. Therefore, if you want to create differently-sized text boxes, you will have to make your own private work skin. Fortunately, this is not hard.

To create your own work skin, go to your dashboard. In the column on the left, near the top, there should be a link that says 'Skins.' Click that. On the page that appears, click the button labeled 'My Work Skins.' This will relabel the button in the upper right corner; it will now say 'Create Work Skin.' Click it.

You will have to title your new skin. Call it whatever you want, though I suggest mentioning text boxes either in the title or the description. In the CSS box, copypaste the following code:

#workskin .block {
width: 650px;
margin-left: auto;
margin-right: auto;
background: #eee;
border: 1px dashed gray;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 35px;
padding-right: 35px;
}

That is the code for a Homestuck-style text box. You can now alter it however you like! Increasing the width value will make the text box wider. The padding values increase or decrease the amount of blank space between the text and the edge of the box. To change the background color, enter a different hexadecimal code in the background value -- you can google for hex color codes pretty easily. But that is the basic code. Hit save (don't apply to make the skin public; it is just for you) and then you can edit any story you choose and apply the skin. You set off the text box the same way as with the Homestuck skin, using the div codes.

And that is how to do text boxes on AO3! :)

[heliopausa]

Thank you! This feels daunting, but I have filed all of it for later use, and may even before too long manage to go back and put in the text box where I wanted it the first time! :)

[doire]

Do you know https://mothereff.in/html-entities ? If you can paste a character into the top box, a code string appears in the bottom box which you can paste into most forums, comment boxes, etc.

So I can paste 字 directly in dreamwidth, but if I couldn't I could paste &#x5B57; and have it show as I want.

[edenfalling]

The problem wasn't finding the right Unicode characters. I found them just fine. The problem is that AO3 refused to display them, and in fact deleted my Unicode characters plus all the plaintext that came after them in the file. :(

I might run some tests some other day, but this afternoon I kludged together yet another unrelated (but more aesthetically pleasing) workaround and I am calling it good enough.