Troubleshooting

cheerikola

Info


Created
4 years, 25 days ago
Creator
cheeriko
Favorites
3

Profile


Troubleshooting



Go to your display settings and make sure the Code Editor is enabled, and WYSIWYG is disabled for profile text.

You can reenable it later but do not make edits to layouts while using WYSIWYG. It might completely mess up the layout and you'll have to start from scratch.

28070773_5CNi03TQ5r6I30X.png

Next, find the code you want and copy it. Then paste it into the first code editor on the page and save.

The area should look like this:

28070616_oFMHAvIYiEJ0KRu.png

Protip: If you'd like to keep the ability to CTRL + Z (Undo), press Shift and then Update Character. This opens a new window but saves the changes, so you can keep your current window open with all the changes (and you're safe to close out the new one).


You don't need to change your settings this time, it should default to a code editor. Usually places that take CSS will be labeled 'CSS'.

For your character profile, the area should look like this:

28070878_lnf154Z2l1ja5Kx.png

For your user profile, you'll need to head to the Profile CSS & Blurbs link in your settings.
The area should look like this:

28070880_NvhqtLkubMrC5xb.png

On Toyhou.se, HTML can be use by all users but CSS can only be used by premium members.

You can not input HTML and CSS into the same input boxes, they will not render and CSS will often break.


fSeL1sg.gif
  1. Highlight the color you'd like to change and press CTRL + F.
  2. A menu could pop up in the Code Editor with the color already in the search bar, then his the + sign below it.
  3. Another text entry bar should pop up below it, put the new hex code in and then select All. After that, all of the the selected color codes should be changed!

You're using the WYSIWYG editor - it adds extra classes and inline CSS to the code that junks it up.

The only way to fix this is to turn it off and copy/paste a clean version of the code into the code editor.


It's the default text editor, it looks like this:

28071077_SjXgz8p4yoWs11y.png

While it's good for quick replies, it's not good for coding. It likes to add it's own styles to your HTML, which will cause it to mess everything up as stated above.


All of the following need to go in the style="" tag of an element.

For example:

<div class="p-5 bg-primary" style="background-image: url(https://file.toyhou.se/images/12350763_gJqOcuUiIM9Xj5i.png)">
  Content Here
  </div>

These can can also be compounded like so:

<div class="p-5" style="background-color: #ffb788;background-image: url(https://file.toyhou.se/images/12350763_gJqOcuUiIM9Xj5i.png);background-size:300px;">
  Content Here
  </div>

Background Color

background-color:[item from list];

  • hex - like #212121
  • rgba - like rgba(000,000,000,0.5) ! this allows for semi-transparent colored bgs

Background Image

background-image: url(IMAGE URL HERE);


Background Position

background-position:[item from list];

  • Sort of self explanatory, just starts the image in one of these positions.
  • center
  • top
  • bottom
  • left
  • right

Background Size

background-size:[item from list];

  • cover - stretches and crops the image to make sure it covers entire screen
  • contain - resizes the image to make sure the image is fully visible
  • [#]px - sets the width to whatever you want it to be, length will auto adjust itself

Background Repeat

background-repeat:[item from list];

  • repeat - this is the default!
  • no-repeat - stops the BG from repeating
  • repeat-x - image is repeated only horizontally
  • repeat-y - image is repeated only vertically

Background Attachment

background-attachment:[item from list];

  • scroll - this is the default!
  • fixed - keeps the image stationary on the page

Shorthand

background:[color] [image] [position] [size] [repeat] [attachment];


Unfortunately, I don't have the time to help. I advise you ask for help in the forums.

Please do not message me on here or on DA unless something is broken on my end.