heya! i've used this for my character but i've changed/added some things- and, i've been struggling with the playbutton? im not a coder whatsoever, and this is all just amateur on the guess work- so im pretty sure i fucked something up ahahah... is it okay to get a little help? https://gist.github.com/unitlock/57ac59c87e92f5d261251405cedc2e9e <-- this is the current code for https://toyhou.se/24704110.s-i-n , and also i have no clue if im using github right i just thought this would be easier for you to have a look at- god i dont even know LMAO
Hi ! code used for Josiah’s profile that I completely finished.
I also used it for Jason, Cléore and Octavia !
I love this code and I plan to use it for other characters in the future because it is very complete, with an aesthetic that I particularly appreciate and offers a very large possibility of color customization!
(which is one of my main code selection criteria for the profiles of my characters because I have a holy horror of bootstrap when it prevents color customization)
I always end up coming back to this code when trying to decide what to use for my characters. Ever since I've seen it, nothing seems to fit my criteria!! And I'm SUPER PICKY!! It just seems so daunting to fill in 😭 I think I'm gonna have to take the leap and just do it. I really can't see my character profiles dressed up in anything else 😂💕✨️
I absolutely love this code but it reminded me how much I suck at coding 😆 There might be some things that I might not be using like the playlist drop thingy but, otherwise, it looks fantastic. I might just need some help on how to start things up and I'd be good to go 😊
Glad you like it!
If you need any guidance with using codes on the profile, there is a thread with some starter guides on TH coding forums. The main thing you need to remember is always keep WYSIWYG OFF when editing profiles that include coding because a single turn on of WYSIWYG can break them on spot. Otherwise there should be enough comments inside the code to fill all the information easily without applying any massive changes to the layout.
Thanks a bunch 😊 Now, I decided to keep the playlist but I'm having troubles with the Play button. Also, is there a way to turn the Play button into a Pause button when the song is playing? Again, you code is incredible and easy to understand but I feel it might take me a little while to fill it up like I would (but that's a whole other story).
The whole player thing is not an actual player but an imitation, the play button is just a static icon positioned over the hidden play button from YouTube embed, so it's not possible to make it actually interactive sadly!
Aww, gotcha. Still, on my end, it just doesn't play. I dunno if the links I put in the src are wrong or if I need to input something to make the songs play.
Music players use youtube embed so you need to change only the last part and insert the YouTube video ID there (symbols line between = and & in youtube video url)
Example:
https://www.youtube.com/watch?v=MaeRXppkzdA&ab_channel=CaravanPalace
from the link above the highlighted part is inserted at the end of the link in the code
https://www.youtube.com/embed/MaeRXppkzdA
Sometimes it can not work even though the link is built correctly because the original video's author doesn't allow their videos to be put into embeds, but it's something I have seen very rarely so usually all should be good
I've not quite finished it, but your rules allow frankensteining as well as referencing and I was curious if this was an acceptable use case? The frankensteining is a lot more in the start because I was also using this to better understand how bootstrap and th codes work. Credit is given for you and the other code being frankensteined in smaller sections!
This user is not visible to guests.
Hi there!
You need to edit the songs in dropdown menu and the actual songs with the play button separately and match them. I believe you were changing only the tabs with play buttons, at least that's how it looks on the actual profile (also, when you need help with coding please show coders the actual profile or the code (or better both!!) because we cannot tell what is wrong from a static screenshot)
This user is not visible to guests.
All good!! The image did work, what I meant is that image usually doesn't do much for coders to see the problem! It's better to link the profile you encountered the issue on (it's the best option honestly) and maybe show the code/code part in question that can be broken or might not be working properly. Just letting you know so if you ever encounter the issue of any kind you are not able to solve you can make it easier for both you and the coder!
hello!! im using the code currently for a funny challenge i thought of (which was to create a detailed character on the spot, its still a big wip) and i came into a questions -- what does it mean when it says 'class' in the basics section?
EDIT: It was only one question, so I removed the 'few' part.
Hi there!
It really mostly depends on your preference. I see it either as a character class (mage, warrior etc., more rpg-aligned) or a social/cast class (like poor, middle class, nobility, clergy etc.)
oh, thanks! And also, when talking about settings in the personality(?) section, where does the list come from so i can find the one that fits the character?
It's really something more general that can describe the world your character is set in!
Something like fantasy, medieval, sci-fi, steampunk, cyberpunk, present/slice of life etc. I don't know if there is a list somewhere, I believe you can search for different genre and pick something that suits your character's world the most.
Hey <3 Absolutely love this code, I'm using it for all my chars! Just one thing, I'm using the safehouse version, and in the FAS or FAR sections for the skills and abilities, nothing happens when I type FAS or FAR. I'm kinda new to this, so what am I doing wrong? Tysm!!!!
This has to be tHE MOST DETAILED code ive ever seen!!!!! Im definitely snagging it to use for at least one of my characters! 😻
Using for multiple characters potentially! Thank you so much for making this, it'll help me tremendously for character-building! :D
Used it on my main Yuu this code is just awesome omg- I can only guess how long working on this must have taken
Hello, this code looks absolutely beautiful! I was wondering how to change the little personality bars so that they aren’t fixed in the middle?
Helloooo, I'm using this code for my character Sheridan! I adore this code - it's so extensive and fun! I had a blast editing this. Thank you for creating this masterpiece! <3
I'm using this code for a few of my characters (it's so so pretty and detailed) and I was wondering if there's any sort of way to remove the skills & abilities section without breaking the mosaic images on the side? When I tried to remove it, the images went under the combat section completely.
Oh my gosh this code is massive, which is exactly what I was looking for to dump all my info in haha. It's so pretty, I'll definitely be using it!!
Hi there! This is a beautiful code, and I plan on using it for my transformers ocs! My only question is, what is the difference between the "all-at-once" selection and the "custom" selection, if there is a difference at all?
Hi!!
With all-at-once selection, you click once and you have the whole code selected - just press ctrl+c and you can paste it anywhere!
With custom selection you can select parts of the code manually.
Usually you would probably like to use all-at-once selection! I was asked to add custom selection for this code because some users tried to copy it from mobile devices and it was too long for the mobile limit.
This one was amazing! I used it for my boy Dae-Hyun! Unfortunately, I don't have his backstory or images in yet lol. I accidentally refreshed the tab while writing his backstory and I don't wanna re-write rn lmao. I still have to draw images
this code is definitely my favorite of all time!!! it's so expansive w/ details and personality and ALL THAT!! your use of FA icons (in your other does too!) is really spectacular!
Hi hello! This code is fantastic, I'm having a wonderful time filling everything out! Thank you so much for making it and for making it free to use!!! <33
I have however run into an issue that hopefully you/someone with any HTML experience (I have 0) could help me out with? I'm trying to remove the quote block, and have the character overview block extend down to fill that space. I tried removing the block entirely from the code (in the pictures; first is that block gone, second is what was deleted) but it just ended up shifting the character basics block up and to the right a little, blocked by the space where the image would go. I tried fiddling with some of the numbers and px values of things that looked like they could fix this, but I really don't know what I'm doing and none of my attempts are doing what I hope they would send help please!
This is amazing!
I am a sucker for detailed templates like this and love how beautiful it is!
thank you so much!
This user is not visible to guests.
Hi there!
It's hard to say since you didn't provide any screenshots of how your links/edited code looked like. Can you provide something?
Just to assume, your link has to be a youtube video ID (and youtube only), so maybe you copied the ID wrongly or just missed something? As I said, I might be able to help if you provide me a bit more information!
Hi! :3
I think your code is broken.
No matter what I do, I can't change the values. Some code parts seem to be missing. Even if I copy it again it doesn't work. Your code is so nice but it doesn't work >.<
Here is a picture as proof:
Used it for this guy! I love this code but i'm probably waaaay to impatient to actually completely finish it xD
I'm just wondering, how can I change the attack wheel to have different values (not the names, the actual position of the stats themselves)
I finally finished filling out this code for my sun boi Sol! I'm hoping to fill it out again for my moon god later on! :D
(BTW this code is amazing!! The attack stats were so cool to fill out!! Thank you so much for making this code!)
I absolutely love this code!! I've never seen someone do the hex codes like that, and it's absolutely amazing!! The only thing I can't really seem to figure out is the music- How does it play? I've been testing the code to see if I can find a way to understand it and the music is the only part that trips me up ;;
Really nice character profile code, using it on my mains and some characters that have powers. The combat section is perfect for them since pretty much some of magic abilities in my project have inspirations from Jojo.
This is an awesome code!! I really love it. and I think I'm going to use this code more often for some of my Characters! One quick question: Is there any way I can add more songs ? Im using the Moonshine code Here
. Edit: and also add a fit background
This character has many mood songs so I was hoping I can add more. If it's not ok with you then it's totally fine I will just create a tab with a playlist.
I have this same question as well! I tried to paste it and noticed there wasn't any specified amount of songs on the carousel either (unless I am just missing something)! But even if I add another, it just adds onto the playlist block and doubles.
Here, I'll share a google doc otherwise the comment might end up a little too big- If you still do not understand, just ask, and I'll make a visual walkthrough instead of verbal to make it clearer what to do. Link: https://docs.google.com/document/d/1Pmhfhak1rlxo53bAbd3Fvf0CzWCiSU8bnpUj2jObrp0/edit?usp=sharing
Using this!! Love this layout so much, friend!!! I hope you don't mind if I change skills into Pokemon though?
This user's account has been closed.
Hi there!
Since this is not my CSS I can't provide any fixes for that and I never guarantee that my codes will be compatible with others' CSS. To fix this issue though I suggest giving a custom color to that text to match the default text color!
This user's account has been closed.
Something in the CSS overrides layout's styling (you can see that it affects every section that was rounded in my layout, adds some odd bg-coloring and many more). I don't know how to deal with that sorry! I suggest asking about this issue in the Help forum thread, maybe someone will be able to help you there!
This user is not visible to guests.
Hi there!
Ty!! It all depends on what you're going to remove and how! Like, you can remove the whole combat section and everything would be fine, just don't forget to also delete the appropriate navigation part at the topbar! And also don't forget to pay attention to the opening and clothing tags, because if you delete some element just partially and leave some mismatching <div>, or </div>, or any other similar elements with <>, it will probably break!
You can use the Toyhou.se Live Editor to delete some things you don't need and see how it will look without them live!
hey! :0 im not sure how editing the stats work, so could someone send a ss of how they did it or-?
Did you mean the stats in the combat pie chart?
If so, I recommend to scroll down through comments here as I've answered a question about it, providing step-by-step screens!
sorry for the incredibly late response, the issue actually lies within the standalone and paired stats- the code erases the editable 50% when you copy, paste, and save the code into the desired profile. I've been trying to fix it but nothings working, im assuming its to do with the fact i work on laptop but any solution or fixes would be greatly appreciated
Ello! I'm looking for a good playlist thing and found this! It's perfect but I can't seem to get it to work. I (think) I'm putting the ID in the right place but it never plays. Could you help me?
Hi!
To help you I need to see the problematic section in the code to check if you did everything right! A screenshot of how you inserted the YT ID might do!
My bad! It was pretty late my time so I must of forgotten. I've tried inserting the code into both places (shown here) and separately. I've also tried a whole new link.
hi there! i've used this code for my character herel https://toyhou.se/14361070.venere-azzurra however, i can't seem to get the main image to work?
I'm sorry for the possibly stupid question, bc I'm not a native eng, but what does Attitude mean in this context?
The attitude in front of Personality section meant to be a character's worldview/perception (optimist(ic), pessimist(ic), realist(ic) etc etc)
The one in the combat section meant to represent character's attitude towards combat and fighting based on the things that are important for them (for example, character with merciful attitude is not cruel, might not attack first and will always spare the enemy if they no longer want to fight. Character with merciless attitude might fight fiercely and won't spare the enemy who attacked them first. Character with guilty attitude might feel bad from fighting others in any way, while character with indifferent/cold attitude won't care and won't show much mercy, although also won't show strong cruelty. But that's just my personal take on those! These can mean different things based on your own thoughts and preferences!
\o/ This code is beautiful and so easy to work with. I'm still modifying it but I'm using it on my character here, I really appreciate this release!
currently using it for my DR OC Haku !! i loved the code, planning on using it for the rest of my characters <33 thank you so much !!
Aaaa using on my main sona (in IC) thank you so much <33 its an amazing code
Hi!
Each stat has a 50% starting value which you can replace with 1-100% to your liking with 1% being the start of the bar (left) and 100% being the end (right). All of that is marked in each stat:
It also works for any stats in the layout, including two-sided ones and those in the relationship section!
This user is not visible to guests.
Is there any way we can have the code in a way we're we can select parts? I'm unable to copy it all on phone due to it being so large so it cuts it off.
This user is not visible to guests.
Hello! Hope this is okay to ask here - I am unsure how to use the combat section (as in, how to change the values/size in the graphic), would you mind explaining it? It's quite alright if not!
Hi there!
First of all, you should see this section in the code: that's all of the stats listed clockwise starting from attack stat:
For example, you want to change the attack stat. You go to the list of the attack stat values compared to the edges of the circles they correspond:
Let's imagine that your character has an average/good attack so you want to choose the 4 circle. in that case you need to copy the 50% 16% value listed on the left!
And since you've (theoretically) chosen the attack stat you need to change the first value pair (50% 0% set by default) from the top. Here's how it'll look like:
And it's done! Then you need to repeat that with other stats as well!
Unfortunately the whole stats pie chart is done by clip-path poligon with paired % values. It's considered as one item so I can't divide it with any comments in-between! That's why I can't put more explanations inside the code to make it more comfortable :(
Hope this explanation helps! Feel free to tell me if you'll still have some questions or problems
I adore how lengthy this code is!! I'll have to use this for my Demon Slayer character if that's alright !!,,
I've used a lot of codes for many characters but I think this one is the most visually interesting and interactive one I've ever seen ;; I'm honestly shocked it's F2U! Amazing code, you should be very proud of it!!<3
edit: oops i just realised i pasted it into WYSIWYG mode X-X im dumb ignore that
anyway i used this code for my boy ko! its really pretty, ill probably be using it again!
wow! This is so fricken cool and awesome! Seriously!
First of all:
I LOVE the aesthetic, the simple, one color vibe on the darker gray (for me, I think I’m using cyan mode) with only some greyish pink to compliment it. Its so simple, original, and clever
Second of all:
The songs! Omg, I don’t think I’ve ever actually seen songs that you can actually click on and press. I am new to looking at all these codes, so it might’ve been shown before, but still. It must’ve taken some neat problem solving to do that.
Third of all:
going back to the colors, how the heck did you even plan this thing? the way it’s such a specific aesthetic, completely different from more typical codes, and the way it’s consistent yet original, every new div, following specific guidelines set by the code as a whole, yet still managing to each be unique. And the amount of icons! i mean, im still confused on how these coders get their hands on all these base icon jpegs, so here I am, confused on how they get their hands on any at all, and then you waltz in with tons of fresh, new ones.
Fourth of all:
I haven’t really looked into the code much, but seriously, it looks sooooo well organized. The amount of careful formatting, the fancy borders around each new section just is so incredibly helpful :)
Fifth of all:
I love the links on top! Howd you even get that, in general even, since that seems like the sorta thing like bold/italics where it’s useful for non-coders to pick up for blog formatting. Really adds order!
Seriously, great work. How did you even learn how to code? You and all the other TH coders seriously inspire me to learn coding, even if it’s only to understand the confusion that is code, even with all the helpful comments.
The only ‘complaint’ is that as someone that adores the organization of tabs, I dont really like how long the actual profile is and I’ll probably just edit the margins to have more space in between each new section. Though I get that the challenge you submitted it for is pretty much specifically on not using tabs.
All in all, hope you win this and it’s so cool how you let something that clearly took hours and hours of work be completely free :)
To start with: CAN I JUST THANK YOU???? The amount of time you have spent to leave such a detailed and complex feedback (ALL the feedback, my gosh), Im literally crying it means a lot really
The songs play button thing is actually a very well-hidden youtube embed and it's pretty popular on TH nowadays (at least from what I saw!). The icons thing is provided by Font Awesome, there's a TON of pre-made icons to use in different styles so I just have chosen the ones that fit the vibe haha
The top navbar is also seems like a common thing for me when it comes to large scrollable profiles (also a thing I've seen a couple of times in other coders' codes). The whole stuff is pretty easy to scroll through on mobile, but on PC? Not really, so it looks like it's comfortable to have such navigation on large screens. It also allows you to go back to one of the previous sections very fast, you know? I am a fan of rereading stuff sometimes so it looks useful for me, at least xd
It's funny that I actually love tabbed thingies too! I just like to see everything tidy and organized haha. But sometimes it is really funny to step aside of what you are usually doing (and in this case it means to try and make a large looong code without creating a mess out of it lmao). I also had some thoughts about bigger gaps between content parts but because of the layout structure (you know, there's a lot of stuff overlaping one another) it would probably end up not looking very well. Sooo yeah, decided to keep things as is!
I've actually adored coding as a whole from school times but only started learning HTML recently, +- from the end of the past year. I didn't really learn HTML in general but specifically for TH by itself. It was mostly a lot of reading, inspecting other layouts and a bunch of trial and error, of course. But when you memorize some basics for yourself (like how the elements interact one with another or what you need to keep in mind to make layouts mobile-friendly, etc) it starts to feel more easy and fun! It also has a lot to do not just with coding knowledge, but with your way of thinking, your perception of things, your creativity (if it can be said like that?) as you need to imagine what you want to create beforehand. I usually find it the hardest and the most important part. For this layout I've chosen some main shapes (square, circle and half-rounded rectange) and then just tried to compose something intuitively! I mainly used accent color here and there to highlight some things, but not too much, so it won't take plenty of space.
Again, thank you so much for your feedback!! Hope I was able to share a bit of my experience and answer some of your questions!
Tysm! And can’t believe what I thought was literal magic was a simple site, I’ll have to check it out!
and for TH, I’m assuming it’s different from even typical webpage coding? i actually take coding, but we only touched html/css briefly and didn’t go in depth. I remember once i was introduced to CSS, everything that could be put there, was put there, but here there’s no CSS at all, aside from website layout edits.
Why’s there no CSS? and does this mean coding on th is inherently different from coding your own website or is that just not true, since anyways, I feel that coding traditional webpages vs th stuff is already like learning a new language
As far as I know TH uses Bootstrap so the coding thing doesn't really differs from general HTML. It's just seems easier as you only need to work on the profile area and not on everything on the character page. There is CSS, but it is just available for premium users. Regular users can use inline-css only (basically everything inside style="content" tag).
23. || Moonshine's Comments