How To Change Contacting Icons To Gifs And Pictures

You Can Change What Is Inbetween The Quotations For Whatever Image You Want.

<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('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* Add to Favorites */
content: url('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* Send Message */
content: url('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* Forward to Friend */
content: url('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* Instant Message */
content: url('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* Block User */
content: url('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* Add to Group */
content: url('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* Report Profile */
content: url('https://i1.glitter-graphics.org/pub/1052/1052591sg4ydztanh.gif')
}
</style>


41 Kudos

Comments

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

Reuben

Reuben's profile picture

Is there a way I can use pictures with lots of pixels but then size it down to 20x20 in the code?


Report Comment

Ducky~☆

Ducky~☆'s profile picture

does anyone know why the default icons are still showing on my layout in addition to the custom ones?


Report Comment



i'm having the same problem :(

by 𝔞𝔫𝔤𝔢𝔩; ; Report

Did you figure out a resolution for this? I noticed your page doesn't have the default showing anymore, and I'm having the same issue.

by 🐻 WinterBear⚘Vante; ; Report

did u set the display to none? that should work and u can add the other graphics right after that.

by Fritoleg; ; Report

Rayy Radium

Rayy Radium's profile picture

Worked!! Tysm <3


Report Comment

★Elsie★

★Elsie★'s profile picture

OMG thank you this was so helpful!! <3


Report Comment

Twilight Lover #1

Twilight Lover #1's profile picture

How do I resize the gif?


Report Comment



did u figure out how?

by ciderpies; ; Report

i couldnt figure this one out myself, but u can resize it on ur own (there r websites 4 that) or, what i did, i used this site >glitter-graphics.com
they have a mini section in gifs, which usually fit the contacts.

by Fritoleg; ; Report

soupghosts

soupghosts's profile picture

omg thank you! so helpfullllllklvkmfdvjii


Report Comment

fl0wergutz ᶻ 𝘇 𐰁

fl0wergutz ᶻ 𝘇 𐰁's profile picture

it doesn't work to me (╥﹏╥)


Report Comment

SL1M

SL1M's profile picture

still helping people 3 months later 🙌 thank you!


Report Comment