Discordコミュニティを作りました! 参加する

フォーラム

トピックを立てる前にチェック
  1. フォーラムガイドライン」に必ず目を通してください。
  2. バージョンアップデート後に表示がおかしくなった場合は、
    「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。
  3. フォーラム内検索で過去に同じようなトピックがないか検索してみてください。
SWEELのフォントを変える方法
 
通知
すべてクリア

SWEELのフォントを変える方法

10 投稿
5 ユーザー
2 Likes
1,048 表示
japgdapgawn
(@japgdapgawn)
投稿: 3
メンバー
Topic starter
 

選択肢以外のフォントを表示させるために追加CSSからfont-familyでフォントを指定したのですが反映されませんでした。

どのように改善すればフォントを変更できるでしょうか。

*{
	image-rendering: crisp-edges !important;
	font-family: Helvetica ,Roboto  Hiragino Sans, BIZ UDPGothic !important;
}
確認項目
利用規約に同意します*, ガイドラインを読み、内容を把握しています*, よくある質問を先にチェック済みです*, 過去に同じようなトピックがないか検索済みです*, WordPress更新後、SWELLは最新版にしましたか?, Googleなどでも検索してみました, プラグインを停止しても同じことが起こることを確認しました, 自分で追加したコードに問題がないかチェック済みです
問題が確認できるページのURL
利用中のSWELL本体のバージョン
2.7.4
利用中のPHPバージョン
8.1
OS
Windows,Android
利用中のWordPressバージョン
6.2
利用中のサーバー会社
ConoHa WING
ブラウザ
Chrome,Edge
利用中のプラグイン一覧

Contact Form 7
Converter for Media
Flamingo
Flying Scripts
Highlighting Code Block
No Right Click Images Plugin
Presto Player
SEO SIMPLE PACK
SiteGuard WP Plugin
WP Super Cache
WP-Optimize - Clean, Compress, Cache
XML Sitemap & Google News
WP Super Cache

 
投稿済 : 01/04/2023 10:51 pm
トピックタグ
山本大介
(@b4rskbe5)
投稿: 124
メンバー
 

Web フォントを読み込まないと基本的には表示されません。

あと、スペースのある書体名は引用符で囲みましょう。

お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン

 
投稿済 : 02/04/2023 11:15 am
reacted
japgdapgawn
(@japgdapgawn)
投稿: 3
メンバー
Topic starter
 

Webフォントではなくシステム標準のフォントを読み込もうとしています。

また、引用符で囲んでも適用されませんでした。ほかの改善策はありますか?

 
投稿済 : 02/04/2023 10:05 pm
skillsharejp
(@skillsharejp)
投稿: 941
SWELL高速化顧問
 
投稿者:: @japgdapgawn

BIZ UDPGothic

これってググるとGoogleフォントなので、システムフォントではないと思うんですよね・・・

山本さんも善意でご助言されてますが、一応ガイドラインに照らし合わせるとフォーラム対象には該当しないので、

  • WordPressのユーザーフォーラム
  • ChatGPT

のいずれかに聞いてみるのが良いかもしれません。

引き続きこちらで回答がある場合はユーザー同士の助け合いということでお願いします。

SWELLフォーラムはユーザーフォーラムのため、開発者以外の回答は全て任意です。当アカウントによる回答もボランティアのため、ヒントの提供に留まる場合があります。

ご依頼のご相談・お問い合わせ窓口
https://skillshare.biz/inquiry/

 
投稿済 : 02/04/2023 11:48 pm
山本大介
(@b4rskbe5)
投稿: 124
メンバー
 

Helvetica で表示したいという意図ではないのでしょうか?
違う場合はどういった意図でそのコードを追加しているのか補足が必要です。たぶんこうしたいんだろうな~というのは推測できますが、私個人の推測でしかありません。

また問題を確認している環境に Windows / Android と書かれていますが、これらの環境ではデフォルトでは Helvetica はインストールされていません。システムフォントとして Helvetica があるのは MacOS です。(ちなみにですが、Helvetica という指定では表示されません)

Roboto は Android の標準フォントですが、カンマが正しい位置にないため認識されないのだと思います。

