How can register Japanese Font?

[hideyuki]

I am beginner of Kleo theme. (I lovei it)

I would like to know how to register Japanese font,which is not in the list of font<-styling option<-theme option.

For example, I would like to use this font for entire site.

“style=”font-family: Meiryo UI”

Anyone, please teach me hoew to do it. Thanks

[Radu]

Hi,

You can achieve that by loading the font resource directly to head via this function

COPY CODE

add_action('wp_head','Kleo_hook_font');

function Kleo_hook_font() {

$output="<link rel='stylesheet' href='http://linktomyfont.com/font.css' type='text/css' media='all' />";

	echo $output;
}

Then add to css (wp-admin -> theme options -> general settings -> quick css)

body,a,b,h1,h2,h3,h4,h5,h5 { font-family : ‘Meiryo UI’; }

Cheers

Radu

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[hideyuki]

Thanks you! I solved it.
I wrote add_function in functions.php in Kleo Child.

[Radu]

You’re welcome,

Also don’t forget to rate our theme on Themeforest and give it 5 stars 🙂

http://themeforest.net/downloads/

Best regards

Radu

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[verenar]

Hello,

how can I add a ttf File? Is it the same syntax like the font.css in the example?

Where do I have to put the code from the example?

Greetings

[Radu]

Hi,

If you have only ttf file i suggest you to upload the ttf file here ( cross browser ): http://www.fontsquirrel.com/tools/webfont-generator and then download the archive package, unzip it, uploade it on your server and then you should load the stylesheet from font archive.

Cheers

Radu

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[verenar]

Hey Radu,

thanks, great support!

Last question: Where exactly (the path) I have to put the contents from the zip on the server?

Greetings

[Radu]

Hi,

You can upload these in wp-content/themes/kleo/assets/yourResourcesFolder

And then the path for the css file with font will be

http://yourdomain.com/wp-content/themes/kleo/assets/yourResourcesFolder/stylesheet.css

Cheers

Radu

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[verenar]

Hey,

now its working.

1. Font created with http://www.fontsquirrel.com/tools/webfont-generator
2. Files saved on http://yourdomain.com/wp-content/themes/kleo/assets/newFont
3. wp-admin -> theme options -> general settings -> quick css:
I have to paste hier the complete css from the generated font with the full path to the files.

@font-face {
…
}

h1,h2,h3,h4,h5,h5 { font-family: ‘ar_berkleyregular’; }

Thanks!

[Radu]

You’re welcome

Don’t forget to rate our theme 5 stars on Themeforest since it will really help us.

Cheers

Radu

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[andrea14cha]

Hello,
I have created the stylesheet.css with fontsquirrel.com and I saved the file on http://yourdomain.com/wp-content/themes/kleo/assets/Font

Now what should I write in the quick css?

@font-face {???
}

Thanks in advance,
Andrea

[Radu]

Hi

You need to add your css font file to head with the function below, replace http://linktomyfont.com/font.css with http://yourdomain.com/wp-content/themes/kleo/assets/Font/yourfontcssfile.css

COPY CODE

add_action('wp_head','Kleo_hook_font');
 
function Kleo_hook_font() {
 
$output="<link rel='stylesheet' href='http://linktomyfont.com/font.css' type='text/css' media='all' />";
 
	echo $output;
}

Then in quick css area you will add a css like this

h1,h2,h3,h4,h5,h5 { font-family: ‘ar_berkleyregular’; }

Replace ar_berkleyregular with your font family

Cheers

Radu

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ccreature]

Hi Radu, I am trying to add an Adobe Typekit font for use throughout the site, however the above solutions don”t seem to work with the code that Adobe provides.

This is the code that they provide:

<script src=”https://use.typekit.net/rbe0ekl.js”></script&gt;
<script>try{Typekit.load({ async: true });}catch(e){}</script>…

I cannot seem to figure it out.

[Radu]

Hi,

That code is a javascript one, and that kind of code can be added to wp-admin -> theme options -> general settings -> javascript code in this way you will load that code into kleo theme

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ccreature]

So I added the code there as well as the css for the selectors, however it is still being overridden with the Google Font I currently have selected.

[ccreature]

I also cannot seem to find where a font that keeps showing up is. I have attached an image of the issue. The font for the portfolio gallery thumbnails doesnt appear in the list of fonts in the Theme options in the admin panel.

Attachments:

You must be logged in to view attached files.

[Radu]

For the new rules that you are using add !important at the end and in special cases you should target more accurate the element with css

from example h1 {font-family:’Monserat’ !important;} maybe it will not works but this maybe it will work .portfolio h1 {font-family:’Monserat’ !important;}

Try this selector please

COPY CODE

ul.portfolio-items .portfolio-header h3.post-title, ul.portfolio-items .portfolio-header h3.post-title a { font-family:'arial' !important;}

Replace arial with your font family

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ccreature]

Alrighty, so this is the CSS I used:

h1,h2,h3,h4,h5,h5 { font-family: ‘proxima-nova’ !important; }
ul.portfolio-items .portfolio-header h3.post-title, ul.portfolio-items .portfolio-header h3.post-title a { font-family:’arial’ !important;}

The portfolio items did change, however all other fonts are still being overridden by the theme (such as menu items)

[Radu]

Where do you have added this code ?

COPY CODE

<script src=”https://use.typekit.net/rbe0ekl.js”></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>

Make sure you load the font….

You haven’t loaded the font into the website that’s the reason for not working…

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ccreature]

I added that code in the general settings area for the theme options where it says to add the script… how do I load the font? I though placeing that in the script area did that… no?

Attachments:

You must be logged in to view attached files.

[Radu]

Hi again,

Try to use this css

COPY CODE

h1,h2,h3,h4,h5,h5 {
    font-family: proxima-nova-n9, proxima-nova, sans-serif;
    font-style: normal;
    font-weight: 900;
}

a,b,p {

    font-family: proxima-nova-n9, proxima-nova, sans-serif;
    font-style: normal;
    font-weight: 900;

}

.portfolio-filter-tabs li a {
    font-family: proxima-nova-n9, proxima-nova, sans-serif;
    font-style: normal;
    font-weight: 900;
}

Let me know if is ok

PS : I will respond delayed because i’m on holiday, hope you understand.

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ccreature]

Hi Radu, very much appreciated, worked like a charm 🙂

[Radu]

Great

Have a nice week

If you are really satisfied by our client support service please leave a positive review about this on the themeforest.net KLEO page : https://themeforest.net/item/kleo-next-level-wordpress-theme/reviews/6776630
Thanks you in advance

Regards.

Radu.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[faizan]

Hello,

Can I use this with buddypress login?
https://woocommerce.com/products/tickets-woocommerce/
So when people are logged in the dont need to signup again to purcahse this?
Also tell me please, can I easily manage payment integration with that?

[Radu]

Hi,

Please open a new ticker related the question for that plugin, personally i haven’t tested the plugin and i think it should work as it should, just give a try.

If you are logged in you have already an account maybe it will ask about payment and delivery adresses.

Since the plugin it’s for the woocommerce the tickets should follow the woocommerce payments method.

Please reply to me if you will, in a new ticket please.

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[faizan]

Can I integrate eventsbrite into this theme : https://www.eventbrite.com

[Radu]

Hi,

Personally i haven’t tested but, you can give a try.

If it’s a plugin for woocommerce it should work

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts