Notifications
Clear all

[Solved] Alternating post background colors

6 Posts
2 Users
4 Reactions
462 Views
Posts: 17
Topic starter
(@jw0068)
Eminent Member
Joined: 10 months ago

Hi, I'd like to provide some contrast between posts within a thread. I am using the extended layout, and every post within a thread currently has a white background. Is it possible to make it so that the background color of every other post is a different color to provide a bit of contrast?

 

TIA!

5 Replies
Tutrix
Posts: 1496
(@tutrix)
Noble Member
Joined: 5 years ago

Hi @jw0068 

you can format this with CSS
for example

#wpforo #wpforo-wrap .wpfl-1 .post-wrap.wpfp-first .wpforo-post,
#wpforo #wpforo-wrap .wpfl-1 .post-wrap:nth-of-type(2n) .wpforo-post{background: #f5f5f5 !important;}
#wpforo #wpforo-wrap .wpfl-1 .post-wrap.wpfp-first .wpforo-post .wpf-left,
#wpforo #wpforo-wrap .wpfl-1 .post-wrap:nth-of-type(2n) .wpforo-post .wpf-left{background: #ffffff !important;}

add it to custom css
Dashboard > wpForo > Settings > Colors & Styles > Custom CSS

1 Reply
(@jw0068)
Joined: 10 months ago

Eminent Member
Posts: 17

@tutrix this worked perfectly. Thank you so much!!

Posts: 17
Topic starter
(@jw0068)
Eminent Member
Joined: 10 months ago

I tried myself, but couldn't figure it out...is there a way to tweak the CSS so that the left area (profile info) for each post matches the background of the post? 

The code you provided has it so that white background posts have gray sidebars, and vice versa. Can it be so that they match? Gray with a gray post, white with a white?

 

Thanks again!

2 Replies
Tutrix
(@tutrix)
Joined: 5 years ago

Noble Member
Posts: 1496

@jw0068 

#wpforo #wpforo-wrap .wpfl-1 .post-wrap.wpfp-first .wpforo-post .wpf-left,
#wpforo #wpforo-wrap .wpfl-1 .post-wrap .wpforo-post .wpf-left{background: #ffffff !important;}
#wpforo #wpforo-wrap .wpfl-1 .post-wrap.wpfp-first .wpforo-post,
#wpforo #wpforo-wrap .wpfl-1 .post-wrap:nth-of-type(2n) .wpforo-post{background: #f5f5f5 !important;}
#wpforo #wpforo-wrap .wpfl-1 .post-wrap.wpfp-first .wpforo-post .wpf-left,
#wpforo #wpforo-wrap .wpfl-1 .post-wrap:nth-of-type(2n) .wpforo-post .wpf-left{background: #f5f5f5 !important;}
(@jw0068)
Joined: 10 months ago

Eminent Member
Posts: 17

@tutrix absolutely fantastic...and I was way off in my attempts 🙂 

Thank you so much!