具体的なコードは本フォーラムの範囲を超えるため控えさせていただきます。

フォント周りの設定はややこしいので理想とするフォントが表示されるように頑張ってみて下さい。

This post was modified 12か月前 by 山本大介

お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン

 
投稿済 : 03/04/2023 6:31 pm
japgdapgawn
(@japgdapgawn)
投稿: 3
メンバー
Topic starter
 
image

カンマの位置はこちらにコピーする際にずれたようで位置は大丈夫でした。

まず、BIZ UDP GothicはWindows10に標準搭載されているフォントです。Windows 10 October Updateで新たに採用されたらしいです。Google FontsにもBIZ UDP Gothicがありますが私の場合はWindowsユーザー向けに"BIZ UDP Gothic"を指定しています。

WindowsにHelveticaはインストールされていないとおっしゃっていますが、WindowsではHelveticaがインストールされていない場合Arialに置き換えられます。そのためHelveticaという表示だけにしていました。

また、fast.comなどのサイトではHelveticaという指定で正常にHelveticaフォントが表示されています。この表記に問題はないはずです。

image
image

 そこまでしてもfont-familyはvar(--swl-font-family)が適用されてしまい、フォントが表示されません。

image

この--swl-font-familyを何とかすることができないかを考えています。どうすればよいでしょうか。

 
投稿済 : 04/04/2023 3:12 pm
skillsharejp
(@skillsharejp)
投稿: 941
SWELL高速化顧問
 
投稿者:: @japgdapgawn

この--swl-font-familyを何とかすることができないかを考えています。どうすればよいでしょうか。

ここを最初に書いておくと一般的なWPの質問だから、ここでは対象外って判断されるのを回避できます。SWELLフォーラムなので、SWELLに限定した状況で発生しているという詳細を記載しておくのがとても大切です。

SWELLフォーラムはユーザーフォーラムのため、開発者以外の回答は全て任意です。当アカウントによる回答もボランティアのため、ヒントの提供に留まる場合があります。

ご依頼のご相談・お問い合わせ窓口
https://skillshare.biz/inquiry/

 
投稿済 : 04/04/2023 5:50 pm
山本大介 reacted
山本大介
(@b4rskbe5)
投稿: 124
メンバー
 

どのデバイスに対して何を適応したいのか、どういった意図があるのか、を説明すればよいと思います。

実際に書いているコードすらも間違っていたということですとこちらでは意図を理解しかねます。
正しく、どんな問題が発生して、どのようにしたいのかを説明することが大事です。

それを踏まえて、どのデバイスに向けてどのフォントをどういった優先度で表示したいのかを説明すると回答が付くかもしれません。

CSS の書き方についてはこのフォーラムでは範囲外と理解しているため私の方からは控えさせて頂きます。

This post was modified 12か月前 by 山本大介

お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン

 
投稿済 : 04/04/2023 6:24 pm
しらこ
(@96ssbike)
投稿: 826
メンバー
 

「CSS 上書き」で検索して調べて改善してみると良いと思います。

SWELLカスタマイズ向けの非公式サイトを作りました。何か見つかるかも?→ https://tecchan.jp/swell-tips/
上記以外のWordPress全般向けのナレッジはこちら→ https://tecchan.jp/
疲れたら癒やされてくださいにゃーん (ΦωΦ)

 
投稿済 : 05/04/2023 4:42 am
了
 
(@loos_ryo)
投稿: 1248
メンバー Admin
 

これってお使いの環境でBIZ UDPGothicにならないってことですか?

いただいている下記のコードでMacはフォントがちゃんと変わってます(多分Hiraginoになってる)ので、BIZ UDPGothic に関する書き方がなにか間違えているのかもしれません。試しにメイリオなど別フォントにしてCSSが当たるかどうかをまずは確認したりしてみてください。

 

*{
	image-rendering: crisp-edges !important;
	font-family: Helvetica, Roboto, Hiragino Sans, BIZ UDPGothic !important;
}

また、一応お使いのPCにBIZ UDPGothicがインストールが再度確認してみてもいいかもしれません。

SWELL開発者です。

 
投稿済 : 05/04/2023 2:57 pm
共有: