Design in redesign!

https://www.reddit.com/r/modguide/comments/d8nuyz/design_in_redesign/

created by SolariaHues on 24/09/2019 at 14:20 UTC*

5 upvotes, 2 top-level comments (showing 2)

Design in redesign!

Designing the look of subreddits in redesign is much easier than in old.reddit for most - you don't need to know any CSS.

CSS might be an option in the redesign at some point, it's already listed in the menu, though it's inactive for most - I think some subs are testing it.

To change the look of your sub in redesign you simply need to have a look through your mod tools (top right of sidebar), community appearance section, where there are several things you can change[1].

1: https://imgur.com/vom4xZ8

There's already a guide to all the redesign design settings here[2]. But here's my take...

2: https://mods.reddithelp.com/hc/en-us/articles/360008722771-Community-Appearance-overview

The base colour also shows in app on mobile.

**Since changes to redesign the icon always shows. You can change your subs display name but not remove it**

https://www.reddit.com/r/modnews/comments/ebyusv/updates%5C_to%5C_community%5C_page%5C_design%5C_on%5C_desktop/[3][4]

3: https://www.reddit.com/r/modnews/comments/ebyusv/updates%5C_to%5C_community%5C_page%5C_design%5C_on%5C_desktop/

4: https://www.reddit.com/r/modnews/comments/ebyusv/updates_to_community_page_design_on_desktop/

How to add an icon & edit the display of your subs name in redesign

Adding a banner

~~You can also set a sub menu color - this is a drop down with further links some subs have.~~

**Since changes to redesign these design options don't affect your main sub page, but only seen to show in open posts (if you refresh with a post open).** https://www.reddit.com/r/modnews/comments/ebyusv/updates%5C_to%5C_community%5C_page%5C_design%5C_on%5C_desktop/[5][6]

5: https://www.reddit.com/r/modnews/comments/ebyusv/updates%5C_to%5C_community%5C_page%5C_design%5C_on%5C_desktop/

6: https://www.reddit.com/r/modnews/comments/ebyusv/updates_to_community_page_design_on_desktop/

For the arrows you will need to have four - active up arrow, inactive up arrow, active down arrow and inactive down arrow - the arrows need to look different for active and inactive so users can tell when they have voted up or down e.g. typically inactive arrows are white or grey, active up is red, and active down is blue.

Preview placeholders are what you see when a post doesn't have an image associated with it. You can see some labeled here[7].

7: https://imgur.com/ZQzYvzA

Adding menu tabs (links)

Widgets are the different sections of your sidebar. If you look at our sidebar to the right, you can see it's split into sections - widgets - first there is the community details widget, then the 'about modguide' widget (text widget), the 'useful links' widget (button widget), and so on.

Community list widgets is where you can link other subreddits - those with similar themes, those you've traded links with etc. You can only list 10 per widget, but you can have several widgets - I tend to use this to split them into related groups.

You can add images in a image widget, text in a text widget (I usually add extra explanation of the sub here, perhaps give credits for banners etc), and I like to use the button widget for useful links - wiki links for example. You can add google calendar widgets, and there's experimental (at time of writing) CSS widgets (under add widget - advanced).

You can set colors for the whole sidebar, or individually change each widget's title background color, and background color - except the default widgets (community details, moderators, and chat rooms). Widgets can also be reordered.

You can see a few different designs if you look at r/bannerrequest, r/newhorizons, and here.

I usually sort out a banner first and everything else works off of that.

In redesign it's easy to select colors in the menu's but if you're looking to achieve a cohesive design, hexadecimal colour code websites are useful for finding colors codes and for picking colour palettes or different hues of colors.

Colour-hex.com[8] | w3schools colour picker[9] | colorhexa[10]

8: https://www.color-hex.com/color-palettes/

9: https://www.w3schools.com/colors/colors_picker.asp

10: https://www.colorhexa.com/

To find further help, try r/RedesignHelp and you can always use a private sub to test out a design before copying it over to your sub, though this can be a bit tedious.

To make your own graphics sizing for redesign is here[11], and r/Redditesque has many redesign style assets you can use.

11: https://www.reddit.com/r/redesign/comments/87uu45/usage_guidelines_for_images_in_the_redesign/

More:

How to change the name of your members and online users

I consider **flair** to be part of the design. Both post and user flair can be added in the mod tools sidebar, and **Emojis** can be added and used in flair, ~~but this post is getting long so I may do another on flair.~~

Creating flair in redesign[12] includes emojis and adding flair to the sidebar

12: https://www.reddit.com/r/modguide/comments/e0lx77/creating_flair_in_redesign/

Community Awards

Community awards are still quite new and are perhaps more of an engagement feature.

Comments

Comment by boocatbutterbee at 13/01/2025 at 00:56 UTC

1 upvotes, 1 direct replies

Profile banner instructions for pc?

Comment by iamdeirdre at 22/02/2024 at 23:36 UTC

1 upvotes, 0 direct replies

RIP Community awards and gold awards!