Using custom fonts hosted on AWS S3 in a Wordpress site

PoKoBros

I have fonts from typography.com that I moved to production and uploaded to my AWS S3 Bucket to use on my Wordpress site. I have done everything that typography.com has told me to do, but the fonts still are not being displayed. Has anyone gone through this before and can point me in the right direction? I added an @import statement in style.css in my theme to the url that typography.com gave me. I also have a wp_enqueue function in functions.php that I have uploaded to the S3 server.

 add_action( 'wp_head', 'my_fonts' );
function my_fonts(){ ?>
<link rel="stylesheet" type="text/css" href="//cloud.typography.com/7783912/761788/css/fonts.css">
<?php
}

The fonts are still not being displayed. What am I doing wrong?

rnevius

The proper way to include stylesheets is to use wp_enqueue_style. Using this function will also allow you to declare this font as a dependency for other stylesheets. You should also use the 'wp_enqueue_scripts' hook, as opposed to 'wp_head':

/**
 * Proper way to enqueue scripts and styles
 */
function theme_name_scripts() {
    wp_enqueue_style( 'typography', '//cloud.typography.com/7783912/761788/css/fonts.css' );
}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

If you're still having issues at this point, make sure you have the proper permissions to GET this file from the Typography cloud server.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

uploading fonts to wordpress site

From Dev

Redirecting wordpress urls in a ghost site hosted in Azure

From Dev

Using AWS services to create subdomains on the fly to host a site on S3

From Dev

How do you create an AWS Cloudfront Distribution that points to an S3 (static hosted) Website Endpoint using the SDK?

From Dev

Images do not display on a static page hosted on AWS S3

From Dev

Custom Paperclip::Processor with AWS S3

From Dev

using jQuery with Jekyll site hosted on Github pages

From Dev

Using Custom Fonts Properly in Android

From Java

Dynamic Open Graph meta tags in a static GatsbyJS site hosted on S3

From Dev

How do you invalidate cache of index.html for a static site hosted on S3 with cloudfront?

From Dev

Have static site on Amazon S3 and Cloudfront, how to add sub-domain hosted elsewhere?

From Dev

Configuring environment variables for static web site on AWS S3

From Dev

Static Site Deployment in AWS S3 with CloudFront

From Dev

How to customize a site hosted on wordpress.com locally

From Dev

wordpress images and fonts not loading after uploading site to production

From Dev

AWS S3 Hosted Website Redirect from index.html not working correctly

From Dev

Can I implement Google Sign-in into a web app hosted on AWS S3?

From Dev

Sending email from a Django app hosted on Heroku with attachment stored in AWS S3

From Dev

How does one determine the filetype on an AWS S3 hosted file without the extension?

From Dev

How to redirect static to dynamic URL's using .htaccess (on Wordpress site)

From Dev

Using Wordpress title in external site

From Dev

is it possible to create a wordpress site in aws ec2 using load balancing and auto scaling

From Dev

AWS S3 custom error document for access denied

From Dev

How to get SSL using Let's Encrypt! when my hostname is hosted by wordpress?

From Dev

How to get SSL using Let's Encrypt! when my hostname is hosted by wordpress?

From Dev

Purely custom html form popup in wordpress site

From Dev

Custom form and action attribute in wordpress site

From Dev

Using custom OTF fonts in ggplot2

From Dev

Xcode: Using custom fonts inside Dynamic framework

Related Related

  1. 1

    uploading fonts to wordpress site

  2. 2

    Redirecting wordpress urls in a ghost site hosted in Azure

  3. 3

    Using AWS services to create subdomains on the fly to host a site on S3

  4. 4

    How do you create an AWS Cloudfront Distribution that points to an S3 (static hosted) Website Endpoint using the SDK?

  5. 5

    Images do not display on a static page hosted on AWS S3

  6. 6

    Custom Paperclip::Processor with AWS S3

  7. 7

    using jQuery with Jekyll site hosted on Github pages

  8. 8

    Using Custom Fonts Properly in Android

  9. 9

    Dynamic Open Graph meta tags in a static GatsbyJS site hosted on S3

  10. 10

    How do you invalidate cache of index.html for a static site hosted on S3 with cloudfront?

  11. 11

    Have static site on Amazon S3 and Cloudfront, how to add sub-domain hosted elsewhere?

  12. 12

    Configuring environment variables for static web site on AWS S3

  13. 13

    Static Site Deployment in AWS S3 with CloudFront

  14. 14

    How to customize a site hosted on wordpress.com locally

  15. 15

    wordpress images and fonts not loading after uploading site to production

  16. 16

    AWS S3 Hosted Website Redirect from index.html not working correctly

  17. 17

    Can I implement Google Sign-in into a web app hosted on AWS S3?

  18. 18

    Sending email from a Django app hosted on Heroku with attachment stored in AWS S3

  19. 19

    How does one determine the filetype on an AWS S3 hosted file without the extension?

  20. 20

    How to redirect static to dynamic URL's using .htaccess (on Wordpress site)

  21. 21

    Using Wordpress title in external site

  22. 22

    is it possible to create a wordpress site in aws ec2 using load balancing and auto scaling

  23. 23

    AWS S3 custom error document for access denied

  24. 24

    How to get SSL using Let's Encrypt! when my hostname is hosted by wordpress?

  25. 25

    How to get SSL using Let's Encrypt! when my hostname is hosted by wordpress?

  26. 26

    Purely custom html form popup in wordpress site

  27. 27

    Custom form and action attribute in wordpress site

  28. 28

    Using custom OTF fonts in ggplot2

  29. 29

    Xcode: Using custom fonts inside Dynamic framework

HotTag

Archive