[Solved] Help with CSS
Hello, I have 2 questions:
1. How do I change the font of the response text and the font of the button using css?
2. While clicking on the fields, the boxes getting black stroke, how do you change the the color using css?
I really need your help because I don't understand coding 😥
Thank you very much
Hi,
Please leave an example URL and show on some screenshots what you need to change.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti This is the url: https://wlmdiy.ussl.co.il/%d7%a7%d7%a2%d7%a8%d7%aa-%d7%a9%d7%99%d7%91%d7%95%d7%9c%d7%aa-%d7%a9%d7%95%d7%a2%d7%9c-%d7%9e%d7%95%d7%a9%d7%9c%d7%9e%d7%aa-%d7%9c%d7%97%d7%95%d7%a8%d7%a3/
I'm sending you the screenshots:
1. In the image with the title "Font issue" you can see that the font in the field of writing the response and the font of the button is not Assistant font (however, in the name and email fields there is Font Assistant).
2. In the image with the caption "Black stroke" you can see the black stroke after clicking on the name field (the black stroke is also appearing after clicking the email field). I want to change the stroke color to gray.
3. In the image titled "Uppercase issue in the Email field" you can see that there are uppercase letters when writing an email, even though I am not pressing caps lock. I want that the whole email will be written at lowercase letters.
Thank you!!
The CSS code below should solve the issues:
#wpdcom .wpd-form-row .wpdiscuz-item input[type="text"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="email"]{
font-family: "Assistant", Sans-serif;
outline:none !important;
text-transform: none;
}
You'll just need to change the red marked value.
Put the code in the Top Admin Bar > Customize > Additional CSS > "Additional CSS" textarea, save it, delete all caches and check again.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti What do you mean by "You'll just need to change the red marked value"?
If I understood you correctly, you meant that I should add the css through the "Customize" editorial panel in WordPress.
I did that and also cleaned the cache. The font has not changed to Assistant, the coment area looks the same as before I added the code.
I'm sending you the screenshot:
Please leave a screenshot of the section where you've added the code.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
wpDiscuz also has a built-in caches system Please delete this cache as well. It's located in the Dashboard > wpDiscuz > Settings > General Settings tab.
Please make sure other caches (CDN, website, browser) are also deleted.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti Ok, I will do that.
Can you explain me how to clean CDN cache? I searched in google and I didn't find answers
@asti Can you please tell me how to clean CDN cache? I searched in google and I didn't find answers ? I really need your help 😥 😥 😥
Please contact your hosting support with this question. They'll better point you how to do it.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti My hosting support cleaned my CDN and I also cleaned the cache on the website, browser, wpdiscuz like you said. But it still not working 😭 What to do??
Please show on the screenshot where you've added the CSS codes.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti I did that.
But it still didn't change the button's font and the comment's font. You can see in the screenshot. I cleaned cache.
Put this code as well:
#wpdcom .ql-editor > * { font-family: "Assistant", Sans-serif !important;}
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti The comment's font has changed!!! But the button's font did not, how to change the button's font to Assistant? I also want that the comment's content will be black (#2B2B2B)
You should write the CSS code like this:
#wpdcom .wpd-second-button, #wpdcom .wpd-prim-button { font-family: "Assistant", Sans-serif !important; }
I also want that the comment's content will be black (#2B2B2B)
Change the value of the "Comment Text". It's located in the Dashboard > wpDiscuz > Settings > Styles & Colors admin page
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti it worked!!
I have two more questions:
1. How can I place the button below the field of the email?
2. How can I increase the font size? (I want it to grow in all the plugin's text (in the comment text, the button,the written comments ...)
1. How can I place the button below the field of the email?
Navigate to Dashboard > wpDiscuz > Forms admin page, edit the default form, find the "COMMENT TEXT FIELD" section, drag and drop the fields as you like.
2. How can I increase the font size? (I want it to grow in all the plugin's text (in the comment text, the button,the written comments ...)
Please note, that we don't provide support for style customization, we may help in 1-2 simple questions related to colours and background but not more. We can not help you customize all components of website style, these are custom requirements and should be done by website owners. We only help with general questions and issues.
Thank you for your understanding.
You can find all classes by pressing F12 on the browser and opening Chrome or Firefox Console, it'll help you easily write CSS rules you need to customize.
This website should help you to write CSS rules: https://www.w3schools.com/cssref/default.asp
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
@asti I'm sorry. I will not ask you anymore.
I draged and droped the fields and now the button is in the left side, how can I straighten it to the right?
Just move all fields to the right.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
Then, move them to left.
In case you want to say thank you! 🙂
We'd really appreciate if you leave a good review on the plugin page.
This is the best way to say thank you to this project and the support team.
- 8 Forums
- 3,982 Topics
- 19.6 K Posts
- 6 Online
- 4,308 Members