#133101 Adobe font using the wrong CSS name

Landing Forums JupiterX WordPress Theme Adobe font using the wrong CSS name

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • Electric Pen

    We have created a typekit using the font Azo Sans. When we select this font in Customizer the CSS font family ends up being “azo-sans”. However the correct font family is “azo-sans-web”. Any idea how to get this corrected? Is it a problem in Typekit and can we edit something there, or should we create a CSS rule that somehow maps azo-sans to azo-sans-web?

    Private
    Nodari Support Team
    This reply has been marked as private.
    Electric Pen

    No, this illustrates the problem. That should say “azo-sans-web”.

    Attaching a screenshot of the correct font family info from Adobe . You’ll see at upper left “azo-sans-web”.

    Why do you think it would be showing up in CSS as “azo-sans”?

    Nodari Support Team

    Sorry for misunderstood 🙂

    Is actually font applied? I mean, is this exact font you wanted to have? if this is an only font name problem then I think there is nothing we can do because this is how Typekit is providing font names, our system is only rendering it as is

    Waiting for your answer 🙂

    Electric Pen

    The wrong font is being displayed. I can bring it up with Adobe but they are just going to point the finger back at you I suspect. They are huge after all.

    Their instructions would be “add the typekit include in the page header, then reference this font family as “azo-sans-web”.

    How does JupiterX get the font family name from the typekit? If you can clarify exactly how it is able to extract that font family, I could include it in a support request to Adobe. If this particular typekit embed is delivering the wrong font family name perhaps they can correct it.

    I should add that we CAN select the font directly within Elementor modules and it renders correctly. It’s only when we have it set in Customizer as the default that it’s delivering the wrong font family. That suggests the problem is in the theme customizer. Perhaps it is stripping -web off the end, or perhaps Typekit offers several different variables and JupiterX is grabbing the wrong one.

    Mohsin Al-Rabieai Support Team

    Hi there,

    My apologies for the inconvenience.

    We are using two methods on loading Adobe fonts:

    1 – CSS which will only call this CSS file:

    https://use.typekit.net/{$project_id}.css

    (the project_id is the ID of Adobe fonts that you add to Jupiter X -> Control Panel -> Settings.

    2 – JS method using WebfontJS:

    WebFont.load({
    	typekit: {
    		id:'{$project_id}'
    	}
    });

    Again, the project_id is the ID of Adobe fonts that you add to Jupiter X -> Control Panel -> Settings.

    You can find all the codes in jupiterx/lib/api/fonts/adobe.php file.

    By any chance, can I ask your WP admin credentials to take a closer look, please? You may provide it in the next PRIVATE reply.

    Best regards

    Private
    Electric Pen
    This reply has been marked as private.
    Mohsin Al-Rabieai Support Team

    Hi there,

    So sorry for the delayed response. After hours of debugging, I realized it’s indeed an issue with the theme. I was able to provide a solution and wanted to apply it on your website using a File Manager plugin, but unfortunately, I had a typo in the code and it causes a critical issue. Now your website is not accessible. So sorry about that. I can fix it quickly if you provide working FTP credentials. The fix I was going to apply was on this file:

    jupiterx/lib/api/fonts/adobe.php

    This function should be changed:

    	public function add_custom_fonts( $custom_fonts ) {
    		$kit_fonts = $this->load_typekit_fonts();
    
    		if ( empty( $kit_fonts ) || ! is_array( $kit_fonts ) ) {
    			return $custom_fonts;
    		}
    
    		$fonts = [];
    
    		foreach ( $kit_fonts as $font ) {
    			$fonts[ $font['name'] ] = [
    				'type'  => 'adobe',
    				'value' => $font['slug'],
    			];
    		}
    		return array_merge( $custom_fonts, $fonts );
    	}

    With this:

    	public function add_custom_fonts( $custom_fonts ) {
    		$kit_fonts = $this->load_typekit_fonts();
    
    		if ( empty( $kit_fonts ) || ! is_array( $kit_fonts ) ) {
    			return $custom_fonts;
    		}
    
    		$fonts = [];
    
    		foreach ( $kit_fonts as $font ) {
    			$fonts[ $font['name'] ] = [
    				'type'  => 'adobe',
    				'value' => isset( $font['css_names'][0] ) ? $font['css_names'][0] : $font["slug"], 
    			];
    		}
    		return array_merge( $custom_fonts, $fonts );
    	}

    I also reported this to our backlog so soon it would be fixed in the theme.

    Thanks for your report and sorry for the trouble I caused.

    Bests

    Electric Pen

    I pasted this in – all good. Thanks for finding a fix!

    Mohsin Al-Rabieai Support Team

    Thanks a lot and sorry again for the trouble.

    Bests

Viewing 10 posts - 1 through 10 (of 10 total)
You must be logged in to reply to this topic.
Login