素晴らしい日本語フォントを見つけたので、Webフォントに変換してブログタイトルに使おうと思ったら、クロスドメイン制約に阻まれて使えなかった、という話。
いやあ、Bloggerにファイルは置けないから、外部サーバーにWebフォントを置いたんですよ。
外部サーバーって言っても、Googleサイトなんですけどね？
今までもそこにCSSやJavascript、ブログの背景画像を設置していたりしてたんで、今回も大丈夫だと思ってたんですけど・・・
ダメでした。
最初は「CSSへの指定方法が悪いのかな？」と思って、色々と弄ってたんですけど・・・
ふとブラウザ開発ツールのコンソールを確認してみたら
「has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://blacksheepnotetest.blogspot.jp' is therefore not allowed access.」
だなんてエラーが表示されておりまして・・・
調べてみたら、クロスドメイン制約に引っかかってるー！？
背景画像なんかはOKなのに！？
フォントファイルは駄目なのか・・・
しかし対処法はありました。
htaccessにクロスドメインを許可する記述を行えば大丈夫・・・
Googleサイト、htaccess効かないじゃん orz
なるほど、ちゃんとしたサーバーを用意するなりして、そこにWebフォントを置かないといけないのかなぁ・・・うーん。
ということで、Webフォントの使用は諦めたのでした。
まあ、ロゴ画像に使うのもOKみたいだし、そのうち画像で作ってみようかな・・・
・・・散々CSS弄った挙句、何も無いというのも悔しいので・・・
「続きを読む」→「全文表示」にして、ボタン押した時の挙動を修正しました。
あと、地味にデザインも変えております。
記事一覧画面での本文の表示文字数をCSSで制限するようにしてから、「続きを読む」ボタンを押した時の飛び先が変な風になってたんですよね。記事の途中までスクロールされた状態でページ遷移されておりました・・・
なのでその辺りを修正して、記事の最初から表示できるようにしました。
うーん、ブラウザの仕様っていうのは、なかなか難しいものですね・・・