New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Making the Google Fonts control work #9

Open
gabyferman opened this Issue Apr 28, 2014 · 13 comments

Comments

Projects
None yet
10 participants
@gabyferman

Hi,

I was wondering how does the Google Font controller would be used in the front page, how would i call it?

@ehrig

This comment has been minimized.

Show comment
Hide comment
@ehrig

ehrig May 18, 2014

Echo the Google Font like this:

<?php echo get_theme_mod('google_font_setting'); ?>

Though the output is numeric, not the font family, as the option's value isn't the actual font. Any fix?

ehrig commented May 18, 2014

Echo the Google Font like this:

<?php echo get_theme_mod('google_font_setting'); ?>

Though the output is numeric, not the font family, as the option's value isn't the actual font. Any fix?

@gabyferman

This comment has been minimized.

Show comment
Hide comment
@gabyferman

gabyferman Jun 3, 2014

Yes, that's what I got. I'll keep looking into it, if I get an answer I'll post it, thanks :)

Yes, that's what I got. I'll keep looking into it, if I get an answer I'll post it, thanks :)

@davebonds

This comment has been minimized.

Show comment
Hide comment
@davebonds

davebonds Jun 5, 2014

+1 Also looking for a way to get the selected font name instead of the option value. Any help is appreciated!

EDIT: Just figured it out. Line 35 change:
printf('<option value="%s" %s>%s</option>', $k, selected($this->value(), $k, false), $v->family);

To:
printf('<option value="%s" %s>%s</option>', $v->family, selected($this->value(), $k, false), $v->family);

+1 Also looking for a way to get the selected font name instead of the option value. Any help is appreciated!

EDIT: Just figured it out. Line 35 change:
printf('<option value="%s" %s>%s</option>', $k, selected($this->value(), $k, false), $v->family);

To:
printf('<option value="%s" %s>%s</option>', $v->family, selected($this->value(), $k, false), $v->family);

@steveshead

This comment has been minimized.

Show comment
Hide comment
@steveshead

steveshead Jun 26, 2014

Thanks for the fix @davebonds - however I've noticed that only some of the Google Fonts are working and can't make out why. I would have thought all would be available but for some reason not. Any clue?

Once I have Google fonts sorted I'm going to upload my base theme with a healthy suite of options and let folks have access to it, and improve it. It's based on roots sass, using Grunt - fun times.

Thanks for the fix @davebonds - however I've noticed that only some of the Google Fonts are working and can't make out why. I would have thought all would be available but for some reason not. Any clue?

Once I have Google fonts sorted I'm going to upload my base theme with a healthy suite of options and let folks have access to it, and improve it. It's based on roots sass, using Grunt - fun times.

@davebonds

This comment has been minimized.

Show comment
Hide comment
@davebonds

davebonds Jun 26, 2014

It's limited to 30 at line 51 - just change the amount or set it to all.

It's limited to 30 at line 51 - just change the amount or set it to all.

@steveshead

This comment has been minimized.

Show comment
Hide comment
@steveshead

steveshead Jun 26, 2014

@davebonds - thanks so much for the reply - I'm only getting five out of the main list though - that's the issue. I'm okay with the amount, just wondering why when selected they don't show.

I tried uploading the theme to a live web host and it still doesn't show the fonts. Any help on getting them to show gratefully received.

@davebonds - thanks so much for the reply - I'm only getting five out of the main list though - that's the issue. I'm okay with the amount, just wondering why when selected they don't show.

I tried uploading the theme to a live web host and it still doesn't show the fonts. Any help on getting them to show gratefully received.

@ghost

This comment has been minimized.

Show comment
Hide comment
@ghost

ghost Aug 3, 2014

Hello,
same problem here. I have changed the $amout to all but only some fonts work (the most popular like Oswald...). When I try other fonts, nothing happen. How can I fix that?
Thanks.

ghost commented Aug 3, 2014

Hello,
same problem here. I have changed the $amout to all but only some fonts work (the most popular like Oswald...). When I try other fonts, nothing happen. How can I fix that?
Thanks.

@ekazda

This comment has been minimized.

Show comment
Hide comment
@ekazda

ekazda Feb 25, 2015

I'll share some information that I had to figure out on my own.

On line 51, you can change the number of fonts you wish to return. Changing this value to 'all' will return all the fonts within Google Fonts.

By default, the font list returned is ordered by Popularity. However, you can change this by adding one of the following values to the API call on line 78:

alpha: Sort the list alphabetically
date: Sort the list by date added (most recent font added or updated first)
popularity: Sort the list by popularity (most popular family first)
style: Sort the list by number of styles available (family with most styles first)
trending: Sort the list by families seeing growth in usage (family seeing the most growth first)

ekazda commented Feb 25, 2015

I'll share some information that I had to figure out on my own.

On line 51, you can change the number of fonts you wish to return. Changing this value to 'all' will return all the fonts within Google Fonts.

By default, the font list returned is ordered by Popularity. However, you can change this by adding one of the following values to the API call on line 78:

alpha: Sort the list alphabetically
date: Sort the list by date added (most recent font added or updated first)
popularity: Sort the list by popularity (most popular family first)
style: Sort the list by number of styles available (family with most styles first)
trending: Sort the list by families seeing growth in usage (family seeing the most growth first)

@shermandy

This comment has been minimized.

Show comment
Hide comment
@shermandy

shermandy Jun 19, 2015

@steveshead - sorry for the out-of-nowhere response. But I experienced the same problem you had and fixed it.

The only fonts that weren't working were ones with multiple word names (basically any font with a space in the title, e.g., Slabo 27px). To fix this, you just need to add ' ' around the CSS font declaration:

font-family: '';

@steveshead - sorry for the out-of-nowhere response. But I experienced the same problem you had and fixed it.

The only fonts that weren't working were ones with multiple word names (basically any font with a space in the title, e.g., Slabo 27px). To fix this, you just need to add ' ' around the CSS font declaration:

font-family: '';

@mairagall

This comment has been minimized.

Show comment
Hide comment
@mairagall

mairagall Jul 12, 2016

Hi all, I have problems integrating the fonts...it seems that fonts are not being loaded properly from the cache file, when I select a font the style is applied correctly via CSS but it shows a serif font instead of the selected font. I've created and added the API KEY but I'm not sure what else should I do...

Appreciate any help...

Hi all, I have problems integrating the fonts...it seems that fonts are not being loaded properly from the cache file, when I select a font the style is applied correctly via CSS but it shows a serif font instead of the selected font. I've created and added the API KEY but I'm not sure what else should I do...

Appreciate any help...

@robertdevore

This comment has been minimized.

Show comment
Hide comment
@robertdevore

robertdevore Mar 23, 2017

I'm experiencing the same issue as @mairagall and others, where only a few of the fonts that are in cache actually display when selected in a theme, defaulting to a serif font.

Anyone with an idea of what is happening?

I'm experiencing the same issue as @mairagall and others, where only a few of the fonts that are in cache actually display when selected in a theme, defaulting to a serif font.

Anyone with an idea of what is happening?

@monparaashvin

This comment has been minimized.

Show comment
Hide comment
@monparaashvin

monparaashvin May 19, 2017

only default apply not all please help

only default apply not all please help

@webmix

This comment has been minimized.

Show comment
Hide comment
@webmix

webmix Jul 4, 2017

@ehrig I had the same issue, this is how I did to retrieve the json data:

    <?php

        $json = file_get_contents( get_stylesheet_directory().'/inc/wordpress-theme-customizer-custom-controls/select/cache/google-web-fonts-request.txt' );
        $data = json_decode($json, true);
        $font_id = get_theme_mod('setting_name', '0');

        $family = ($data['items'][$font_id]['family']);
        $name = str_replace(' ', '+', $family);

        $file = ($data['items'][$font_id]['files']['regular']); // if you need the file

    ?>

    <style>
        @import url('https://fonts.googleapis.com/css?family=<?php echo $name; ?>');
        h1, h2, h3, h4, h5 {
            font-family: <?php echo $family; ?> !important;
        }
    </style>

webmix commented Jul 4, 2017

@ehrig I had the same issue, this is how I did to retrieve the json data:

    <?php

        $json = file_get_contents( get_stylesheet_directory().'/inc/wordpress-theme-customizer-custom-controls/select/cache/google-web-fonts-request.txt' );
        $data = json_decode($json, true);
        $font_id = get_theme_mod('setting_name', '0');

        $family = ($data['items'][$font_id]['family']);
        $name = str_replace(' ', '+', $family);

        $file = ($data['items'][$font_id]['files']['regular']); // if you need the file

    ?>

    <style>
        @import url('https://fonts.googleapis.com/css?family=<?php echo $name; ?>');
        h1, h2, h3, h4, h5 {
            font-family: <?php echo $family; ?> !important;
        }
    </style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment