Notifications
Clear all

wpForo 1.x.x [Closed] Dark mode

13 Posts
3 Users
1 Reactions
1,622 Views
Vijiki
Posts: 28
Topic starter
(@vijiki)
Trusted Member
Joined: 2 years ago

I wanna make my forum dark mode

Is there any css script or settings?

12 Replies
Chris
Posts: 3627
(@chris)
Famed Member
Joined: 3 years ago

@vijiki,

Go to Dashboard > Forum > Settings > Styles Tab, select Dark mode for wpForo theme.

5 Replies
Vijiki
(@vijiki)
Joined: 2 years ago

Trusted Member
Posts: 28

@chris I did switch to dark mode and I have 3 Questions

How do I change the background color or the comment box

 

How do I change just the menu button color, if I try some other part of my forum will change color

 

How do I change the reply/quote background color, I can't seams to find it, documentation said is #15 but it didn't work

Chris
(@chris)
Joined: 3 years ago

Famed Member
Posts: 3627

@vijiki,

Add the below code in your active theme functions.php file for the editor background color.

add_filter('wpforo_editor_settings', function($s){
   $s['tinymce']['content_style'] .= "body{background-color:#ccffcc; color:#000000;}";
   return $s;
});

Use this CSS for the Choose File button:

#wpforo #wpforo-wrap .wpf-field-wrap .wpf-extra-fields .wpf-default-attachment input[type=file]::file-selector-button {
  border: 2px solid #a29bfe;
  background-color: #a29bfe;
}
Chris
(@chris)
Joined: 3 years ago

Famed Member
Posts: 3627

Sue the below CSS for blockquotes:

blockquote p::before, .wp-block-quote p::before, .wp-block-quote.is-style-large p::before, .wp-block-quote.has-text-align-right p::before {
display: none;
}
#wpforo #wpforo-wrap .wpforo-post blockquote, #wpforo #wpforo-wrap .wpforo-revision-body blockquote {
background-color: grey;
}

Vijiki
(@vijiki)
Joined: 2 years ago

Trusted Member
Posts: 28

@chris thanks

Step one is still showing white background

 

Chris
(@chris)
Joined: 3 years ago

Famed Member
Posts: 3627

@vijiki,

Clean your cache from Dashboard > Forums > Dashboard, Delete All Cache, then press CTRL+F5 twice in the browser.

Vijiki
Posts: 28
Topic starter
(@vijiki)
Trusted Member
Joined: 2 years ago

The recent topics widget: I can't see a place to change the text and block color

Is there any css script for that

1 Reply
Chris
(@chris)
Joined: 3 years ago

Famed Member
Posts: 3627

@vijiki,

Which block and text do you mean?

Vijiki
Posts: 28
Topic starter
(@vijiki)
Trusted Member
Joined: 2 years ago

I wanna change the text color of the Recent topics widget, something like this 

1 Reply
Chris
(@chris)
Joined: 3 years ago

Famed Member
Posts: 3627

@vijiki,

try this: 

.wpforo-widget-content .wpforo-list-item .wpforo-list-item-right .posttitle a {
    color: white !important;
}
.wpforo-widget-content .wpforo-list-item .wpforo-list-item-right .postuser{
    color: #c81a1a !important;
}
.wpforo-widget-content .wpforo-list-item .wpforo-list-item-right .postuser a{
    color: #00a636 !important;
}
Vijiki
Posts: 28
Topic starter
(@vijiki)
Trusted Member
Joined: 2 years ago

I wanna change the color of the following container

Search

Profile

 Recent post

See screenshot 👇

 

Any css script?

1 Reply
dimalifragis
(@dimalifragis)
Joined: 5 years ago

Famed Member
Posts: 2611

@vijiki I think you should invest some time to learn the basics of css. That will give you the freedom you want.