#cttw

This is less of a tutorial and more of a 'how does it work' and let me tell you - the bot does everything.

Just add this bot to your website and follow the directions here and you'll be able to use discord the way you used to use cbox. I recommend html-embed for the type and cluster 4 for the bot but honestly, do you and have fun with it. Test things, try new things.

I know there are a lot of people super unfamiliar with CSS that feel a little lost when they choose a premade skin that our lovely coders have so generously offered up and want something ~different~ from all the other sites that have used it, so this is a guide in making a few changes WHERE ALLOWED (please see the coders notes on this prior to making any types of edits, ty) so that you can have the same skin without having the same skin.

First and foremost take a look at Jcink's guide to css and skinning. This will tell you what certain parts of the css (style sheets) are called so that you can find them, see how they are coded, and make the changes you are allowed, such as color or font or font size, etc.

Next take a look at Color Hound. If you are wanting to change the colors of a skin, I SWEAR by this site. You enter the link to the site you have with the skin on and it will give you all the colors listed in the site's css. To be clear the reason this is more efficient than simply searching for 'color:' is because it also pulls rgb and rgba codes and shows you them as well. It's important to find these as well in case the color is set to a certain transparency so that you can add that in with your new colors as well.

On the line of colors, Colorhexa and Colourlovers are useful as well because colourlovers lets you find palettes to use for your skin, so you have a certain aesthetic in your chosen colors, and colorhexa lets you look up these colors to find the rgb of these colors as well, allowing you to edit the rgba and have that transparency needed in certain skins as mentioned above. I would suggest keeping the transparency already set but if you wanna toy with it and are allowed, be my guest. As a side note: the transparency is the a, the last of the four numbers listed. For example - rgba(#,#,#,0.3) it would be the 0.3.

Now custom fonts are cool too so maybe you want to edit those. There are a billion sites for custom fonts and the easiest to deal with is google fonts but try others too. If you download a font, you can upload it to your site and add it to your skin. First you have to access the admin cp and then navigate to the file manager, in jfh resources. The file manager allows you to upload documents to your board, such as images or css or in this case custom fonts. Start out by uploading a new file at the bottom of the page, finding the truetype (.ttf) font file that you downloaded, and uploading it to the Jcink file manager. Jcink will give your new font a direct link beneath the contents heading in the file manager. Grab that link! In your stylesheets you'll probably see something like @font-face and that's what we're going to create with your new custom font, probably near to the others.

@font-face { font-family: FONT NAME; src: url(URL); }

Change the font name to whatever you want to name your font, usually the font's actual name but you can pretty much go with whatever. The url is the link you grabbed in the previous step. Once this is in your stylesheets, just grab the font name you used and edit where you want this font to show up by editing the following code:

font-family: FONT NAME;

Just please remember to remove the previous font name. With a new font you'll probably have to mess with the font size and weight but this can help a lot with making a font look different that is maybe used a lot on other sites.

Another tip would be to focus on images. You can edit images everywhere, not just the header, and these help a lot to editing a skin so try that if you're still feeling a little less than personalized on the skin you're working with.