code installation / edit FAQ

tranzcowboy

Info


Created
11 months, 5 days ago
Creator
tranzcowboy
Favorites
502

Profile


if you think anything needs to be added to this guide, let me know!

CODE INSTALLATION / EDITING FAQ


HOW DO I INSTALL?

  1. make sure WYSIWYG is off
  2. in the toyhouse sidebar, go to manage character and click on Edit Profile
  3. copy and paste the code into the code editor
  4. update character

HOW DO I CHANGE IMAGES?

  1. upload the image you want to use to an image hosting site (or to discord, i use a personal server only i'm in and upload images i want to use on toyhouse there)
  2. once uploaded, right click the image and select "copy image address" or "copy image location" (the button varies with browser / operating system, but you should be able to tell which to click). for discord, right click the image and click "copy link".
  3. replace the url of the image that's already there with the url you just copied.
  4. make sure the parentheses stay intact

HOW DO I EDIT IMAGES?

with all of my codes (with very few exceptions) i use cards to insert images, and you can adjust how the image appears inside the card.

CHANGE IMAGE POSITIONING

change the 'center' in "background-position: center;" to any of the following:

  • left top
  • left center
  • left bottom
  • right top
  • right center
  • right bottom
  • center top
  • center bottom
CHANGE IMAGE SIZE

to make the entire image fit within the card, follow the gif below

BEFORE

AFTER

CHANGE BACKGROUND SIZE

to change the size of a repeating background, change the 'background-size: contain' (or whatever it is in the code you're using) to 'background-size: #px;' replacing # with the size you want.

HOW DO I CHANGE THE LITTLE SYMBOLS?

the little symbols in codes are fontawesome icons. usually they're written like this: <i class="fas fa-(ICON)></i>

to change the symbol, replace (ICON) with the name of the icon you want to use. all of the available icons can be found here (yes, you can use the premium icons)

icons come in 4 different forms, all of which vary slightly in their code, as follows:

solid:
<i class="fas fa-(icon)"></i>

duotone:
<i class="fad fa-(icon)"></i>

regular:
<i class="far fa-(icon)"></i>

light:
<i class="fal fa-(icon)"></i>


HOW DO I CHANGE TEXT COLOR?

you can change text to match the toyhouse themes, or use custom colors

USING BOOTSTRAP COLORS

there will be a part of the code that says text-(color), replacing (color) with the bootstrap color used. to change it, replace the color already there with one of the ones below:

text-primary

text-info

text-success

text-warning

text-danger

text-muted

USING CUSTOM COLORS

if a code doesn't already have custom colors, you'll most likely have to add the style yourself. to do so, follow the gif below:

ezgif-3-cf8629b646c5.gif

to use a custom color, you'll need a hex code. i use this website. once you have the color you want, copy the hex code and replace #000000 with it.

you'll also want to make sure the div / element you're working in doesn't have a text color class attached. so if there's a text-primary (or any other bootstrap color), make sure to get rid of it.