I recently saw a forum post where people were having issues with the customizing of their profiles, and CSS can be really confusing for people that don't do it a lot, have never done it, or are on itty bitty phone screens. So I posted this as a response and thought that it might help others as well. I hope that it does!
๑۞๑ø¤º°`°๑۩ HOW TO CHANGE THE MAIN BACKGROUND OF YOUR PROFILE ۩๑°`°º¤ø๑۞
Okay, I tried to simplify how to change your main background here. If this doesn't work for you, please copy the code that you used and show me and I will try to help you fix it, or I'm sure that another helpful person will try to help as well. We all deserve nice profiles don't we?
I'm going to use my profile background as an example so you can see how it's supposed to look.
Go to the site that Katie suggested: https://nein-mc.neocities.org/csstest/index.html
Now choose a code snippet to copy:
IF YOU WANT A PICTURE AS A BACKGROUND
<style>body { background-image: url("https://media.giphy.com/media/FlodpfQUBSp20/giphy.gif") !important; background-color: black !important; background-attachment: fixed !important; margin: 0; padding: 0;}</style>
(Make sure that you are copying the "style" tags as well or it won't work!)
IF YOU WANT A COLOR AS A BACKGROUND
<style>body { background-color: black !important;}</style>
Now, in the top white box, where it says, "Put anything (HTML, CSS) in the textarea below and it will get put into the about section", paste the code that you copied.
If you chose the picture as a background code and you see the sparkly star background that's the same one as the one on my profile then yay! Now you can change it to the image that you want as your background. All you have to do is copy the URL or address of the picture that you want as your main background and replace this part: https://media.giphy.com/media/FlodpfQUBSp20/giphy.gif with it. Make sure that there are quotation marks on either end of the URL. If the picture that you chose shows up as the background on the test page, you did it! Now copy the entire code, style tags and all, and then go to your SpaceHey profile.
Click on where it says, "Edit Your Profile". In the box labeled, "About Me", paste your code. Then save it. If all goes according to plan, you now have a picture background!
If you chose a color as a background code and you see a black background on the test page then yay! Now you can change it to the color that you want as your background. Now the main colors are easy, you can just name them and bam! There they are, but there are so many variations of colors out there, and everyone likes a particular one. So I will direct you to a page with Hex numbers. These are usually a # sign and some letters and numbers. So here is a HTMLColor Code page where you can pick any color that you fancy. When you find one that you like, copy it'sHex code, for example: #9D12E2 (which is a random purple that I selected from the color picker at the top of the page) and then you are going to replace the word, "black" in the code with that number so that it looks like this: background-color: #9D12E2 !important;
(but with the number you chose instead) If the background changed to the color that you picked on the test page then you did it! (If not, make sure that you added the # symbol in front of the Hex code.) Now copy the entire code, style tags and all, and then go to your SpaceHey profile. Click on where it says, "Edit Your Profile". In the box labeled, "About Me", paste your code. Then save it. If all goes according to plan, you now have a colored background!
Now remember, this ONLY applies to the MAIN background. You will still have the white box in the middle, so don't freak out. I hope that this helps solve some of the frustrations some are you are having.
And if your code is NOT working, copy it and let someone know that you think can help you, either myself or Miss Katie or post it on your blog and ask your friends for help. I have found that it's usually the simplest things that trip up code.
Good luck!!
~SDesires
Update 01/17/21: adding images to show where to add your code for your profile.
Go to your Profile like so:
Click on where it says, "Edit Your Profile". (on the right hand side).
That should bring you to this page:
That white box that you see all the writing in it is where you would add your code for your profile. Make sure to hit the "Save All" button at the top when you are done or else you have to do it over again!
I hope that this helps those that are confused :)
Comments
Displaying 20 of 23 comments ( View all | Add Comment )
⋆౨ৎ˚✩˖࣪ ywri
THANK YOU SOO MUCH
I was trying to add a background for hours and you saved me
Thank you >w<
Report Comment
Sayio24 (Krish)
thx m8 :>
Report Comment
Saige
THANK YOU SO MUCH!!!
Report Comment
Lélé
OMGG THANK YOU SO MUCH
Report Comment
UrPalBug
THANK YOUUUUU
Report Comment
♡⋆。lix ༘
THANK YOU.
Report Comment
𝕵inx 𖣂 (hate itself)
omg i love you
Report Comment
leo
using
Report Comment
Nefi
OH EM JEEEE TYYY
Report Comment
Nefi
OH EM JEEEE TYYY
Report Comment
BlanchinBro
THANK YOU!!!!
Report Comment
Alice
I WAS FOLLOWING A TUTORIAL ON YT AND IT WENT HORRIBLE AND TOOK 1 HOUR OF MY LIFE THANK YOU SO MUCH
Report Comment
Engla
LIFE SAVER!
Report Comment
internet cowpoke
oh my god it worked thank you so much!! i hope you're living a good life and are safe
Report Comment
Aurèle
howo do I change the main box ? like the one that's normally white, and at the center ?
Report Comment
Homwo
what need to do?
Report Comment
Mainu
TYSM!!!!!!
Report Comment
Mainu
TYSM!!!!!!
Report Comment
𓆟
It doesn't work for me help :(
Report Comment
catfart96
what abt the front profiel?? like the white box
Report Comment
out of topic BUT OMG I LOVE UR PROFILE, the stars are so cool
by Schevv72; ; Report
EEEKKK!!! sankyuu!!! >3<
by catfart96; ; Report
YWWWW!!
by Schevv72; ; Report