Published by angel!! ☆彡

published 1689476441
updated 1689521092

View Blog View Profile Report Blog Entry

angel's guide to spacehey ⊹˚. ♡ part 1.5: profile extras

hello again, friends!! after a few suggestions (and lots of thinking ), i have decided to make a follow-up post to the first installment of "angel's guide to spacehey"! thank you so very much to @brighterbysunrise for your feedback on the first installment, as well as your recommendation! without further ado, let's get into the extras of decorating your profile!!

the first thing we'll be touching on is how to customize your contacting section! like the other processes i've walked through, this is a fairly easy thing to do. first, get to a portion of your "about me" section where you can add a break (<br>) and create a new paragraph for the code. once you've done that, copy and paste the following code:

<style>

.contact .inner a img {

font-size: 0;

}

.contact .inner a img:before {

font-size: 1em;

display: block

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {

/* Add to Friends */

content: url("yoururlhere")

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {

/* Add to Favorites */

content: url("yoururlhere")

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {

/* Send Message */

content: url("yoururlhere")

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {

/* Forward to Friend */

content: url("yoururlhere")

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {

/* Instant Message */

content: url("yoururlhere")

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {

/* Block User */

content: url("yoururlhere")

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {

/* Add to Group */

content: url("yoururlhere")

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {

/* Report Profile */

content: url("yoururlhere")

}

</style>

replace the 'yoururlhere' with the url codes of the images you want to use. be sure to save your changes and make sure that this worked as it should! if everything goes smoothly, congratulations!!

if you're like me and you've been seeing profiles with images/gifs that act as a sort of loading screen and want to have that on your profile as well, have no fear!! the process is also super duper easy!

you'll want to find an open space on your about me section (or anywhere else, like your "who i'd like to meet" section) where you can add a <br> command and create a new space for the code. copy and paste the following code to this area:

<style>

body:before {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed;

top: 0;

left: 0;

z-index: 100;

background-image: url('imageurlhere');

background-size: cover;

background-repeat: no-repeat;

background-position:center;

animation: yourAnimation 1s ease 1s 1 normal forwards;

pointer-events: none;}

@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }

</style>

as always, replace the imageurlhere with the url of your image of choice! save all of your changes, and tadaaa!! it should be working smoothly!

there you have it, friends! that's all i can think of for right now regarding profile decoration. i hope these tutorials are useful to you, and i can't wait to see how absolutely amazing your profiles are once they've been personalized and dazzled up!!~ bye bye for now!

-lots of love, angel

6 Kudos

Comments

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

Cas	1690460198 The pop up gif doesn’t work it wont show up Report Comment ahhh, thank you for letting me know! i'll try and figure out the problem as soon as i can!! by angel!! ☆彡; 1690476212; Report