Gloomy❀'s profile picture

Published by

published
updated

Category: Web, HTML, Tech

Some Helpful Codes

You don't need to credit me for any of this, I've pieced it together from a lot of different tutorials all over the internet and tweaked 'em. I tend to forget things, so I'm taking notes, I guess. I'd also like to help spare anyone the time it takes searching everywhere for codes... x_X I know the feeling! Feel free to comment if you need help!

⚠️ Please remember, put everything you copy between the HTML <style>❤︎</style> tags or else it won't work! ⚠️



Interests:

When you see the ❤︎ in a code, change it to the number of the interest section you're trying to edit!

(1) = General
(2) = Music
(3) = Movies
(4) = Television
(5) = Books
(6) = Heroes


Want to hide an Interest section?

.table-section tr:nth-child(❤︎) {
    display: none;
}

Replace ❤︎ with whatever you're trying to hide.

Use ".table-section:not(:last-child) tr:nth-child(❤︎)" if that doesn't work!
This version isn't working on Firefox for some reason, though.



Want to rename an Interest title?

.table-section:nth-last-child(2) .details-table tr:nth-child(❤︎) td:first-child p::before {
    content: "text";
    font-size: .7rem;
}

.table-section:nth-last-child(2) .details-table tr:nth-child(❤︎) td:first-child p {
    font-size: 0;
}

Replace ❤︎ with what you want to change, and the text to anything.



Want to hide both Interests AND Links?

.table-section {
    display: none;
}

Just want to hide Links?

.table-section + .table-section {
    display: none;
}



Friends & Comments:

Want to hide both Friend Space AND Comments?

.friends {
    display: none;
}

Just want to hide Comments?

#comments {
    display: none;
}

Just want to hide your Friend Space?

.friends .inner, .friends .heading {
display: none;
}

#comments .inner, #comments .heading {
display: block;
}


Want to rename your Friend Space heading?

.friends .heading::before {
    content: "text";
    font-size: .8rem;
    font-weight: bold;
}

.friends .heading {
    font-size: 0;
}

Want to rename your Friends' Comments heading?

#comments .heading::before {
    content: "text";
    font-size: .8rem;
    font-weight: bold;
}

#comments .heading {
    font-size: 0;
}

Replace the text with whatever you want!



Blurbs:

Want to hide ALL of the Blurbs section?

.profile .blurbs {
    display: none !important;
}

Hide only your User's Blurbs heading:

.profile .blurbs .heading {
    display: none !important;
}

Hide About me AND Who I'd like to meet:

.section h4 {
    display: none;
}

Want to hide one of the Blurbs sections but not the other?

Hide About me

.profile .blurbs .section:first-child {
    display: none;
}

Hide Who I'd like to meet

.profile .blurbs .section:nth-child(2) {
    display: none;
}


Want to rename User's Blurbs?

.blurbs .heading::before {
    content: "text";
    font-size: .8rem;
    font-weight: bold;
}

.blurbs .heading {
    font-size: 0;
}


Want to rename Blurbs section titles?

Rename About me:

.blurbs .inner .section:first-of-type h4 {
    font-size: 0;
}

.blurbs .inner .section:first-of-type h4::after {
    content: "text";
    font-size: .8rem;
}

Rename Who I'd like to meet:

.blurbs .inner .section:last-of-type h4 {
    font-size: 0;
}

.blurbs .inner .section:last-of-type h4::after {
    content: "text";
    font-size: .8rem;
}

Replace the text with whatever you want!




Want to hide your Profile URL?

.url-info {
    display: none;
}

Want to change the Notification Bell?

nav .links li .icon {
    content: url(URL);
}

Replace URL with a link to the picture you want. Tiny ones work best. Some image sharing sites are not supported like Imgur, so links from there won't work.


Disclaimer: I'm not an expert! This is all self-taught.


51 Kudos

Comments

Displaying 8 of 8 comments ( View all | Add Comment )

lynus

lynus's profile picture

THANK U SM FOR THIS HOLY DOOKIE!!! a css beginner (me) is singing praises to you


Report Comment



yayyyyy I'm glad I could help ^_^

by Gloomy❀; ; Report

kamourau ૮ ྀིᴗ͈ . ᴗ͈ ა

kamourau ૮ ྀིᴗ͈ . ᴗ͈ ა's profile picture

ahh tyy!!! would you happen to know how to put the about me part in the center of a profile? something like this https://layouts.spacehey.com/layout?id=86381


Report Comment

aviotos

aviotos's profile picture

if your styling doesn't work, you have to check if it's a hierarchy issue, usually !important works but you also have lengthen your selectors most of the time. i don't understand why you're telling people to shorten things.


Report Comment



oh i genuinely just based all of this off of what i physically saw when i was using the codes and whatever i had to change, sorry if i was off!

by Gloomy❀; ; Report

also thanks for the tip :3

by Gloomy❀; ; Report

Black Market Stray Cat

Black Market Stray Cat's profile picture

would you at all happen to know how to change the picture for the notification bell icon? the code i was using stopped working randomly


Report Comment



nav .links li .icon {
content: url(https://files.catbox.moe/ykhs1u.gif);
}

this works for me!

by Gloomy❀; ; Report

artis.y2k1

artis.y2k1's profile picture

u rock!! super cool of u to post diz


Report Comment



thank uu i want everyone to have cool profiles xD

by Gloomy❀; ; Report

GOAT

GOAT's profile picture

very helpful all round, ty for sharing <33


Report Comment



yayayy thank you GOAT! I just got to say that name every time xD

by Gloomy❀; ; Report

WAUAU

WAUAU's profile picture

oh this is SO helpful tysm


Report Comment



yay thank you im happy it helps :))

by Gloomy❀; ; Report

enuf

enuf's profile picture

this is actually genius for css noobies


Report Comment



yay Im so glad! im editing it right now :3 I wanna make it as simple as possible for everyone including myself when i come back to it!

by Gloomy❀; ; Report