f2u Penguin MMO
explorerofsky
- Created
- 2 years, 4 months ago
- Creator
- explorerofsky
- Favorites
- 293
Profile
Started on December 24, 2021. Finished on December 25, 2021. i added a part for pins on the 26th but shh im not changing the date
The first HTML/toyhouse code I made after using htmls made by others for tumblr and toyhouse while wondering how to make an html myself lol. And it's based on the Club Penguin player card. Hopefully the mouse doesn't go after me for this lol.
This code is not mobile friendly. I don't use toyhouse on mobile and don't know enough about coding for mobile
Turn off WYSIWYG and turn on Code Editor (in your Display Settings) before inputting code
Code link
5 tabs version
7 tabs version
OK
- personal use
- editing code (changing colors, purposes of tabs, etc)
- frankensteining or using snippets/pieces of other people's code in this code if they allow it
- using as a reference or guide for coding
NOT OK
- removing credit
- redistributing/reposting the code
- making a p2u version
- claiming the code as your own
Name
This is the first tab. Think of it like the first paragraph or few sentences describing the character on their wiki page.
When there's enough content for this box scroll to scroll, the upper right and lower right corners are no longer rounded as long as you're on a tab with that much content. I don't plan on changing the code and making another card inside a card. I value my sanity.
The dark blue square on the left is 360x360px. I recommend an image with a 1:1 ratio. If the image is transparent, the blue will be visible.
The 60x60 placeholder image in the playercard is for pins.
Personality
Here's Tab 2.
Likes
- This sparks joy
- A beloved
- I've been delayed I've been delayed
Dislikes
- This does not spark joy
- A beloathed
Appearance
Do people on toyhouse dedicate a section to describing their character's appearance or is it just me? This can be used if your character has multiple outfits/forms.
For the images with buttons above, I suggest looking at a guide on adding tabs. The thing with href and id should apply here. I recommend using font-awesome icons if you want to add a few more buttons and are willing to sacrifice labelling/using text in favor of icons. I can't seem to make tooltip do the thing with the label appearing above with buttons.
History
Early Life
Section 1 text here.
Part 2 BABYYYYYY
Oh no what happened here
Operation: Blackout
Operation: Blackout is a pretty popular arc. I think it's because OP: BO is free real estate for angst.
Extra? Headcanons? Trivia?
Headcanons
- Miscellaneous information about the character?
- CLICK CLICK
Trivia
- Are there previous concepts of the character?
- What inspired their design?
- Playercards have 7 buttons. Unfortunately, div class "content-justify" can fit up to 5 so I had that for a while until I decided to remove "content-justify" and set a left margin for each button. It's possible to make a seventh tab. I made a version with the seventh tab but at best, it's an extra tab. Maybe it can be used for puffles.
- I wanted to make another button on the upper-right corner of the playercard but I can't keep the playername in the center and have the button there at the same time. It didn't work out. If it did, I would use it as a badly-hidden button leading to another tab that could be used for meta information or puffles or something lol
- The original width of this card was 450px until I changed it to 500px. 450px looks better visually but with 500px, you'll be able to fit ~400px wide images.
Relationships
Gary
At least three lines of text are recommended so the result doesn't look weird. Just shove in filler text. Anyway, guess how many socks Gary has.
Herbert
if two guys were on the moon and one killed the other with a rock would that be [BANNED]. This user has been banned for 24 hours due to foul language.
Rookie
At least three lines of text are recommended so the result doesn't look weird. Just shove in filler text. CLICK CLICK.
Friends? Family?
Name
This part is meant for sections/groups like Friends, Family, Co-workers, Enemies, etc if you like to have a lot of characters in here and don't want to make a tab for relationships with tons of characters. Below is a variation of code for characters without profiles or a page to link to, and a scroll box for text.
Name
The name above has no link, in case that character doesn't have a profile or page to link to.
I don't really like this version with the scroll. Mostly because the box height is small.
Recent Images
No images.