1 - 20 of 30 Works in The Witch's Brew

Pages Navigation

Listing Works

  1. Tags
    Summary

    This is a personal experiment with HTML. It is a very limited list with what I find useful.
    Update: Somehow I find more and more stuff useful, so this list is not that limited (and not that private) anymore. I'll improve it with time and according to my needs. I just realized, this will never be "complete" and there is no final number of chapters.

    So far that's posted:
    Part One: Basics
    Part Two: Lines
    Part Three: Footnotes and Links
    Part Four: Columns and Skins
    Part Five: Pictures
    Part Six: Choose Your Own Adventure
    Part Seven: Chapter Title
    Part Eight: The Title, the Username and Links
    Part Nine: Boxes (still in progress)
    Part Ten: Newspaper Article

    Language:
    English
    Words:
    7,994
    Chapters:
    11/?
    Collections:
    5
    Comments:
    54
    Kudos:
    246
    Bookmarks:
    308
    Hits:
    7688
  2. Tags
    Summary

    What this is, is a bunch of tips and tricks. There’s a Quick Start Guide at the top, for if you’re staring at your very first podfic and don’t know where to start. After that there’s a lot of the podfic equivalent of, ‘Have you tried a baking strip?’ and, ‘This is what butter creamed with sugar should look like.’ Etc. Take what’s useful; forget about what’s not. Cheers.

    Series
    Language:
    English
    Words:
    4,282
    Chapters:
    1/1
    Collections:
    2
    Comments:
    7
    Kudos:
    22
    Bookmarks:
    10
    Hits:
    273
  3. Tags
    Summary

    A very simple workskin to hide/show spoilers in your works by having your users clicking on a button!

    Series
    Language:
    English
    Words:
    319
    Chapters:
    1/1
    Collections:
    5
    Comments:
    13
    Kudos:
    54
    Bookmarks:
    41
    Hits:
    1876
  4. Tags
    Summary

    Hi hi! You can call me Jal, and I've been publishing exclusively at AO3 for about 6 months, with my draft work primarily in Google Docs. This is a compilation of helpful tips, how-to's, and gotchas from my experience. Let me know what else you want to see in future chapters!

    Series
    Language:
    English
    Words:
    9,002
    Chapters:
    4/?
    Collections:
    1
    Comments:
    22
    Kudos:
    64
    Bookmarks:
    38
    Hits:
    1177
  5. Tags
    Summary

    HTML/CSS to replicate an email in Gmail as a work skin.

    Language:
    English
    Words:
    695
    Chapters:
    1/1
    Collections:
    2
    Comments:
    5
    Kudos:
    26
    Bookmarks:
    20
    Hits:
    512
  6. Tags
    Summary

    Here is the CSS/HTML for a simple sports scoreboard to use in your AO3 works.

    Language:
    English
    Words:
    244
    Chapters:
    1/1
    Collections:
    5
    Kudos:
    22
    Bookmarks:
    13
    Hits:
    911
  7. Tags
    Summary

    A bunch of Ao3 Skins with flag pride colors!

    Happy pride month!

    Series
    Language:
    English
    Words:
    6,008
    Chapters:
    16/16
    Collections:
    5
    Comments:
    91
    Kudos:
    732
    Bookmarks:
    334
    Hits:
    18879
  8. Tags
    Summary

    A skin that makes the text rainbow and multicolored.
    Sot of Beeline style.

    Series
    Language:
    English
    Words:
    846
    Chapters:
    1/1
    Collections:
    5
    Comments:
    6
    Kudos:
    60
    Bookmarks:
    29
    Hits:
    4398
  9. Tags
    Summary

    Use this code to create a link to a specific passage or scene in the middle of a chapter.

    Language:
    English
    Words:
    158
    Chapters:
    1/1
    Collections:
    3
    Comments:
    14
    Kudos:
    60
    Bookmarks:
    38
    Hits:
    2917
  10. Tags
    Summary

    Explains:
     ● how to make a work skin;
     ● how to view fics' work skin rules;
     ● how to colorize text and circle words and highlight backgrounds (examples in head-note), and change and resize your fonts;
     ● the CSS code for diacritics to render properly, e.g.: “ầ” & “ồ” (with diacritics not superimposed), or “ị” (with underdot directly beneath, not kerned to the left), without breaking words such as “gầu” or “vịt” (using a monotype font for these letters would create gaps to each side of the ầ or the ị). Head-note has corrected examples;
     ● Site Skin addenda to block / shrink tags, and block authors / works;
     ● even a quick way (code included) to simply make a Site Skin so that you can read everything in your font of preference!

    Full code is included.

    I read, appreciate, and reply to all of your comments — they're always welcome!

    𝑫𝒐𝒏'𝒕 𝒇𝒐𝒓𝒈𝒆𝒕 𝒕𝒐 𝑳𝒊𝒌𝒆, 𝑺𝒉𝒂𝒓𝒆, 𝒂𝒏𝒅 𝑺𝒖𝒃𝒔𝒄𝒓𝒊𝒃𝒆! ❤️

    Series
    Language:
    English
    Words:
    17,488
    Chapters:
    1/1
    Collections:
    6
    Comments:
    153
    Kudos:
    190
    Bookmarks:
    207
    Hits:
    14647
  11. Tags
    Summary

    Live example and tutorial for a news article extract that include website header, fake social media buttons, title and author of the article.

    Series
    Language:
    English
    Words:
    835
    Chapters:
    1/1
    Collections:
    5
    Comments:
    5
    Kudos:
    124
    Bookmarks:
    144
    Hits:
    5635
  12. Tags
    Summary

    Learn how to edit the HTML of your image files so they automatically size themselves to fit any screen (both mobile and desktop). It's super EASY!

    Language:
    English
    Words:
    256
    Chapters:
    1/1
    Collections:
    3
    Comments:
    57
    Kudos:
    589
    Bookmarks:
    361
    Hits:
    16645
  13. Tags
    Summary

    This is a tutorial/live example on how to make large images fit on mobile browsers but remain normal size on desktop browsers.

    Series
    Language:
    English
    Words:
    689
    Chapters:
    1/1
    Collections:
    5
    Comments:
    67
    Kudos:
    583
    Bookmarks:
    293
    Hits:
    14937
  14. Tags
    Summary

    This is a tutorial/live example on how to mimic the look of letters, fliers, and stationery (as well as other forms of written media) without using images. For all your epistolary fic needs.

    Series
    Language:
    English
    Words:
    3,724
    Chapters:
    1/?
    Collections:
    8
    Comments:
    70
    Kudos:
    699
    Bookmarks:
    454
    Hits:
    21129
  15. Tags
    Summary

    This is a tutorial/live example on how to create a "Choose Your Own Adventure" fic. While this has been explained before (see here), this particular tutorial shows you how to use a work skin to hide the next parts from the reader until they click through to get to them.

    Series
    Language:
    English
    Words:
    1,769
    Chapters:
    1/1
    Collections:
    6
    Comments:
    44
    Kudos:
    601
    Bookmarks:
    429
    Hits:
    21892
  16. Tags
    Summary

    This is a live example of how an author can create linked footnotes in their work with only a little bit of HTML and no workskins required. This is best viewed by clicking "Entire Work". While I've included the actual coding in bold and italic once you click "Hide Creator's Style", there's a more detailed explanation here.

    EDIT 6/28/17: The third chapter now shows how to use anchor links as an index/table of contents.

    Series
    Language:
    English
    Words:
    3,457
    Chapters:
    3/3
    Collections:
    7
    Comments:
    72
    Kudos:
    354
    Bookmarks:
    488
    Hits:
    20702
  17. Tags
    Summary

    This a tutorial/live example on how to have text change or appear once a cursor is hovering over it. Helpful for pop-up spoilers, language translations, quick author's notes, etc.

    Series
    Language:
    English
    Words:
    999
    Chapters:
    1/1
    Collections:
    8
    Comments:
    51
    Kudos:
    326
    Bookmarks:
    359
    Hits:
    16765
  18. Tags
    Summary

    Anonymous on tumblr: do you have a skin that would mimic the author’s notes and review/kudos buttons section from the end of a fic? the desired effect being that the fic could go on after the “end” of the fic, so after the author’s notes and review/kudos buttons

    Here's a tutorial/live example to do just that, with some of the buttons actually functioning. I'll explain more inside!

    Series
    Language:
    English
    Words:
    729
    Chapters:
    1/1
    Collections:
    5
    Comments:
    10
    Kudos:
    229
    Bookmarks:
    47
    Hits:
    7760
  19. Tags
    Summary

    This is a tutorial/live example on how to align images to the left or right of the screen and have text wrap around them.

    Series
    Language:
    English
    Words:
    2,891
    Chapters:
    1/1
    Collections:
    4
    Comments:
    3
    Kudos:
    91
    Bookmarks:
    69
    Hits:
    6261
  20. Tags
    Summary

    This is a tutorial/live example on how to mimic email windows on AO3 without the need to use images.

    Series
    Language:
    English
    Words:
    2,551
    Chapters:
    1/1
    Collections:
    7
    Comments:
    28
    Kudos:
    280
    Bookmarks:
    252
    Hits:
    13856

Filters

Filter results:
Submit

Include

?
Include Ratings
Include Warnings
Include Categories
Include Fandoms
Include Characters
Include Relationships
Include Additional Tags

Exclude

?
Exclude Ratings
Exclude Warnings
Exclude Categories
Exclude Fandoms
Exclude Characters
Exclude Relationships
Exclude Additional Tags

More Options

Crossovers
Completion Status
Word Count
Date Updated
Submit

Clear Filters

Pages Navigation