Customizable Clickable GIF/PNG With Link!

2 weeks ago — by ★ 𝐫𝐱𝐦𝐞𝐨 ★ — Misc — used 29 times

This code puts a customizable clickable GIF/PNG in the bottom right corner of your page. You can resize, move it, and change its link! Paste this at the bottom (or top) of your CSS page.

CSS Code

Copy this and paste it at the bottom of the Advanced CSS tab in your layout editor, then save.

<!-- Original Layout base by ★ 𝐫𝐱𝐦𝐞𝐨 ★ -->
<!-- https://friendrewind.com/layouts/element.php?id=47 -->
<div style="
  /* === CUSTOMIZE YOUR LABELS HERE === */
  --image-width: 250px;       
  --image-height: auto;
  --position-right: 40px;    
  --position-bottom: 50px;   
  --layer-depth: 200;
  --float-direction: none; 
  
  /* === DO NOT CHANGE BELOW THIS LINE === */
  float: var(--float-direction); 
  max-width: var(--image-width); 
  height: var(--image-height); 
  position: fixed; 
  right: var(--position-right); 
  bottom: var(--position-bottom); 
  z-index: var(--layer-depth);
">
  <!-- CUSTOMIZE YOUR ICON AND LINKS BELOW -->
  <a href="https://alturl.com/p749b">
    <img src="https://64.media.tumblr.com/e667fbc8ccef1ffb563070882da3eee0/bbe8e1f309c97b20-bc/s500x750/13255c563da73ee0d10d461dc4edc1d85fad26b4.gifv" alt="NAME"/>
  </a>
</div>

How to use: copy the code above → open your layout editor → paste it at the bottom of the Advanced CSS tab → save → refresh your profile. Elements stack — you can combine as many as you like. New to CSS? Read the Custom Code Tutorial.

More in Misc

« Back to Misc | « All Profile Elements