しばらく前にしたクライアントが WordPress サイトに顧客が希望するフォントをインストールして適用したクロムはよく表示されますIEで正常に出てこないながら問題の解決を要請しきました。
特殊なフォントをインストールしてロードするとサイトの速度もどうしても影響を受ける可能性があるので、あえてそうする必要があるかと思ったが、顧客が特定のフォントを指定して「タイトルにそのフォントを使用してください」としたので、無条件にそのフォントのみ使用が可能だとね。
インターネットからダウンロードしたウェブフォントを持ってインターネットに記載されているソリューションを検索して適用してみても問題が適切に解決されていない。 なぜクロムはされているためにIEはないでしょうか? おそらくインターネットエクスプローラがwoff2フォーマットをサポートしていないために発生する問題のようです。
IEがwoff2フォーマットがサポートしていないために発生する問題なので、IEがサポートするwoff形式のフォントを使用すると解決されます。 (woffはIE9からサポートします。)となっており、開発者コミュニティでもインターネットエクスプローラに対応しない傾向です。
[この記事は2022年8月24日に最終更新されました。 ]
WordPress テーマ/ページビルダーが提供するカスタムフォントオプション
一部の有料テーマやページビルダーは、有料または無料のハングルフォントをアップロードして適用するオプションを提供しています。
たとえば、ベストセラーのテーマである Avada「カスタムフォント」セクションにカスタムフォントをアップロードできます(「Avada テーマカスタムフォントを適用する方法"参照)。
エレメンタープロ(Elementor プロ)でもカスタムフォントを登録して使用できる機能を提供します。
テーマまたはページビルダーにカスタムフォントをアップロードする機能が提供されている場合は、別のプラグインをインストールする必要なく、テーマまたはページビルダーが提供する機能を利用できます。
ユーザー定義のフォントプラグインUse Any Font
そうするうちに Use Any Fontというプラグインを使用してフォントをロードして設定してくれるので、問題が解決されました。
希望のフォントを埋め込みして使用することができ、特別なCSSは必要ありません。 フォントがttf、otf、woff形式のいずれかされているプラグインをインストールして使用が可能です。
プラグインのサイトで説明している特徴をざっとまとめてみると、:
- 迅速かつ簡単に設定します。 CSSの知識不要
- すべての主要なブラウザのサポート:IE 6以上、Firefox、クロム、サファリ、iOS、アンドロイド、オペラなど
- プラグインインターフェースフォントアップローダでフォント変換
- アップロードされたフォントをEditorですぐに使用
- ttf、otf、woffなどのフォント形式をサポート。 必要なフォントが自動的に変換され
- 最大15MBフォントファイルを使用可能
- @ font-face CSSを使用してフォント埋め込みます。 SEOフレンドリー、高速読み込み
- 複数のフォントを使用可能
- ユーザーのサーバーにフォントが保存されるため、ロード時間が速い
APIキーを取得しなければ、プラグインメーカーのサーバーに接続してフォント変換が可能です。 フォントがブラウザに応じて適切に適用されない場合は、このプラグインを使用すると、意外に問題が解決することができます。
無料版を使用すると、単一のフォントを変換することができます。 2つ以上のフォントを適用するには、有料版を利用してください。 このプラグインを使用して WordPressユーザーフォントをアップロードして適用する方法を次の記事で参照してください。
参考までに、より洗練された機能にフォントを管理したい場合 FontPressという WordPress フォント管理プラグインを使用してみることができます。
こんにちは。
上記の fontpress を使用すると
スピードを落とさずに共有ゴシックフォントをアップロードして使用できますか?
フォントをインストールすると速度に影響を与えるようです。
フォントをwoff2形式に変換してアップロードし、enquque方式でフォントをロードすると速度の影響を最小限に抑えることができるようです。
例えば、 チャイルドテーマをインストールしてフォントをアップロードしたら、チャイルドテーマ内の関数ファイルに次のコードを追加します。
function custom_fonts() {
wp_enqueue_style('custom-font', get_stylesheet_directory_uri() . '/fonts/your-font-name.woff2', array(), null);
}
add_action('wp_enqueue_scripts', 'custom_fonts');
スタイルシートファイル(style.css)に次のコードを追加してみてください。
@font-face {
font-family: 'YourFontName';
src: url('fonts/your-font-name.woff2') format('woff2'),
url('fonts/your-font-name.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* Applying the font to elements */
body, h1, h2, h3, p {
font-family: 'YourFontName', sans-serif;
}
うまくいくかどうかテストしてみてください。
上記のコードは単なる例なので、適切に適用してください。
答えてくれてありがとう!
もしこのサイトも上記の方法でフォントを変更されたのでしょうか?
このブログにはカスタムフォントは使用されておらず、テーマ設定値をそのまま使用しています。 プラグインを使用してGoogleフォントを無効にしました。
質問が頻繁に申し訳ありません。
私の場合 generatepress の基本システムフォントを使用すると、ハングルがとても奇妙に見えますが、今このサイトの場合、ハングルがウェブ上で見事に出ていて、 generatepressでこのサイトのように設定する方法はありますか?
こんにちは、WooKangさん。 質問はいつでも歓迎です。
この部分については、私が見て、別の文でまとめて上げることができれば上げてみましょう。 チュソクの休暇のため、少し遅れることがあります。
エゴ..ありがとうございます。 良い情報でたくさん助けています。 ありがとうございます!
エゴ..ありがとうございます。 良い情報でたくさん助けています。
誠にありがとうございます。
こんにちは。 Astraテーマとエレメントフリー版を cafe24 ホスティングセンターで利用中ですが、 cafe24にFTPでWebフォントファイル.woffをアップロードし、アストラショートコード、カスタムcssから読み込むため、複数のコードを試しても読み込まれません。 また hide my WP を活性化するので、それでも接続されていた FTP も接続できませんね。 ホスティングを転送する必要がありますか? 移動したら、現在作業中のファイルはFTPにクロールしてFTPにアップロードすればよいでしょうか? 頭が痛い..助けてください
プラグインを有効にしてもFTPに接続できない現象は発生しません。
他の原因としてFTPに接続できないでしょう。
フォントの場合は、次の記事を参照してプラグインでお試しください。
https://www.thewordcracker.com/basic/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4%EC%97%90%EC%84%9C-%EC%82%AC%EC%9A%A9%EC%9E%90-%ED%8F%B0%ED%8A%B8-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0/
cafe24 ホスティングはmy wp gost liteプラグインの初期化後に削除、エレメントの更新、エレメントツール-設定の初期化-ブラウザの強力な更新-クッキー、データの削除-強力なリフレッシュ後に再起動するかどうか単に時間が経過したかどうか私が最初に何が間違っていたはわからなくてもうまくいきましたね、エレメントエディタもダメだったのに制限メモリ512MBに変更(wp_config.php修正)して解決しました。 そのプラグインは1つ以上について有料なので、さまざまなスタイルのために知らせていたのですが、もしcss、phpで解決する方法がありますか?
エレメンページビルダーの場合はリソースが高いため、リソースが低いとエラーが発生する可能性があります。
Webフォントのロード方法については、次のhappistの投稿を参照してください。
https://happist.com/523999/xe-tips%EB%82%98%EB%88%94%EA%B3%A0%EB%94%95%EC%9D%84-%EA%B0%80%EC%9E%A5-%ED%9A%A8%EC%9C%A8%EC%A0%81%EC%9C%BC%EB%A1%9C-%EC%A0%81%EC%9A%A9%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95
こんにちは。 常に詳細なコンテンツも見ていただきありがとうございます。
相違ではなく、use any font関連です。
私有料で購入し、メニューなどのフォントを適用しようとしたら、適用がだめお問い合わせメールを送り、返信が来たんです。 下custom element boxにコードを挿入するように見える、custom element boxが何でしょうか? (ここでのコードを配置する必要がする分からなく解決できずにいます)
--------------------
Please keep this in custom element box and assign font to it from Font assign tab。
ul.sf-menu li a
これで問題が解決するはずです。
こんにちは、Andrew様。 https://www.thewordcracker.com/basic/%ec%9b%8c%eb%93%9c%ed%94%84%eb%a0%88%ec%8a%a4%ec%97%90-%eb%82%98%eb%88%94%ec%8a%a4%ed%80%98%ec%96%b4%eb%9d%bc%ec%9a%b4%eb%93%9c-%ed%8f%b0%ed%8a%b8-%ec%a0%81%ec%9a%a9/ 文を参照してみていただけますか? Assign Fontセクションに見ると、下にCustom Elementsボックスがあるでしょう。 そこ入れればなります。
場合によっては、書体の読み込み速度が遅くページのコンテンツがロードされた後に、テキストがロードされる現象が発生することがあります。 フォントの読み込みのためにページの読み込み速度が遅くなる問題が発生した場合 Additional Settings(Usually not required) セクションで Use PHP uploader。 Need PHP Curl(PHPアップロードの使用。PHP Curlが必要) 項目をチェックすると、フォントが迅速にロードすることができます。 この機能を有効にするには、PHP Curlは、Webサーバーにインストールされている必要があります。