junipers's super awesome profile customization tutorial part 1 (the basics)

hi !! I'm assuming that if you're here you want to make your own profile style. personally I think that having your own style is awesome because you get to represent yourself a lot (!!) more than if you use somebody else's. unfortunately (or fortunately, if you are really into the myspace spirit) there's a bit of a higher barrier of entry than any other social media. so!! I'm here to tell you all how to get yourself going!

HTML and CSS

understanding HTML and CSS is important if you want to do literally anything with your profile. HTML is used to tell a browser what is in a web page, and CSS tells it how to display it! You may not think of it as one, but your profile page is actually a webpage of itself, and spacehey allows you to create HTML elements and modify them with custom CSS! You can do this by incorporating a style element into any of your bios (I like putting it in the "who I'd like to meet" section.

now, you may be able to create a style element, but how are you supposed to do anything with it? you'll want to have some form of knowledge regarding HTML and CSS, so that you know what you are targeting and what you want to change. I recommend looking at the Mozilla Guide or the Mozilla Docs for information on specific things, but to help understand I'll guide you through an example of changing the font of your profile :3 I suggest you experiment yourself and look at the documentation so you can customize it how you want!!!

firstly, you're going to want to be familiar with the developer console. the developer console varies by browser to browser, so I won't go into the specifics, and I suggest you find a short guide about how to use it. we really only need it to be able to capture elements. I am using firefox, so I will show examples with the firefox developer console.

for this example, we will want to change elements of the entire website, so we won't need the developer console that much (but it's important!! it tells you what the classes are and how to target the elements when you want to change specific things,,, I'll talk about that later). Firstly, you'll want to find a font on google fonts to use (if you have your own host you can upload a ttf file but that's out of the scope of a basic guide). I personally like Fira Mono, so I'll be using that. you can see after the /specimen/ part of the google fonts url (https://fonts.google.com/specimen/Fira+Mono). Everything after that (and before the first ?) is the name of your font. Also keep note of the weight that you like the most. You'll need to turn this into an API url, which is the format of https://fonts.googleapis.com/css2?family=:wght@&display=swap. Congrats! You got the font name. you'll now want to paste this into your profile somewhere: in a future tutorial I'll go more in-depth on the syntax of css and html: