HerokuでGoogle Fontsを使うときはHTTPSが必要

Pocket

***本記事にはプロモーションが含まれています。***

HerokuでDjango Girls Tutorialを作ったときにGoogle Fontsを使ってみました。

ローカルではうまく表示されるのですが、Herokuへデプロイするとなぜかフォントが使われていません。

CSSでstyleを設定する前にGoogle Fontsを読み込まなければならないという情報もあり、stylesheetの読み込み順序を変えてみても、表示は変わりませんでした。なにより、ローカルで動いているのでソースコードが間違っているとは思いにくいです。結局、Herokuで使うときはHTTPSを使わないといけませんでした。

<link href="https://fonts.googleapis.com/css?family=Lobster&subset=latin,latin-ext" rel="stylesheet" type="text/css">

このように、httpsで始まるようにします。

Chromeの開発者ツールで見てみると、一番下のコンソールのところにhttpはHerokuで使えませんと出ていました。見落としていました。

Pocket

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください