wpDiscuz - WordPress Comment Plugin
Share:
Notifications
Clear all

[Solved] Edit .wpd-rating related CSS


fw1002
Posts: 5
Topic starter
(@fw1002)
Active Member
Joined: 3 months ago

Hi,

Thank you for the great work of the wpDiscus plugin. It is awesome.

I am trying to customize the style of post rating but I cannot find the correct path and file to edit.

Could you help to advise them?

I am going to edit the following classed.

.wpd-rating .wpd-rating-wrap .wpd-rating-value
.wpd-rating .wpd-rating-wrap .wpd-rating-value
.wpd-rating .wpd-rating-wrap .wpd-rating-value .wpdrv
.wpd-rating .wpd-rating-wrap .wpd-rating-value .wpdrc
.wpd-rating .wpd-rating-wrap .wpd-rating-value .wpdrt

Thank you in advance!

9 Replies
Asti
Posts: 4894
 Asti
Support
(@asti)
Support member
Joined: 5 years ago

Thank you @fw1002,

You should add the CSS codes in the Top Admin Bar > Customize > Additional CSS > "Additional CSS" textarea. 

fw1002
Posts: 5
Topic starter
(@fw1002)
Active Member
Joined: 3 months ago

Hi Asti,

I tried to add the CSS codes to Top Admin Bar > Customize > Additional CSS > "Additional CSS" but there was no change.

I also tried another method according to: https://wpdiscuz.com/docs/wpdiscuz-7/customization/custom-template-and-style/

I copied the style-minimal.css and style.css to the folder

/wp-content/themes/mytheme/wpdiscuz/

and modified the CSS codes. However, there was also no change.

The CSS codes I want to change are:

.wpd-rating{display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center; align-items: center; width: 100%; margin-top: 8px; margin-bottom: 12px;}

.wpd-rating .wpd-rating-wrap .wpd-rating-value{ transition:0.2s; background-color:#ffffff; border: 1px dashed #777777; height: 40px; width: 40px; text-align: center; border-radius: 50%;font-family: square721_cn_btroman, "Open Sans", san-serif; }

.wpd-rating .wpd-rating-wrap .wpd-rating-value .wpdrv{font-size: 18px!important; line-height: 40px!important; padding-top: 0px!important;}

 

The theme I use is a Bootstrap 5 theme for WordPress ( https://bootscore.me/)

 

Could you help to see if I made any mistake?

Thank you in advance!

 

1 Reply
Asti
 Asti
Support
(@asti)
Joined: 5 years ago

Support member
Posts: 4894

@fw1002,

Do you have any cache plugins installed on your website? Or probably you have some server-side cache? You should properly delete all those caches before checking. 

fw1002
Posts: 5
Topic starter
(@fw1002)
Active Member
Joined: 3 months ago

Hi Asti,

Thank you for the reply.

I have deleted them several times.

Other changes made afterward were shown successfully.

Frank

1 Reply
Asti
 Asti
Support
(@asti)
Joined: 5 years ago

Support member
Posts: 4894

@fw1002,

Please send us the example URL where we can see the wpDiscuz plugin activated. Also, leave a screenshot where we can see the codes are added. 

fw1002
Posts: 5
Topic starter
(@fw1002)
Active Member
Joined: 3 months ago

Hi Asti,

Thank you for the reply and support.

URL: https://reviewfromusers.com/home2022/

Please see the attached file for the screenshot.

 

Frank

2022 06 01

 

1 Reply
Asti
 Asti
Support
(@asti)
Joined: 5 years ago

Support member
Posts: 4894

@fw1002,

We see all the CSS codes are there and working fine. Please watch this video: https://www.screencast.com/t/mQcjsyhY

We don't follow you well. What exactly do you need to change? 

fw1002
Posts: 5
Topic starter
(@fw1002)
Active Member
Joined: 3 months ago

Hi Asti,

Sorry for the confusion. I made some changes after replying to your message.

Yes, it works now by changing the css codes directly in wpdiscuz-ratings.min.css.

This file I edited was located in /wp-content/plugins/wpdiscuz/assets/css/.

I think I will lose the current changes if the plugin is updated, right?

Could you suggest the directory I should put the edited wpdiscuz-ratings.min.css in?

 

Many thanks,

Frank

1 Reply
Asti
 Asti
Support
(@asti)
Joined: 5 years ago

Support member
Posts: 4894

@fw1002,

I think I will lose the current changes if the plugin is updated, right?

Put the code in the Top Admin Bar > Customize > Additional CSS > "Additional CSS" textarea, save it, delete all caches and check again. So the codes won't be lost in the case of the plugin update. You can keep those codes without any worries. 

Share: