カスタムのユニークなフォントをブログに追加してください！ GoogleFonts接続
2010年11月23日火曜日Google WebFontsプロジェクト
チックPRの定義
モスクワの賃貸アパート
ヨーロッパのペディキュア
ブログデザイン用のBloggerカスタムフォント
最後に、Blogger開発者からの長い沈黙が終わり、そこでのあらゆる種類の会議に参加した後、チームは実りある仕事を始めました。 実際、その結果は、ブログのデザインとビジュアルコンポーネントを扱うBlogspotの新機能の本日のポストアナウンスです。 一般的に、インターネットプロジェクトのグラフィックデザインの形での個人的な自己表現は、ブログと通常のサイトの両方の作成者と作成者にとって非常に楽しいものです。 あなたには、訪問者に情報を提示する方法、ブロック、見出し、背景を強調する方法を自分で決める権利があります-一般的に、あなたが望むようにデザインを作ります。 これはすべて、新しい機能とその多くの機能の助けを借りて行うことができます。 今日、開発者はブログのデザインを実際に「独自の」ものにするもう1つの素晴らしい機会を提供しています。これはWebフォントです。
インターネットは、特にキリル文字やギリシャ語などの非ラテンアルファベットに関しては、さまざまなフォントを使用するという点で常に非常に有機的でしたが、ここではいつものように、Googleが登場し、問題の解決に役立ちます。昔、Google WebFontsプロジェクトはGoogleFont APIとともに作成されました。これにより、さまざまなデバイスやプラットフォームでさまざまなフォントを使用できます。 これは、Web開発で使用できる非標準フォントのオープンアーカイブのようなものです。実際、世界中の約40万のサイトで、1日あたり1700万のリクエストが生成されています。 このプロジェクトのおかげで、ブロガーの下書き（draft.blogger.com）で、ブログをデザインするための40もの異なるフォントを見つけることができます。 そしてこれはほんの始まりに過ぎません:)
新しいフォントを選択するには、[デザイン]セクションに移動し、[テンプレートデザイナー]を選択します。 メニューの最後の項目「詳細」には、フォントを選択できる一連のページ要素が含まれています。 これは、ブログのタイトル、説明、投稿のタイトル、またはテンプレート要素にすることができます。 Reenie Beanie、r Neucha（キリル文字）、GFS Didot（ギリシャ語）、さらにはHanuman（クメール語）など、さまざまな国のブロガーが選択できるフォントは本当にたくさんあります。 ちなみに、6つのWebフォントのセット全体のうち、キリル文字をサポートしているので、拡張することがたくさんあります:)
追伸 歩哨。 ちなみに、ウェブマスターに人気のあるフォーラムでは、サイトのPRユニットを決定できるようになりました。ウェブマスターのサービスをご覧ください。
首都を数日間訪問したり、ここに住むために引っ越したりする人のために、モスクワのアパートを手頃な価格で低価格で借りる必要があります。多くの提案があります。
TemNovaビューティーサロンでは、クラシック、ヨーロピアン、コンビネーションペディキュアなど、あらゆるタイプのペディキュアを提供しています。
親愛なる読者とブログのゲストの皆さん、こんにちは！ 今日は、サイトにフォントを追加する方法を説明します。より正確には、お気に入りのブログに非標準の一意のフォントを追加する方法を説明します。
一般に、非常に多くのフォントがありますが、Webサイトでは、数十の標準フォントしか使用されていません。
標準フォントは、世界中のすべてのオペレーティングシステムとブラウザで一貫して表示されることが保証されているフォントです。
標準フォントの例：
Arial
ヴェルダナ
タホマ
ルシダ
トレビュシェットMS
タイムズニューローマン
ジョージア
パラティーノライノタイプ
Comic Sans MS
ヘルベチカ
クーリエ新品
その他。
非標準フォントは、すべてのブラウザで正しく表示されることが保証されているわけではありません。 しかし、それらの中にさえ、人気のあるブラウザやオペレーティングシステムをサポートするものがたくさんあります。
私の場合のように、面白いフォントを見つけてブログにインストールしたいと思うことがあります。 Mistralフォントが気に入りました。これは、ブログのヘッダーに表示されます。
非標準フォントの名前をCSSで書くだけでは、機能しません。 スタイルで書かれたメインフォントに変換されます。 非標準フォントを表示するには、次のものが必要です。
1.ttf形式のフォントを見つけてダウンロードします。
検索バーに「フォントのダウンロード」と入力し、好きなものを選択します（フォントがキリル文字をサポートしていることを確認してください）。
2.FTP経由でフォントファイルをブログのテーマフォルダにアップロードします。
つまり、フォントパスは次のようになります。
sait.ru/wp-content/themes/mytheme/3893.ttf
3.style.cssファイルでフォントへのパスを指定します。
この小さなコードを貼り付けるだけです。
@ font-face（font-family：Mistral; / *フォント名* / src：local（ "Mistral"）、/ * OSで指定されたフォントをチェック* / url（/ wp-content / themes / mytheme / 3893。 ttf）; / *フォントへのパス* /）
操作を実行すると、フォントはサイトで機能します。
もちろん、非標準フォントには小さな欠点があります。 ユーザーのOSでサポートされていない場合、ブラウザはフォントフォルダに追加のリクエストを送信します。リクエストが多いほど、ブログの読み込みが遅くなることは周知の事実です。 今のところダウンロードに特別な変更はないので、とりあえずそのままにしておくことにしました。
プラスの中でも、もちろんオリジナリティです。 標準フォントは誰もが使用しているので、それは良いことです。 それらはシンプルで理解しやすいですが、場合によっては、少しの創造性が損なわれることはありません。 たとえば、サイトに興味深いフォントを追加することで、すべての記事のタイトルをオリジナルにすることができます。
最後に、手が届きました、 サイトヘッダーのフォントを変更する方法..。 私は複雑なものは好きではないので、常に可能な限りすべてを単純化します。 私はあなたにあなたのサイトのタイトルのフォント、サイズと色を変えるためにhtmlの方法の深い知識を必要としない簡単で速いそしてあなたに提供します。
エディターにたった3行で、サイトでのあなた自身の創造性から本当の喜びを得るでしょう。 さらに、無料のテンプレートを使用すると、サイトは個々の機能を取得し始めます。
よくわからない方への注意事項
- まず、決めましょう。 WordPressのテーマ（テンプレート）について話していること。 ブログのテーマがこのエンジンに設定されている場合、この記事はあなたにぴったりです。
- 自分の能力がわからない場合は、最初にテストサブドメインで実験するのが最善です。 作業能力があることを確認したら、スキルをメインサイトに移すことができます。 ただし、 サイトヘッダーのフォントを変更するとてもシンプルなので、台無しにするのは難しいです。 個人的に、私はいつも最初にテストですべてをします。 もう少し時間がかかりますが、信頼性は高くなります。
- それでもサイトが壊れている場合は、\u003e\u003eをお読みください。 しかし、すべてが注意深く行われれば、災害は起こりません。
コード行は、テンプレートごとに異なって見える場合があります。 テンプレートがどのように機能するかを明確にするには、の記事を参照してください。 コードの行を見つける方法についての詳細なビデオがあります。その後、Webサイトテンプレートにほとんどすべての変更を加えることができます。 このスキルにより、コードを探し回る必要がなくなり、手を解放できます。
自分で理解できず、コードを理解している優れたフリーランサーを見つけたい場合は、記事に、何かが起こった場合にどこを向いたらよいかという便利なリンクがあります。
サイトヘッダーのフォントを変更する手順
そして、それを理解する時間がないが、もっと速くしたい場合は、すべてについて、私たちのウェブサイトとワードプログラム（フォントを選択するため）が必要です。
- 当サイトの管理パネルに入ります。 さらに、左側のサイドバーに コンソール-外観-エディター.
- 右側にあります スタイルリスト（style.css） そしてそれを開きます。
- サイトヘッダーはヘッダーh1です。 最初の方にあります。 目で見ないようにするには、Ctrl + Fを押すと検索バーが表示されます。 検索を入力します。 この部分は私には次のように見えます：
上の正方形： フォント変更行。
下の正方形： フォントサイズ変更行。
後で、必要に応じてフォントのサイズと色を変更します。
サイトヘッダーのフォントを変更する方法
- 次に、空白のWord文書を開き、サイトのメインページのタイトルをコピーしてWord文書に転送し、それを選択して、さまざまなフォントでの再生を開始します。 それらは左隅のトップパネルにあります。 あなたの名前のフォントのすべての変更がすぐに表示されるので、なぜこのプログラムでそれを行うのが便利なのですか？ サイトの名前に一致するフォントを選択してください。 あなたが間違いなく好きになるフォント。 選択したら、フォント名をWordeにコピーします。
- サイト管理パネルに戻ります。 フォントを変更する行（図では上部の青い四角）に、デフォルトのフォントではなく、選択したフォントの名前を入力します。
- ページの下部にある[ファイルの更新]をクリックします。
- サイトにアクセスして、フォントが一般的なコンテキストにうまく適合するかどうかを確認します。 そうでない場合は、Wordに戻って別のWordを選択してください。 すべて。
サイトヘッダーのフォントサイズを変更する方法
これは、同じエディターテンプレートで実行されます。 上の写真は2番目の青い正方形です。 他の数字を入力するだけで、必要なものに応じてフォントが大きくなったり小さくなったりします。 変更を保存し、サイトにアクセスして、すべてが適切かどうかを確認します。
サイトヘッダーのフォントの色を変更する方法
これは同じ場所で行われます。 フォント自体とそのサイズを変更したブロックの次のブロックに行があります。 これは次のようになります。
色を選択するには、次のテーマオプションのいずれかを使用できます。 コンソール-外観-背景..。 「背景色」の行で、色を選択し、その英数字の値をコピーして、以前の色の代わりに貼り付けることができます（私の場合は＃11006a）。 変更内容を保存。 私たちはそのサイトに行き、賞賛します。
する フォント、色、サイズを変更する、エディタのわずか3行で変更を加える必要があります。 少しのスキルで、それは非常に短い時間しかかかりません。
素敵で読みやすいタイトル、
テーマの一般的な精神と一致して、
あなたのブログをより魅力的で思い出深いものにするでしょう。
実験して、好きなものを選んでください！
追伸 念のため、テーマエディタファイルに少しでも変更を加えると、変更したテキストをすべてメモ帳にコピーします。つまり、サイトにインストールされているテーマのzipが保存されているフォルダにコピーします。 サイトが突然壊れてテーマを再インストールする必要が生じた場合に備えて、自分の好みに合わせて変更したすべてのファイルを保存しました。 ホスティング上の適切なフォルダにファイルを転送するためにワードプレスまたはテーマを再インストールする場合にのみ残ります。
次の記事では、ブログを変換する過程で、背景色、見出しの見出しフォント、記事、リンクの色、つまり任意の要素を簡単に変更します。
良い一日、親愛なる読者。 今日は、非標準のキリル文字フォントをサイトにインストールする方法の1つについて説明したいと思います。 この方法は、Bloggerのブログを含むすべてのサイトに適しています。 この方法は多くの英語サイトでうまく使用されており、プレミアムWordPressおよびJoomlaテーマで積極的に使用されています。
なぜなら 私の読者のほとんどはBloggerとWordPressでブログを書いていますが、そのようなブログにカスタムフォントをインストールする方法を紹介します。 さらに、Bloggerで説明されている方法は、あらゆるサイトに適しています。 そしてWordPressには既製のプラグインがあります。 ただし、記事をスクロールして対応する説明tkに移動することはお勧めしません。 このメソッドのすべての知識は、プラグインを構成するのに役立ちます。
現時点では、これは非標準のキリル文字フォントをサイトにインストールする最も一般的な方法の1つだと思います。まず、インストールが簡単で、次に、さまざまなブラウザーでサポートされているためです。
もう十分興味をそそられましたか？ 詳細に取り掛かる時が来ました。
したがって、このメソッドはCufonと呼ばれます。 これは、1人の開発者であるSimoKinnunenによって発明されました。 最初に、彼はサイトに接続する必要がある特別なファイルを作成しました。 次に、彼は任意のフォントをJavaScriptに変換するジェネレーターを作成しました。
メソッド自体はとてつもなく単純であり、これについては後で説明します。 ここで最も難しいのは、適切なフォントを見つけることです。 また、PhotoShopなどのグラフィックエディタのアクティブユーザーではない多くの人は、ジェネレータにロードするフォントとそのようなフォントの入手先がわからないと確信しています。 これについてもっと詳しく話すことにしました。
特定のフォントのセットが、同じWordや他のプログラムの任意のコンピューターにインストールされていることは周知の事実です。 また、任意のプログラムを含め、コンピューターに新しいフォントを個別にインストールすることもできます。 これを行うには、検索エンジンのいずれかにフレーズを入力する必要があります キリル文字のフォントをダウンロードする 見つかったフォントが.ttf形式であることを確認してください。
好きなフォントを.ttf形式でダウンロードしたら、開くだけでコンピューターにインストールできます。
または、マウスの右ボタンを使用して[インストール]コマンドを選択します。 この手順の後、フォントは、通常提供されているコンピューターにインストールされているすべてのプログラムに表示されます。 それら。 それ以上のアクションは必要ありません。 説明されている方法は、Windows7で動作することが保証されています。
3つのステップでサイトにキリル文字フォントを完全にインストールする
それで、私たちは美しい非標準のキリル文字フォントの所有者になり、それを私たちのウェブサイトにインストールしたいと思っています。 私たちの行動は何ですか？
ステップ1
CufonのWebサイト（cufon.shoqolate.com）にアクセスします。
メニューのリンクをクリックします-ダウンロード。 スクリプトのあるページが開きます。 すべてのコードをコピーしてメモ帳に貼り付け、.js拡張子を付けて保存するだけです。 私の読者のために、私は既製のファイルを用意しました、あなたはそれをあなたのコンピュータにダウンロードすることができます。
2011年7月26日に投稿を書いた時点で、スクリプトのバージョンは1.09iであることに注意してください。 上記のリンクにあるのはこのバージョンです。
スクリプトをホスティングにアップロードします。 Bloggerでブログを書いている人は、サードパーティのファイルをアップロードする場所をすでに知っているはずです（）。私はこれにGoogleサイトを使用しています。
ステップ2
CufonのWebサイトの[ジェネレーター]タブに戻ります。 私たちの前には、多くの設定があるページがあります。 正直なところ、すべての設定に入るわけではありませんでしたが、実験中に別の設定を試してみたところ、常に望ましい結果が得られました。
ただし、いずれにせよ、重要なポイントに注意を引くために、基本設定を含むスクリーンショットをいくつか用意しました。
ご覧のとおり、フォントの種類ごとに個別のブートウィンドウがあります。
- 通常のフォント
- 太字フォント
- 通常のイタリック
- ボールドイタリック
理由はよくわかりませんでしたが、説明がフォントの特徴である場所に正確にダウンロードしました。
たとえば、スクリーンショットは手書きフォントの読み込みを示しています。 彼は傾いていて、十分に栄養を与えられています:)。
次に、使用許諾契約のあるフィールドが強調表示されます。 必ずチェックボックスをオンにして、ダウンロードしているフォントがこのフォントの開発者によってWeb上で使用されることを許可されていることを確認する必要があります。 残念ながら、これは微妙な質問です。インターネット上のさまざまなフォントの中で、使用できるフォントと使用できないフォントを正確に把握していません。 したがって、この点は完全にあなたの良心にあります。
次のスクリーンショット。
- 最初のフィールドには、大文字と小文字、および数字と句読点を表示する必要があることを示しています。
- 2番目のフィールドはデフォルトでチェックされていますが、削除しようとはしていません。
- 3番目のフィールドでは、必ずキリル文字とロシア語のアルファベットを選択してください。
1行を青色で強調表示しました。ここでは、WordPressのフォントを生成する人がチェックボックスをオンにしています。
そして最後の設定。
- 最初のウィンドウには何も書きませんでしたが、フォントが使用されるドメインを指定するという観点からは、このフィールドは便利だと思います。他のドメインでは機能しません。
- 私が理解しているように、一番上のフィールドはデフォルトのフォントサイズについてです。 設定に同意するか、チェックボックスをオンにして拒否することができます。 個人的には、さまざまな方法で試しましたが、両方のオプションに満足しました。 フォント自体とテンプレートデザイナーのアイデアの両方にも依存すると思います。 ウィンドウ2の次の項目では、小さいフォントサイズを使用する場合は、ジェネレータ自体で無効にすることをお勧めします。 可能であれば最後のチェックボックスをオンにすることをお勧めします。 この設定のおかげで、生成されるファイルは小さくなり、間違いなくフォントの読み込みに良い影響を与えます。
- そして最後のものは、発電機の使用条件との合意です。
その結果、別のファイルを取得し、それもホスティングにアップロードします。
ステップ3
終了タグの前にサイトテンプレートファイルで指定する必要があるのは1つだけです。 このようなコード：
コードからわかるように、フォントをh1見出しタグに適用しています。 したがって、キリル文字フォントが表示されるように、他のタグを指定できます。
タグではなく識別子を指定することもできます。
しかし、それだけではありません。 1つのサイトで一度に複数の異なるフォントを使用する場合は、すべての新しいフォントについて、手順2を実行し、それらすべてを示します。
フォントのスペルがわからない場合は、手順2で生成された対応するファイルを開いて、必要な情報を見つけてください。 
青で強調表示されているのはフォントの名前です。
ですから、私のテストブログの1つでは、もともとはこのようなものでした。
そしてそれはこのようになりました：
WordPressにカスタムキリル文字フォントをインストールする方法
WordPressユーザーにとってはまだはるかに簡単です。 もちろん、説明されているすべての方法を実行でき、フォントも機能しますが、All-in-OneCufonと呼ばれる既製のプラグインもあります。 プラグインは、開発者のWebサイトからダウンロードすることも、ブログの管理パネルから直接ダウンロードすることもできます。
プラグインをインストールします。 アクティベートします。 プラグイン設定に移動します。 一番上には2つの警告メッセージがあります。
1つ目は、wp-content / plugins /ディレクトリにcufon-fontsフォルダを作成する必要があるということです。 これを行うには、FTP経由で接続するか、ホスティングコントロールパネルに移動して、pluginsフォルダーにcufon-fontsという名前の新しいフォルダーを作成します。 その後、最初のメッセージが消えます。
2番目のメッセージは、生成されたフォントファイルを作成されたフォルダーに配置する必要があることを示しています。これはステップ2で受け取ったものと同じファイルです。ファイルをロードするとメッセージが消えますが、フォントは設定で下に表示され、プラグインが「表示」します。 "。
テンプレートで使用するフォントの横にあるチェックボックスをオンにすることを忘れないでください。 しかし、フォントはまだ機能していません。 以下にCufonCodeフィールドがあり、このフィールドにキリル文字フォントを適用するタグを指定する必要があります。 この場合、他の指定なしでベアコードを指定する必要があります。
Cufon.replace（ "h1"）;
ちなみに、キリル文字が書かれていないのに、非標準フォントでWordPressテーマをインストールした場合は、次のものが必要です。
- オールインワンCufonプラグインをインストールします。
- 生成されたフォントをインストールします。
下のフィールドにCufonコードを入力する必要はありません。原則として、このコードはすでにテンプレートに記述されています。 上記の例で書いたように、既存のフォントに加えて別のフォントをインストールする場合は、そのようなエントリを作成する必要があります。
非常に重要な注意事項。
私の記事に従ってテンプレートのヘッダーを最適化した場合は、非常に注意する必要があります。 覚えているかと思いますが、メインページを除くすべてのページで、ブログのタイトルはタグに含まれています （リンク内）。 この特定のタグにIDまたはクラスを割り当てる必要があります。次に例を示します。
