MODULAR | Customizable Layout (How To Get This Code)

MODULAR is, as the name implies, modular! That means that getting this code works differently.

Just follow along and you'll be fine, promise. But Rules first. By using any of this code you're agreeing to them so be sure to read!
Breaking the rules just ends in shame and also being blocked.

1. Don't redistribute any of this code, smacking it around for personal use is fine but don't abuse it's piecemeal nature for profit. Yes this includes F2U codes. 
2. You can   reference   it if you so desire. but copying stuff straight out is lame. 
3. Credit can be moved but not removed.
4. You can use this code however you want and edit it up freely, but I'm not providing any tech support! 
5. Don't ask me questions for real. I get overwhelmed easy and if I start to see this as a chore I'll end up just not wanting anything to do with it. Google it my man, you can do it, you can learn the coding.
6. You can suggest further new parts but unless you pay me I'm not required to do them.

This code has a couple versions. You have to pick out what version you're going to work with before you start so that you grab the right foundation code. Don't worry though, the differences are mostly visual and the code works the same way no matter which one you pick. Also, All these codes are 100% HTML and can be used by free OR paid users. All versions are also mobile friendly!

• Regular/Bootstrap
  • Foundation Codes "The Foundation" & "What If It Was In A Box?"
  • The Original version. This version changes colors depending on what site theme the viewer is using. It also changes with CSS rethemes but some modules will break if the retheme is too extensive. There's instructions in the usage notes to swap from dark to light!
  • Examples one two three css retheme
• ReColor
  • Foundation Codes "ReColor" & "Boxed ReColor"
  • Basically the same as the regular one except you pick the colors and they're the same for everyone no matter what! Also may break with some CSS rethemes.
  • Example one
