#html coding

[amiablescamp]

Hello, fellow freaks, weirdos, and Fallout fans!

I made something pointless and fun. It’s a little Fallout-themed HTML template for OCs, character profiles, and fan pages. It’s open-source, lightweight, and easy to tweak, so you can make it yours whether you’re a writer, artist, roleplayer, or just somebody who likes putting personality on the web. The HTML code is exportable and I added notes on exactly where to edit.

Here’s the link → https://amiablescamp.nekoweb.org/falloutoc.html

Please fork it, remix it, or steal whatever parts you want. If you give it a spin, share a screenshot or drop a link to your page. I’d genuinely love to see your creations and OCs. Feedback, bug reports, and feature ideas are all welcomed with open arms.

If you need a source to edit on, you can use this (It won’t be published) → https://www.w3schools.com/html/tryit.asp?filename=tryhtml_intro

Or you can make your own page using either of these sources →

nekoweb.org

neocities.org

Happy OC making

[amphibianauthor]

Interactive Games on Ao3

HTML and CSS on Ao3 is an awesome tool that allows for some amazing fandom applications. I have made a habit of collecting these resources, but one of the coolest types of fics I've found are actual interactive games in Ao3, and me being the html tryhard's self-appointed librarian, I've decided to compile these together in both my resource doc and on this tumblr post.

But can it run Doom? by gifbot: Play Doom with every ao3 user on the page!

Tropémon by gifbot : an Ao3 based pokemon game!

Nethack Sokoban by gifbot: a puzzle game

I Don’t Think We’re Ready for the Takeoff by gifbot : besides being a phone with interactive bits, you can play flappy bird

Conway’s game of life by gifbot

I Crush Everything by gifbot: play as squid that crushes things!

Five Times Luna Saw Snape Die (and One Time She Didn’t) by gifbot: Harry Potter Point and click adventure

Changing the game by mackerel_cheese: A really cool Game Changer mini-game style fanfic

New Roman Times Games by mackerel_cheese: play percy jackson themed word games

Mythomagic, 1st Edition: Battle of Olympus by mackerel_cheese : percy jackson card game simulation fic

do you believe in coincidences?  by mystyrust: danny phantom phone fic

Romance Route DLC by jihnari: a The Hundred Line -Last Defense Academy Dating Sim hosted IN ao3!

Thousand Illusions by BurntMochicha: Dr. Stone Visual novel

Makoto Calls Byakuya a Bitch: An Interactive Fic by solace_at_last: Dangan Ronpa Visual Novel

Project Sekai Ao3 edition by polyneedpilled: Rhythm game IN ao3

Tower of Hanoi by the_untamed_poet25

Simon Sequence Game by the_untamed_poet25

Several Hangman games: X X X X X X X X X X by the_untamed_poet25 Hangman collection

Who Stole the Treasure on the Sunny by the_untamed_poet

Hunt the Whumpus by Charles_Rockafellor

Bubble-pop! Game by Charles_Rockafellor

Heark’s character creator by heark 

Closed Loop System by One_of_Them (greenbean_paste) Murderbot diaries fic with PLAYABLE minesweeper

spare time by One_of_Them (greenbean_paste) sad bowling game

Sudoku in Heart Flutter Against the Stars by WordsofWilderness: Sudoku in a Harry Potter Fanfic

Snao3ke by taxen99 : Snake!

windows9ao3 by taxen99: don’t know if this technically counts since its a computer but its very cool

Figured You Out - by Suzukitich  multiple logic puzzles

Logic Grid Puzzle Work Skin & Tutorial by BookKeep

The Case Of The Clickable Murdle by VThinksOn

Special thanks to @gifbot for both making a bunch of these games, but also making me aware of more games I had missed when making this.

[doqmeats]

F2U JS walkman mp3 player by doqmeat

live preview / download / github repo

made a f2u music player for webpages that resembles a walkman mp3 player from around 2008. i had one of these when i was a kid and thought it would be fun to recreate it :p

it has playlist screen where you can select your song, a currently playing screen, and the upper arrow let's you search the currently playing song on youtube.

gif demo + credit of used resources below!

miku cursor not included!

credit: built using js-music-player, nerdfonts, and style-my-tooltips

[staarcore]

starry night inspired 2010s/late 2000s HTML blog layout for neocities/nekoweb

mobile friendly!

[storyofnebula]

petal ⟢ a minimalist sidebar theme

preview here! code (paste this in the edit html section of your custom theme!)

about this theme:

🌙 single-column layout with a minimalist sidebar

✨ supports all post types (text, photos, photosets, quotes, audio, videos, etc.)

🔮 built with html, css, and vanilla javascript

💜 day/night mode toggle with switch

🪻 multi-panel sidebar, about + nav section with search + custom links

⭐ fully customizable from tumblr's customize panel, you do not need to edit the code: ‣ 12 color options (6 light mode + 6 dark mode) ‣ 2 font choices (title + body) ‣ custom sidebar header image ‣ 6 custom link slots ‣ 3 post width options (400 / 500 / 540px) ‣ 10 on/off toggles for header, avatar, description, search, tags, notes, & more !!

🌌 full reblog trail support with usernames visible

💫 mobile-friendly: sidebar hides on mobile for visibility

🪐 pagination with page numbers

this is free theme, but reblogs are appreciated! don't remove watermark!

[pixels-and-layouts]

itiOS. Windows inspired website layout.

Website template (HTML / CSS / JS )

LIVE DEMO + more info : HERE !

Buy here : Ko-fi (17€)

Not responsive

Fully customizable

More layouts : https://itinerae.org

Using this layout requires intermediate knowledge of HTML and CSS (including flexbox).

Reblogs are highly appreciated.  ♡

[sleepyblr-heart]

Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.

In other news I spent like 3 days last week focused entirely on making this Artfight character template for my object fellows based on whiteboard fox. I see no reason to keep it to myself, so if you wanna have fun and joy and use my funny code do so here! It's mobile friendly as well (with a minor issue regarding being able to scroll right slightly on mobile) but it works perfectly well. You can see it in action on my profile, currently though i've only gotten around to doing Present's page bc i am lazzyyyyy anyways have fun bye

[deityoftherain]

Random AO3 Tips

I have a list of resources on my pinned post, but I don't really have a place for the simple miscellaneous tips and tricks, so here's this!

I didn't know most of these existed for probably far too long, so this post is mostly to spread awareness for new users or those who may not have heard of them before <3

I'll update this post if I learn of any other handy tricks. If you know any, let me know and I'll add it here :D

Basic HTML codes for A/Ns and etc

Note: Screenshots of the HTML "codes" at work are shown under the cut!

Center Text <center>TEXT</center> Clickable Link <a href="LINK">TEXT</a> Hideable Information <details> <summary>SHOWN</summary> HIDDEN </details> Insert Image from Link < img src="LINK" alt="IMAGE DESCRIPTION" width="100%" align="center" />

Italicize/Slant Text <i>TEXT</i> Line Breaks <br>TEXT</br> Paragraphs <p>TEXT</p> Strikethrough Text <strike>TEXT</strike> Underline Text <u>TEXT</u>

Single-post AO3 Guides

short guide on how to tag your own fics

short guide on how to title your fics/stories

how to embed images and links on AO3 [via Rich Text]

how to sign up for AO3-based exchanges (ft. @trafficteamsupportexchange)

Note: This is for formatting with HTML for the work, and for the authors notes where you Rich Text doesn't exist/work. Rich Text, on the other hand, should transfer most of these from whatever document resource you're using, but I've personally had issues with strikethrough not transferring from Google Docs copy-pasted to AO3 Rich Text, so just double check those areas!