WPヘッダー画像レスポンシブ対応Simplisityテーマ

目次
sumahotaiouno

WordPressのスマホ対応、モバイル対応が騒がれている中、完全にレスポンシブ対応がされているサイトなりソフトがまだ少ないように思う、僕が使用しているテーマSimplicityのヘッダー画像がスマホで表示されないで困っていたのだ、しかもヘッダー画像がとてもインパクトがある縦長であるためにスマホ画面だとヘッダー画像があるべきスペースがまるまる無地で空き地状態になってしまい、スクロールしないと文字すら出てこない状態になっていたのだ、そこで色々調べてみるとSimplisityのテーマカスタマイザーでモバイルヘッダー背景画像を入力していないことに気づき即刻対応してみた

**********************************************

内部SEO施策済みのシンプルな無料Wordpressテーマ

まずは、パソコンで見るヘッダー画像の設定は↓ここでわかるので、リンクを貼っておきますね

Simplicityに画面幅いっぱいのヘッダー画像を設定する方法

そして、今日の本題はスマホ、モバイル対応のヘッダー画像の設置方法です

**********************************************

スポンサード リンク

************************

WordPressのテーマSimplisityでスマホ対応のヘッダー設定

意外と簡単にできてしまい今まで悩んだことがばかばかしくなってきた、だって変なプラグインが邪魔してたりいろいろな可能性があると思い悩んだからだ

シンプルでレスポンシブ対応で人気のテンプレートであるシンプリシティーだけあってちゃんと対応ができて一安心だ

この動画をまずは見ていただきたい

SimplisityのJIF画像ヘッダーをスマホ対応にしてみた

***********************

スポンサード リンク

*************************

ヘッダー画像はある意味ブログのページの顔

ブログに始めてやってきてくれたお客様がまず最初に目にするモノはタイトル文字ではないきちんとしたヘッダー画像が設置してあればまずそこに視線が行くはずだ、その次がタイトル文字だろうか

この画像を見ていただきたい①が最初の状態②がモバイル設定の画像を入れた状態③がヘッダー画像スペースも調整した状態

ヘッダーをモバイル対応にする

これで完璧ですね、

①ですとせっかくサイトに来たお客さんが速攻でバイバイって逃げてしまうでしょう

②では、記事のトップまでがこんなにスペースがある、どうなってんのッてかんじ!!これはパソコンで設定したポイント727という数字が活かされてしまってます為にこんな余白が残ってしまってます、そこで、モバイル対応の画像を設置した後で実際のスマホ画面を見ながら画像の高さのポイント数の設定をする必要があります、僕の設定した画像の場合は250ポイントが適正でした

③で、設定完了です、この手順は↑の動画で解説してます

 

何といっても、画像や動画のインパクトが大きい、あまりやり過ぎても押しつけがましくなると思うが消極的にならずにアピールする方が僕は好きである

まあ、趣味の問題だが何だこのサイトはッて!!!!そんなふうに思ってもらえて印象付けられれば大成功だからね、、、、あなたもそう思いませんか、、、、、、、、

とくに、開けたとたんに動く画像が眼に入ったら輪をかけてインパクトがあるサイトになる

まあ、ほどほどにですがネ、、、、、、、、、、、

**********************

創作図鑑

★★★

ストックフォト

★★★

★★★

Adobe Photoshop

★★★

ScreenPresso

★★★

***********************************************

スポンサード リンク

★★★★★★★★

FaceBookページ↓

デコドルフィンのアート法

Twitter↓

Hideki Sugihara

★★★★★★★★

LINEで送る
Pocket
Share on LinkedIn