【Twenty Seventeen】PC 表示時に画像もコンテンツ幅一杯に表示させる方法

Twenty Seventeen 全体の幅を拡大したことに伴いコンテンツ幅も PC で見る場合に 525px から 640px に広がりました。ただ、アップロードする画像だけは相変わらず 525px のままで記事に比べて一回り小さいままで、イマイチ迫力に欠けるんですよね、、
今回はこれを手当てして画像もコンテンツ幅一杯に表示されるようにしました。

<AD/広告>

幅拡大前の幅で表示されるため、コンテンツ幅一杯に表示されない画像

まず、手当前の状態ですが、画像もコンテンツ幅一杯に表示させたいのですが、残念ながら何故か画像だけ 525px のままです、、 以下 ↓ はその様子の画像です。

上の絵にもある通り、画像の両端に余白がありコンテンツ幅一杯には表示されません。

そもそも大サイズが横幅一杯の 640px ではない

PC 表示時にコンテンツ幅一杯に画像を表示させようという場合にそもそも画像のアップロードや記事への挿入時の設定ですが、

大サイズの幅が 525px とサイト幅拡大前のままです。
このプルダウンで大サイズ 640 x 高さ と出てくれません。。。

フルサイズカスタムサイズ 640*400 も効果なし、、、

そこで画像のサイズをフルサイズにしたり、カスタムサイズで 640*400 をしたりしました。

が、結論としてはこれも効果がなく、最初の絵と同様に相変わらず画像は 525px 幅のままで、どうやら現状ではこれが精一杯のようです。。

サムネイル・中サイズ・大サイズのサイズ指定

画像のアップロードや設定でのサムネイル・中サイズ・大サイズのサイズ指定は、
設定>メディア 
のメディア設定で設定・変更できます。

実は画像のアップロード時には、フルサイズの画像と共にこれら各サイズの画像も併せて一緒に作成されています
当然、その分のサーバー容量を消費しますので、不要であれば上記のメディア設定でコピーを作成したくないサイズの幅・高さの上限をそれぞれ 0 にすると作成されなくなります。
上の例では中サイズは幅・高さを 0 にしているので作成されません。

またサムネイル・中サイズ・大サイズと毎度選択肢がプルダウンで出てくる中から選択するのが面倒くさい場合、設定でデフォルトサイズを指定しておくこともできます ↓

なお、この設定画面は裏メニュー的存在で、通常出てきません。Wordpress にログインした状態で次の URL からアクセス可能です。

サイトのドメイン URL/wp-admin/options.php

僕は上図の通りデフォルトで大サイズになるように設定しています。地味に便利♬

さて、メディア設定で大サイズの幅を 640px に変更しましたので画像のアップロード・設定のプルダウンではこれが出てきてくれても良さそうなものですが、上記の通り 525px のまま、、、

色々試したりググったするも解決できず。。 こんな時に頼りになるのが WordPress のフォーラムです :D

functions.php の default content width を変更する

実際に僕がポストしたトピックはこれです。
【twenty-seventeen】記事幅一杯に画像を表示させたい

早速何人かの方がアドバイスを下さり♬
今回は functions.php を変更する方法で解決しました。

59行目辺りの以下の部分で標準のコンテンツ幅が 525px となっているところを 640px に変えます。

// Set the default content width.
$GLOBALS['content_width'] = 525;

すると、

ちゃんとコンテンツ幅一杯に表示されるようになりました

おぉぅ

記事幅一杯に表示される画像は迫力があり、またデザイン的にも横が揃って美しくなりました

以上、ご参考になれば幸いですが実施の際にはご自身のリスク・判断でお願いします。
当サイトでは一切の責任を負いかねます。


<AD/広告>

 

各種 SNS アカウントでコメントできます