Boogley's profile picture

Layout published by Boogley

published
updated

Add to Favorites

View Layouts

View Profile

Report Layout

How to add an image to the corner of your profile

Tags: template

Description:

Just add you image URL and you're ready to go. It's currently positioned for the bottom right of the screen. To change that you must change the amounts in: right, bottom, height, etc.

Also no need to comment on using or whatever cx if you have issues or confusion lmk though.

EDIT: I've had a few people ask how to use this code template for more than one image so I will try my best to explain c:
In the code the word "image" shows up three times. You need to change that to a different word for each entree.
For example in my personal profile code I am using this code for two different images/gifs one I put Mushroom, the other Mushy.



<style>
/* corner image. hidden on mobile */
.image {
    background: url('URL') no-repeat;
    background-size: 100%!important;
    position: fixed;
    right: 0px;
    bottom: 0px;
    height: 320px;
    width: 300px;
    z-index: 1000;
    opacity: 1;
}
@media (max-width: 600px) {
.image{display:none;}
}
</style>
<div class="image"></div>

<style>
/* corner image. hidden on mobile */
.mushroom{
    background: url('URL') no-repeat;
    background-size: 100%!important;
    position: fixed;
    right: 0px;
    bottom: 0px;
    height: 320px;
    width: 300px;
    z-index: 1000;
    opacity: 1;
}
@media (max-width: 600px) {
.mushroom{display:none;}
}
</style>
<div class="mushroom"></div>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.


Comments

Displaying 20 of 96 comments ( View all | Add Comment )

deadgirl369

deadgirl369's profile picture

this was s0 h3lpful th4nk uuu :3


Report Comment

Cindy <3 ☾☼✫

Cindy <3 ☾☼✫'s profile picture

using, tyy <3


Report Comment

☆ BLOOD !!

☆ BLOOD !! 's profile picture

Using!!


Report Comment

Rat Council :3

Rat Council :3's profile picture

using :)


Report Comment

caup✮p

caup✮p's profile picture

ty


Report Comment

vichy

vichy's profile picture

using, ty!


Report Comment

FamGam08

FamGam08's profile picture

usingg!!


Report Comment

shitovikk

shitovikk's profile picture

using!!thanks!!


Report Comment

meatbuuuuuns

meatbuuuuuns's profile picture

thank you!!! using :D


Report Comment

Sparktron

Sparktron's profile picture

Awesome layout, def using!!


Report Comment

rayy O_x

rayy O_x's profile picture

using!!! is there a way to add a link to it tho? a href doesnt work with backgrounds so idk how to do it ://


Report Comment



nvm i figured it out!!

by rayy O_x; ; Report

Macy

Macy's profile picture

Using this!!


Report Comment

Ellie

Ellie's profile picture

thank you so much, the code worked wonderfully! is there a way to get the image further down so that it's closer to the bottom?


Report Comment

tox 彡☆

tox 彡☆'s profile picture

using this rn :P


Report Comment

MEL!

MEL!'s profile picture

YES IT WORKED THANK YOU :D


Report Comment

WolfCat !!

WolfCat !!'s profile picture

USING I LOVE THIS SO MUCH!! also idk if thisll help anyone but the numbers i used to get my gif in the top left were 1165 for the right value and 700 for the height value, i didnt touch the other numbers. hope this benefits someone! :)


Report Comment

tastemybuttercream

tastemybuttercream's profile picture

im wondering if theres a way to keep them stuck idk how to explain this, like for example the bunny and strawberries picture on my profile how can i get it stuck where it is right when you open the profile?


Report Comment



im looking for the same thing! right now i had to manually position the image i wanted to the corner when you open the site but i wish it was fixed where it is just above the taskbar whenever you scroll. atp im not sure if its an issue where its broken due to other codes or an issue with the code itself:(

by ⦻ toby // sunny ⦻; ; Report

ill save this so i can tell you if i find a way!!

by tastemybuttercream; ; Report

xxshimmerxx

xxshimmerxx's profile picture

i cant really find the answer im looking for so im wondering if youd be able to help me understand/send a website that would show me what im looking for. i want to use the code, but change the position of the image to the top right corner, and im not sure what the properties for that would be. i was wondering if theres a website that shows what i should put for the pixel numbers, z-index, etc. it would be super helpful if theres even a picture showing the different properties for each corner of the website!!


Report Comment



i'm unaware of the thing that you're exactly looking for but i know a site that can help you visualise the stuff so you can manually fiddle around

https://nein-mc.neocities.org/csstest/

hopefully it helps you in what you're looking for :3

by c0ded; ; Report

S0bß!ng m3§$

S0bß!ng m3§$'s profile picture

Using!1!!!!!111!! Ths was soooo helpful, ty!! >L<


Report Comment

Purple_LOL

Purple_LOL's profile picture

I GOT IT TO WORK RAAHHHHH


Report Comment



heyy can i see how ur code looks like because it never seem to work on my part...

by AKTIFEAST [Alex]; ; Report

It won't let me comment the code I used, I'll send it to you through messages if ur cool with friending me, if not lmk if there's another way to send the code

by Purple_LOL; ; Report