フォーラムをリニューアルしました!
今後は、新フォーラムをご利用ください。
XserverのWEBフォントが反映されない < SWELLに関する質問
https://u.swell-theme.com/community/postid/8655/
↑こちらの記事も参照しましたが、設定方法などがよくわからなかったので、あらためて質問させていただきます。
Xserverのserverパネルで、WEBフォントを有効にしました。
「TypeSquare Webfonts for エックスサーバー」を有効にして設定もしましたが、WEBフォントが反映されません。
記事投稿画面の右側の「ブロック」の設定項目にもフォントを選択するような項目もありませんし、SWELL の
[カスタマイズ] → [サイト全体設定] → [基本デザイン] → [フォント設定]
にも、WEBフォントを選択できるような項目はありません。
「TypeSquare Webfonts for エックスサーバー」プラグインでフォントを変更しても、ブログ記事には反映されません。
どのような設定または、操作をすれば、WEBフォントを利用できるようになるのでしょうか?
ご存じの方がいらっしゃったら、教えてください。
よろしくお願いします。
設定に関しては、以下のマニュアルを参考にしました。
私は、あの後でエックスサーバー側の設定を戻した事で、h2などの部分のWEBフォントは再現するも本文と言うかpタグはWEBフォントが当たりませんでした。
ただ、私は題名にWEBフォントが当たれば良かったので、その先は気にしませんでした。
ページ全体にWEBフォントになると遅くなっても困るので。
しかしながら、pタグの中にWEBフォントが当たらない事は気になってはおりました。
私だけの環境問題かな?と思ってましたが、そうでも無さそうですね。
この件について書いた本人です。
大変申し訳ございませんが、このプラグインについてはこちらでサポートできません。「サポートできない」の旨は、以下の2つのスレッドを参照してください(SWELLの利用規約にも記載しています)。
https://u.swell-theme.com/community/postid/8206/
https://u.swell-theme.com/community/postid/8213/
このプラグインを有効にすると、以下のようなCSSを吐き出すみたいです(併せて、Webフォント自体を読み込むコードも必要です)。
<style type='text/css'>h1,h2,h3,.entry-title{ font-family: "新ゴ B" !important;}h4,h5,h6{ font-family: "新ゴ B" !important;}.hentry,.entry-content p,.post-inner.entry-content p{ font-family: "新ゴ R" !important;}strong,b{ font-family: "新ゴ B" !important;}</style>
このプラグインが、いくつかのテーマで適合するかどうかを軽く検証したとことろ、
適合する(CSSルールが同じ):
Twenty Twenty-One(公式ディレクトリ登録テーマ)
適合しない(CSSルールが異なる):
SWELL
Arkhe(公式ディレクトリ登録テーマ)
Snow Monkey
Astra(公式ディレクトリ登録テーマ)
と、対応しているほうが少ないです。
といっても、完全な対応を確認したわけではなく、軽く実際のサイト+デベロッパーツールで構造を目視確認した程度なので、詳しくはご自身で対処ください。
したがって、もしもサポートを要求されるようでしたら、こちらのプラグインのフォーラムにご要望いただければと思います。
https://wordpress.org/support/plugin/xserver-typesquare-webfonts/
先日、プラグインを使用しないで実装する方法を提示したのは、このプラグインを使用するとこうなることがわかっていたので書いてみました。細かく融通はきかないと思いますが、書いた以上のことをやりたい場合はご自身で実装してください。
にゃーん .
> h2などの部分のWEBフォント
ほんとですね。
あらためて見直したら、仰るとおりに h2 には反映されていました。
本文などにも反映されると嬉しいんですけどね。
みなさまからの追加情報、お待ちしています。m(__)m
自己解決しました。
momoさんのコメントが参考になりました。
[TypeSquare Webfonts Plugin for エックスサーバー]の設定で、
[上級者向けのカスタマイズ] → [本文タグ]
に、“,P” を追加することで、本文にもWEBフォントが反映されました。
momoさん、しらこ さん、ありがとうございました。
@powan あっ、そのプラグインそういう機能あったんですね…!
CSSのクラス名変更できるのであれば素晴らしいプラグインです。
たとえば、
- .entry-title (投稿タイトル) → .c-postTitle__ttl
- .entry-content p (コンテンツのpタグ) → .l-mainContent p
に置き換えて画像のとおりになりました。
カンマ+半角スペース(, )で区切って、.post_content pも追加しても良いかもしれません。
※pのままでも良いかもしれません。
画像が実際にやってみたやつです。
SWELLでどういう風にするのがベストかは細かく見ていないので、軽くやった程度です。
にゃーん .
Powanさん、しらこさん、三人寄れば文殊の知恵ですね。
このスレッドは、本来は、swellフォーラム対象外と言うことは認識してましたが、こう言う形で素晴らしい解決に至ったことが嬉しいですね。
他社提供プラグインとテーマの相性問題は、WordPressの世界に限らず、自動車業界、パソコン業界など世の中に多い複数社が絡んだ問題というケースですよね。
相談窓口が二股になってしまうので、どちらにも相談する事が難しく自己解決するしかないケース。
(他社の作る製品の内部まで知らないのは当たり前なので、複数社が関わるとこうなるのは避けられない)
今回は、たまたま自己解決能力の高いPowanさんがスレ主さんだったので、便乗した私もラッキーな解決方法を得ることができました。
そして、しらこさんもサポート外の事なのに、代替案の提示などのお手数をかけたサポートでありがとうございました。大元の記事が私発信だったので感謝しております。
WordPressはプラグインで機能追加できるのが売りですが、サポートが受けにくくなるので、私レベルだと了さんが作者になっているプラグインとswellだけで完結させるサイト運用が良いのかも知れない。
と改めて痛感してます。一番良いのは自分がレベルアップしてしまえば良いんですけどね(笑)。
しらこさん以下の部分を保存版にさせて頂きました。
メインの業務サイトでは基本WEBフォントは使わない(スピード重視)予定ですが、趣味のブログの方ではこれで雰囲気を楽しく出来そうです。嬉しいです。
---------
- .entry-title (投稿タイトル) → .c-postTitle__ttl
- .entry-content p (コンテンツのpタグ) → .l-mainContent p
に置き換えて画像のとおりになりました。
カンマ+半角スペース(, )で区切って、.post_content pも追加しても良いかもしれません。
※pのままでも良いかもしれません。
@96ssbikeさん
ブログ記事の公開楽しみにしております。