How to add custom font for Avada WordPress Theme - css

I want to use a custom font for my website which uses WordPress and Avada theme,
I introduced the font via typography custom font option.
But since its not listed on the Google or Standard fonts, I can't apply it on the headings or title or body.
How can I add a new font to the list of fonts in Avada theme and use it for different sections of the website?
or if I can change the css, which css and where I can change the fonts?

You will be able to change the CSS -- it will be located inside the theme directory, and the file will normally be called styles.css. If you import your font into the css file, you should be able to apply your Persian font instead of the default.

I solved it by editing the style.css in the themes\avada directory and imported my font via the font-face, plus I selected none for the font selection boxes in the typography section of the theme options otherwise they override my fonts
Actually the order of styles being applied is: style.css -> options in the theme options -> custom styles in the theme options
don't rely on editing avada.css which is dynamically generated after changing the theme options.

Related

how to change wordpress' wp-login.php font to a custom font-family?

I have uploaded a custom font to my wordpress site and changed the font family everywhere. However, the wp-login.php page's font will not change. I have tried editing the functions.php file multiple times but none of my changes take effect.
What I need is to have a custom font that I uploaded through a plugin, Brainstorm Force's custom fonts plugin to be exact, applied to my wp-login.php page
Thank you in advance
The solution was simple. I uploaded the font files, linked them through font face in the main style stylesheet, and used the font family.
Edit:
I uploaded the font files much like an image is uploaded
Then I got the URL and added it in the stylesheet font-face section I implemented in the theme functions file.

Wordpress custom template CSS

How can I apply CSS for a custom template in wordpress? In the theme I'm using, the background's suppose to be light-green, but when I create a template on PHP the background color is gone. And for example, if I assign a page the default template, the color is back. How can I add a CSS file so my custom template can have the same color or another color in case I want it to be different? Thanks in advance and sorry if my english is kinda sloppy.
Make sure your template imports your header which usually imports the style.css file of your theme.
Also you can make use of the admin style editor found under appearance on Wordpress admin menu to write custom css rules for your template.

Where Can I Find the CSS file to Edit My Current Wordpress Theme

I am trying to change the background color of my Wordpress site, as well as the size of images I use on this site. However, I can't find the CSS file that specifies these properties for my Wordpress site.
If I can edit it, where is the CSS file that specifies these properties for my Wordpress site located?
You can edit CSS from admin panel also
Go to Dashboard > Appearance > Editor and click on style.css.
here you can edit the files directly from this window and hit save when you’re done.
or
You can edit CSS file located at ,
Go to wp-content > themes > YOUR THEME NAME and try to finder a folder that houses the css files. They are usually named CSS stylesheets or styles.
Which theme do you use?
The most of wordpress themes have a style.css in their parent folder that finds in: wp-content/themes/your-theme.
If you can't find this file, you can add styles in custom CSS on the "Theme Options" in /wp-admin.
PD: I recommend you to use a child theme because if you need in the future to update the theme, all your modifications in it will lose.

Font issue in wordpress when i activate my own plugin

I have developed a plugin and I enqueue bootstrap.min.css in admin for UI of my plugin. When I activated this plugin it affected the WordPress font in admin panel as shown in screenshots. What can I do?
I would strip all unnecessary styles from bootstrap css.
For starters, find all instances of font-family and remove them from the css.

Adding additional CSS files to WordPress theme editor

I have created a WordPress themes with all the necessary templates (PHP files). However under "Styles" it's currently only showing the style.css file. I understand I can #import CSS files in style.css but I wanna be able to edit those additional CSS files from my theme directly in the WordPress theme editor, like I can with style.css.
Seems silly to have a whole "Styles" heading in the theme editor if you can't even add other CSS files?
So is it possible to make extra CSS files show up in the theme editor?
Just create another stylesheet in your theme folder and it will show up in the theme editor. You can then edit that stylesheet from there.
You can import that css in your style.css or can enqueue style if you want.

Resources