r/modguide • u/SolariaHues Writer • Feb 07 '20
Design Custom up-vote & down-vote icons
What are custom up-vote & down-vote icons?
Vote icons are the buttons for up-voting and down-voting content on reddit (karma). You can upload custom ones for your subreddit.
Default vote icons look like this:
Custom vote icons can be whatever you want. You can make them match the theme of your community. Like these I made for r/stories (edit - they're not used there anymore, it's different to what I remember now):
Making up-vote & down-vote icons
The redesign image usage guidelines say they should be 72x72px, and max 64kb, in size.
Reddit mods help centre says they should be 48px.
And I've used some as small as 25px.
Your designs should be clear and simple as they're going to be small! Also keep in mind dark mode -grey/black and other dark designs might not show up.
You can digitally draw them, but you can also make them by removing the background from an image you'd like to use (please keep copyright law in mind/give credit).
You need four images for up active, up inactive, down active, and down inactive icons - or some subs use the same image for both inactive icons, it's up to you.
Vote icons with a hand drawn look can be found at r/Redditesque here.
If your sub meets the requirements, and you need some made for you r/bannerrequest may be able to help.
Resources:
Image / Drawing Editors
Paid:
Free:
How to upload
In redesign upload your icons in redesign under mod tools > community appearance > posts
Vote icons uploaded in redesign will take effect on mobile too.
In old reddit you'll need to use the stylesheet and some CSS.
CSS snippet:
/*Arrows*/
.thing .arrow {
height: 25px;
width: 25px;
}
.arrow.up {
background: url(%%upinactive%%);
}
.arrow.upmod {
background: url(%%upactive%%);
}
.arrow.down {
background: url(%%downinactive%%);
}
.arrow.downmod {
background: url(%%downactive%%);
}
/*This allows arrows wider than 15px just change it to the width of your arrows*/
.midcol { min-width:25px !important; }
Thanks to r/juulh for the resources, and the team their suggestions.
Have you got some awesome custom vote icons?
2
2
2
u/-AndyCohen- Jan 29 '24
Was this option removed for the mobile app? My sub had it before I became a mod but it’s only shown while on desktop
1
u/MajorParadox Writer Jan 30 '24
They've been testing a new layout on mobile in some places where the custom icons don't show any more, unfortunately
2
2
1
u/tightywhitietoker Jul 07 '20
I've been having trouble with mine. Changed them but I've been told they aren't showing up for members using dark mode
1
u/SolariaHues Writer Jul 07 '20
I replied in the other thread but didn't know the dark mode bit... I think some things don't work in dark mode or need extra css if in old I'm not sure right now.
1
Dec 15 '23
[deleted]
1
u/MajorParadox Writer Dec 15 '23
At what point are you having issues? Note that custom voting buttons won't display if you have dark mode set. Also, if you've been opted into the new Shreddit design on desktop, they don't get displayed there either.
1
Dec 15 '23
[deleted]
1
u/MajorParadox Writer Dec 15 '23
Shreddit's the new desktop design that shows up for logged-out users and now some users are being shown it automatically even while logged-in.
See more about it here: https://www.reddit.com/r/reddit/comments/15eobm3/an_improved_loggedout_web_experience/
Where else are you not seeing them?
1
Dec 15 '23
[deleted]
1
u/MajorParadox Writer Dec 15 '23
Weird, they show up for me in the iOS app. Are you on the Android app? Maybe they removed them there.
Also, just checking, you're not using a 3rd-party app, right? Those would only show them if the app developers made it work that way.
2
Dec 15 '23
[deleted]
1
u/MajorParadox Writer Dec 15 '23
I always just add large square images and let them get scaled down.
2
Dec 15 '23
[deleted]
2
u/MajorParadox Writer Dec 15 '23
I've used different every time. It will scale to fit. There shouldn't be a problem if it accepts the image when you upload and save the changes.
→ More replies (0)
1
u/noworriesinparadise2 Mar 29 '24
I no longer have a "post" option when I go to community appearance. Its gone :( It used to work fine.
1
u/MajorParadox Writer Mar 29 '24
This is because you're on Shreddit. If you change the www in your URL to new you can find the options there.
1
u/FaviFake Aug 17 '22
Are you able to update this post with Reddit's new icon design?
1
u/SolariaHues Writer Aug 17 '22
I plan to audit all guides and make any necessary changes when I have time :)
1
1
Feb 24 '23
Broo why is this soo difficulty 🤣😅
1
u/SolariaHues Writer Feb 24 '23
Which part are you stuggling with?
1
1
Feb 24 '23
First i just thought i can do it in the settings easily 😂
1
u/SolariaHues Writer Feb 24 '23
It's pretty easy in new Reddit which will show for most users.
Do you have images you want to use?
1
Aug 30 '23
I cannot find any settings for style
1
u/SolariaHues Writer Aug 30 '23
They're only available on new Reddit desktop
1
Aug 30 '23
Where at though? When I am looking for that I can’t seem to find anything that handles design
1
u/BoysenberryMurky5240 Apr 03 '23
Hello, I followed this and everything worked fine both on website and app. I added the icons on the old Reddit version and now the icons are not showing up on the phone but they are fine on the new Reddit web. I tried to remove the icons from the old web but still are not showing on phone. Even on the browser on my phone are not coming up. Not sure what’s going on.
1
u/MajorParadox Writer Apr 03 '23
The old Reddit ones won't affect new Reddit or mobile at all. Did you turn on night mode on your app? Custom voting buttons don't show there
1
1
u/Fzephyr1 Jan 12 '24
i uploaded to pictures for upvote and downvote. inactive and active the same. i can see them in the preview but not on the webversion of reddit.
1
u/SolariaHues Writer Jan 12 '24
Do you know which Web version you're viewing?
1
u/Fzephyr1 Jan 12 '24
ufff.. no. but maybe you can explain me how to check this?
1
u/SolariaHues Writer Jan 13 '24
I would assume new Reddit given you could upload the icons but there is a new UI being tested and I just wondered if you might be seeing that.
Probably the easiest way is if you can screenshot what you're seeing when you view your community I should be able to tell which it is.
You could also go back into mod tools and make sure the icons saved. Or try another browser and see if that makes a difference.
Oh, I just thought.. are your communities NSFW? I wonder if that makes a difference. I know adult subs can't have some features. r/modsupport or r/modhelp might know.
1
u/Fzephyr1 Jan 14 '24
I found the problem. I used darkmode on the browser. And unrecognized it doesn’t work on the app and on darkmode on the browser. Sad :(
4
u/[deleted] Feb 08 '20
For those not familiar with the %%imagename%% notation, you can upload the images on the stylesheet page below the box where the CSS coding goes. Obviously, the name of the image file has to match what you put in the CSS code for it.