• Cardoflauge (Sometimes I mess up and it's Codeoflauge)
  • Foundation Code "Cardoflauge"
  • A completely recoded version that uses cards. This one is meant to react properly to CSS rethemes so it doesn't look as good in pure HTML and it only comes in bootstrap. Some of the modules have been tweaked to work properly and look different. Basically you can use this on a free account but it might not look good. There is instructions in the usage notes that can make it look better though!
  • Examples one two three html

Now, you have to get The Foundation for the code. This has the usage notes, essential formatting, the header, and the footer (which has the credit). Copy and paste this IN IT'S ENTIRETY to your character. (Make sure WYSIWYG is off!)

Read all  the usage notes, skipping them will just make you sad later. It also now has a bunch of cool tips for making this code into what you want!

Inbetween the header and footer is a bunch of empty space, which I have named THE CODE ZONE, this is where the modules are gonna go.

Now you get to pick out what you want actually in the code and where. The fun of this code is you can copy and paste in any of the modules you want, in any order, any amount, and at any time.
Want 6 text boxes? Sure! Just the basics and some trivia? Easy. All art all day? Of course. Have tons of writing right now but no art yet? Just add it later! Easy as pie.

I recommend using Circlejourney's ToyHouse Editor, it's a good way to check if you like the order of your modules!

Just make sure you're copying entire modules, and not putting them IN other modules. And make sure if you're using the ReColor version you grab the ReColor codes.

Module start and ends are marked, I heavily suggest not removing these.

There are three types of module. Text, Image, and Specialty. The first two are self explanatory.

Specialty modules are ones made for types of characters who end up needing extra boxes you can't always find.
For example: The "Oekaki Species" module has a place for trait rarities, special links, and breedings. The "Homestuck" modules have things like strife specibus, sylladex, chumhandle, etc. 

This is so you can actually HAVE matching profiles for everyone, regardless of the details!

Once you have everything pasted in how you want it, just start filling it out! as you find yourself needing or not needing things you can easily take them in and out! 

Once it's filled out you should 100% comment the final product, this will help me see how people use this code and ways I can add to it to make it better. So if you want more and better modules later, link your characters! I would also appreciate a thread bump, it helps more people see the silly amount of work I've done!

Here's some resources from other creators that work awesome with this code!

• Visuals Goodies
  • Pride  one two three four five
  • Ribbons/Awards huge masterlist one
  • Backgrounds one two three four five
  • Color Palette from Image (Plug in a character ref and get a ReColor palette!)
  • Pixels
• Additional Code
  • Corner Pagedoll (Version with Speech Bubble)
  • Prounoun Dropdown
    Subject: [1] laughed at the joke. Object: They talked to [2] about pets. Possessive: [3] favorite color is unknown. Possessive Pronoun: The card is [4]. Reflexive: [1] think(s) highly of [5].

    ---

    Full List Snippet by MICROWBIRD
    
    
  • Functioning Close Button
  • Lots of little things
  • Calendar
  • Alerts
  • Alert Box
• CSS Rethemes (If you get a chance to try this code with a retheme not listed here, let me know how it goes!)
  • Tested and works one two three four
  • Not tested but may work one two three four five six

• 2/19/2022 I have homework.
  • Added Image Module: Icon Splash
• 3/1/2022
  • Redid the code pick up pages!
  • Updated Playlist 1.1 is out and behaves in a less ugly way on smaller screens.
  • Updated Awards 1.1 now has hover descriptions so we don't have to memorize what all these awards are for.
• 3/5/2022
  • Added Cardoflauge versions of all existing modules + new previews.
  • Updated The regular foundations now have instructions on how to swap from dark to light colors.
• 5/12/2022 Here I go coding again.
  • Added Artsy Tabs 1.0 for if you thought the Cardoflauge tabs was cuter. Comes in regular and ReColor!
  • Added Tell Us What You REALLY Think 1.0 It's an inventory! It's a story! It's another damn relationship module because I'm never happy! It's whatever the hell you want really! Only in regular and ReColor. Cardoflauge version tba.

• I can't find the codes!!! 
  • Don't skip the instructions then.
• I have a quick question about a problem I'm having- 
  • Check to make sure your divs are all in pairs, it's probably that. 
  • This code is secretly meant to teach you that it's okay to mess with codes and to give you some familiarity. So I won't answer many questions. Just save a lot and play with things, that's how I learned!
• I want to use multiple tabs/carousel sections but they keep breaking!
  • You have to make sure each version of the module has it's own set of "names"
  • For Tabs this means all the tab addresses that look like this:
    • #TAB1
  • Need to be unique from individual tab to tab.
  • The carousels need their own numbers. So Ctrl+F:
    • carousel3
    • carousel2
  • and change the number on the end. 3 is in the Ref code, 2 is in the Full+Aes code. Be careful to only change the number for one of the modules. Replacing all will just break them again.
• Do I need to pay to use this code? / Do I need a premium account?
  • Nope to both! This code is free and has no CSS components.
  • But showing me your filled out layouts will give me so much serotonin it's basically the same as paying me. :3c
  • (You can also give me a ko-fi to make up for the comical amount of time I've spent on this.)
• Can you make a module that looks like xyz? 
  • Perhaps, I'll consider it as long as you:
    • Ask Nicely in the comments of This Tab
    • It's not something that one of the other modules easily converts to (ex; picture divider but bigger, likes/dislikes but they're text boxes, etc.)
    • Not aping off another creator's work
  • Even then I'm still open to saying no.
• Can I request a Specialty module? 
  • For me to make a new Specialty Module I'll have to know a few things:
    • Ask Nicely in the comments of This Tab
    • All the things this Specialty has to cover, I don't know anything other than Homestuck tbh.
    • Are there variations that people might need.
    • And most importantly: Is this something that enough people have to be worth the work
  • Like, it's all chill if you would like the closed species you made to have a Specialty, I get that for sure, but it's going to be low/no priority. Unless you buy me a ko-fi. 
• Is Cardoflauge getting a ReColor?
  • Not in the near future. ReColors honestly take the longest and Cardoflauge is meant to be used with CSS that does the recolor for you. So it's low priority. I believe in your ability to do it yourself though! Or if you're lazy just change the accent color it'll look good too.