Forum:
Is there a way to change that and if so how?Β
« Web, HTML, Tech Forum
Custom online/offline icon?
Report Topic
8 Replies
Reply by Arron J. Hunt
posted
updated
Should be pretty easy to do.
<style>
/* Hides the default image */
.online img,
.offline img {
Β display: none;
}
.online::before {
Β content: "π€";
}
.offline::before {
Β content: "π€";
}
</style>
or for images:
<style>
.online::before {
Β content: "";
Β display: block;
Β width: 24px;
Β height: 24px;
Β background-image: url("path-to-image.png");
Β background-size: 24px 24px;
}
</style>
Reply by Frankkie
posted
updated
I don't think she ever saw this reply above since there were no notifications for forum replies 20 days ago lol.Β Hopefully she sees it now.
Reply by Rosy
posted
Reply by rubab
posted
Here at
Distinguished, you can scan our site to explore theΒ top custom web design companiesΒ Β that can
deliver professional services which can help your brand in maximizing its
performance and customer engagement. We conduct extensive research and utilize
credible sources to ensure our selection of top companies is legit and the best
for clients.
Reply by PastelMermaid
posted
Reply by haihai
posted
<style>
.online{Β
/*hides the text*/
visibility: hidden;Β
}Β
.online img {
/*changes the content of the image*/
content: url("your image here :>");Β
animation-name: none;Β
/*makes sure you can see it :)*/
visibility: visible;Β
/*set the width and height to the dimensions that you want
if you want it to stay to scale, just get rid of either the width
or the height and it will scale it proportionally*/
height: 25px;Β
width: 80px;Β
}
</style>
Reply by cj hayward
posted
Reply by πΎπππ β°
posted
none of these codes in the replies actually help with the offline message/icon.
Yes, we've changed the online icon, but how do we successfully change the offline/last active icon/message?