I am trying to add Marathi font to header menus.I failed to see option in divi builder(wordpress).
there are options, but they are only for default font's.
whats the procedure to add custom font for header menu in divi builder?
I have done this several times and the solution I employ is to install the Use Any Font plugin. You will need an API key and you can get that for free from the download page. If you use the free version, you will only be able to import one font. That can be found here:
Once you have your plugin installed, the API key active, and your font imported, you will need to target the nav links using CSS, as the plugin doesn't allow you to directly target the nav anchors. So, to achieve this add the following to your custom CSS panel:
.et_header_style_left #et-top-navigation nav > ul > li > a, .et_header_style_split #et-top-navigation nav > ul > li > a {
font-family: Marathi, sans-serif;
}
Do you want to add custom fonts in WordPress? Custom fonts can help you freshen up your theme and stand out. In this article, we will show you how to add custom fonts in WordPress using Google Fonts, TypeKit, and CSS3 #Font-Face method.
Load font and create class in css and add that class inside menu item,
http://www.wpbeginner.com/wp-themes/how-to-add-custom-fonts-in-wordpress/
Related
hello guys av been trying to change the font family/ font style of this WordPress theme Bizberg Consulting Dark for days now, I have looked for this on all the theme editor files but could not find the solution when I inspected the theme on chrome the front family is currently on
.primary_header_2 h3, .bizberg_header_wrapper h3 {
font-family: Dancing Script;
}
I also tried changing this using the additional CSS option on WordPress but any input I give it doesn't work, but when I try
.primary_header_2 h3, .bizberg_header_wrapper h3 {
display: none;}
The whole of the site title disappears showing that this id is the correct id for this change but when I try to input another type of font-family it doesn't work I have looked for this on all the theme editor files but could not find the solution
in your additional css option in wordpress after the css you should input !important and this will overide all functions the theme is playinging initially eg
.header_site_title {
font-family: Times New Roman !important;
}
I've recently uploaded a custom font to my squarespace page (Bedford Template) and, as I'm applying it through the sit, am having a hard time with the nav bar.
For the items that are Links are the nav bar, I can change the font with:
#headerNav nav a {
font-family: 'Vitesse-Sans' !important;
}
But the items that are folders, not links, won't change. I can't find the code to change the folder text!
Here's our site: https://www.asapasap.org/
Thank you!
Scott
The solution is to use a very similar CSS rule, but to target the .folder-toggle class instead, like this:
#headerNav nav .folder-toggle {
font-family: 'Vitesse-Sans';
}
If you haven't already, consider familiarizing yourself with browser developer tools/web inspector (often opened with the F12 or CTRL+SHIFT+I keys). With it, you'd be able to explore the existing CSS rules applied to your site and experiment with the best ways to override them.
I am looking to change the font size and weight of the navigation menu items on my WordPress site, I am using The Company theme, but I can't seem to figure out the CSS required
My site is www.thepowerwithin.org.uk
I am looking to make the items in the main menu at the top bigger and bold
I have reviewed your question. I think you want to apply CSS only on main-menu anchor text not on sub-menu anchor text. If I am right then you can do as:
ul.menu:not(.sub-menu) > li > a {
font-size: 16px;
font-weight: bold;
}
You should use children-selector > to apply CSS only on the direct children of ul
When use ul.menu:not(.sub-menu) it ignores sub-menu ul of li.
The best thing to do is learn how to use the developer tools in Firefox or Chrome or Safari or IE to see what's loading on your site and how to work with and change the CSS and HTML. Dev tools allows you to make temporary changes to the locally cached browser copy of the site. You can then add the CSS changes to the theme, either by adding new CSS in theme options or to the style sheet.
If the theme allows you to add custom CSS to modify the menu, that's good. If not, make a child theme so you don't lose your changes when the theme is updated. See Child Themes « WordPress Codex
I've used custom CSS to create a strike-through effect for active menu items on my wordpress site: http://www.sekoul.com/
This is the code that I use to do this:
/* active menu item color */
.et_color_scheme_orange #top-menu li.current-menu-item > a {
color: #4a4a4a !important;
text-decoration: line-through !important;
}
However, on certain pages (ones which are generated by WP plugins), this effect doesn't work: http://www.sekoul.com/reading-list/
When I inspect the code, I can see that the ID's are not the same on these pages, but I can't seem to figure out which ID/class to apply the effect to. Any idea why this is happening / what I can do to select the appropriate ID/class ?
It's missing the .current-menu-item class because you're using a custom link. I'm assuming that "BOOKS" is a custom post type archive page, right?
If you need to have an active state on a custom post type archive page, you could try this solution that worked great for me: https://stackoverflow.com/a/22602901/4303385
It'll add a metabox on the Appearance > menu with custom posts type archive page with active state support.
Is there a Wordpress WYSIWYG editor plugin to make a button for adding specific ul li and ol li styling?
e.g. currently my ul li list-style-type is set as square in my css and my ul li are numbers. My client want to be able to add roman and alphabet bullet points in the Visual side of the Wordpress WYSIWYG editor instead of having to manually code the list-style-type (upper-roman, upper-alpha) in the HTML side of the editor?
This tutorial will let you add the Styles dropdown in the WordPress editor: http://alisothegeek.com/2011/05/tinymce-styles-dropdown-wordpress-visual-editor/ (edit: the Method 2 described there)
As options of this dropdown, you should let your client add 2 different classes on ul element, for example alphabetical and roman. In the CSS file of your theme as well as in the editor-style.css mentioned in the tutorial, style these 2 classes as you want (ex: .roman { list-style-type: (...) })