ブログ初心者!WordPress Simplicity ブログ制作で困ったこと・悩んだこと・解決したこと6つ

naobimによるpixabayからの画像

ようこそ “もめん” です。

私は、WordPress  Simplicityテーマ 新エディターGutenberg(グーテンベルグ)を使って記事を書いています。

65歳で本格的にブログを書き始めました。パソコンの知識もないし、さらにプログラミングの知識は何もありません。

そんな初心者の私ですから、ブログ制作にあたり記事を書き進めるうちに、困ったことや悩んだりすることがたくさんありました。

● 新入力画面(ブロックエディター)への入力方法がわからない

● 文章と文章の間に余白を入れて見やすくしたいけど、余白の入れ方がわからない

● 新入力画面(ブロックエディター)で複数枚の画像を並べて表示したいけどどうすればいいの

● ヘッダー画像を設定したけど、iPhoneには表示されない

● グローバルナビゲーションが、iPhoneに表示されない

● Simplicityテーマは、グーグルアナリティクス設定をプラグインなしでできることに気がつかなかった

新入力画面(ブロックエディター)についての参考記事は少なく、理解するのが大変でしたが、なんとか自分なりに解決させていただきました。

以上6つの困ったこと・悩んだことと、その解決方法をまとめたいと思います。

新エディターGutenberg(グーテンベルグ)ブロックエディターでの入力方法がわからない

いよいよWordPressが開きました。初心者(素人)の私は、感動しました。

たどり着いたことに喜んだのもつかの間、WordPress設定まで行き着いたら、すぐにアップロードして下さいの文字が目に入り、アップロードしてしまいました。

開いた入力画面は、多くの方がブログ記事や書籍で使用説明している入力画面とは全然違うものでした。〈唖然〉

この画面こそGutenberg(グーテンベルグ)と言われる新しい入力ホームだったのです。

私は何で違う入力画面なのかわからず、どっかに入力画面が隠れているのかもしれないと必死に探しました。

そしてググりまくりです。

そしたら

『新エディターは、入力しづらいのでアップロードはしない方が良い』

という意見が多く書かれていて、「あぁ~やってしまったぁ(’◇’)」と思いました。

がっくりです。(><)

相当へこみましたが、ここは前向きに考えることにしました。

切り替え大事です。

いつまでも嘆いていても仕方ないので、入力できるか試してみました。

なんとか試行錯誤しながら記事を書いていますが、入力の仕方や機能の使い方がわかってくるとそれほど難しくは感じません。

新入力ホーム(グーテンベルグ)は、ブロック(段落)ごとに管理されています。

そのためブロックごと文章を移動もできますし、文章を分割することも容易にできます。

以前の入力ホームを使用したことがないので、使い勝手を比べることはできませんが、私は操作に慣れてきたのでサクサク作業が進むようになりました。

文章と文章の間にスペースがないので読みにくい。スペーサーで余白を作る。

新入力ホーム(グーテンベルグ)はブロック(段落)で管理されているので、入力画面でみると段落ごとに一行分のスペースがあるように見えます。

しかし、投稿後の実際の文章は、文字がズラッと並んで実に読みにくいものでした。

なので、文章を書き終わったら、スペースを空けたいところに余白を設定していきましょう。

余白は、スペーサーを使います。左上のブロックの追加でもブロックの横にあるブロックの追加からでも大丈夫です。

おすすめ!

ブロックの間に、余白を追加するときはスペーサーを使います。高さはカスタマイズできます。

スペーサー操作手順

「①ブロックの追加」→「②スペーサー」の順にクリックします。

③余白の設定から、余白の高さを数字で入力します。

通常は100ピクセルで設定されています。好きな余白の数字を入力することで、余白の高さをお好みで調整できます。

これで余白もできて読みやすい文になりました。

新入力画面(ブロックエディター)で複数枚の画像を並べて表示する方法

次に、画像を複数枚並べて表示する方法です。

今回の文章のように画像で説明したり、旅行記のように何枚も写真を載せたいと思うことがありますね。

新入力画面(ブロックエディター)での表示方法は、よくわからないところもあって試行錯誤しながらやってみました。

操作は意外と簡単でした。

操作手順

①「ブロックの追加」をクリック

②「ギャラリー」を選択します。

③次に、画像を新規にアップロードするかメディアライブラリーから画像を選ぶか、どちらかを選択します。

今日は、メディアライブラリーから画像を選択する方法で説明を行います。

④メディアライブラリーが開いたら画像を選択します。

選択した画像に✔印がつきます。今日は3枚選びました。

⑤右下の「ギャラリーを作成する」をクリックします。

ギャラリー編集画面になります。

画像を並び替えるには、ドラッグしてドロップします。画像を追加したい時は、右の「ギャラリー追加」で、他の画像を追加できます。必要ない(消去したい)画像は、✖クリックで消去できます。

⑥編集がない場合、もしくは編集が済んだら、「ギャラリーを挿入」をクリックします。

⑦画像が取り込めたら、画面右側の「ギャラリーの設定」からカラム数を入力します。カラムとは表表示の「列」のことです。

POINT!

3枚横並びに表示したい時は、カラムに「3」と入力するところですが、ブロックエディターの場合、「3」と入力すると、2枚は横並びで、その下に3枚目が表示されます。3枚横並びで表示したい時は、「3」ではなく「4」と入力します。

これで3枚横並びに表示されました。

⑧リンク先を設定します。

リンク先は、添付ファイルのページ、メディアファイル、なし、の3つから選べます。

読者が画像をクリックした時のリンク先になります。メディアファイルもしくはなしを選択で良いと思います。

ヘッダー画像を設定したけど、iPhoneには表示されない

ヘッダーに画像を設定しましたが、パソコンには表示されるのに、iPhoneには表示されませんでした。

画像が悪いのかなと思ったり、設定方法が間違っているのかなと思って、やり直してみました。でも、やっぱり表示されません。(><)

どうしても諦めきれず、私が使用しているテーマ名Simplicitiyを入れてググってみました。

なんと解決方法がわかりました。

ヘッダーに画像を設定したら、その下のうんと下の方にあるモバイルへーダー背面画像にも設定することでiPhoneにも表示することができました。

グローバルナビゲーションがiPhoneに表示されない

グローバルナビゲーションとは、サイトに訪れた人に主要な記事やカテゴリーを示す案内表示板です。

私も設定してみました。全然おしゃれではないですが、パソコンではヘッダー画像の下に表示されました。(ヤッター!)

ところが、またまたiPhoneには表示されていないんです。またへこみました。(><)

表示されないのは悔しいけれど、しょうがないかな、諦めようかなとも思いました。

でも何か解決方法があるはずと思い、グローバルナビゲーションに関する記事を読みまくりました。

わかりました。なんと設定されてたんですよ。ただ見えなかっただけでした。

ガビーン!!なんだ表示されてるじゃん!!そうなんです。

iPhone右上に表示されている三本の横線アイコンをクリックすれば表示されるんです。

三本線が「ハンバーガ」のように見えるので、通称「ハンバーガーアイコン」もしくは「メニューアイコン」と言われているそうです。

押すとメニューが表示されるようになっているのです。

知らなかった~!!(><)

カスタマイズして、グローバルナビをお洒落に表示させる方法もたくさんあるようですが、今はこれで良しとしました。

Simplicityテーマは、グーグルアナリティクス設定をプラグインなしでできる

読者数は、まだ全然少ないですが、ブログを開設したらグーグルに登録してグーグルアナリティクスを設定し、アクセス解析サービスを受けたほうが良いという意見を受けて、私も設定することにしました。

多くの記事では、プラグインを追加インストールして、グーグルアナリティクスを設定する方法が書かれています。

私が使用しているWordPressにない機能を追加反映するためのプログラムをプラグインといいます。

私は、すでにAll in one SEOというプラグインをインストールしていたので、そちらを使ってグーグルアナリティクスとグーグルサーチコンソールを設定しようと試みました。

ところがいつの間にかプラグインAll in one SEOがバージョンアップしてPROバージョン設定になってしまい、入力画面すら動かなくなってしまいました。

この時ばかりは動揺しましたが、解決策を探し続けました。

解決策、ありました。

なんと素晴らしいことに、私が使用しているSimplicityテーマでは、プラグインなしでグーグルアナリティクスを設定できるんです。

Simplicity開発者のわいひらさんに感謝です。

私のような初心者でも、ブログを開設しやすいように、そしてプラグインをインストールしなくても様々な機能を設定できるように作ってくださっていました。

私はプラグインなしでグーグルアナリティクスの設定を行いました。

まとめ

今回は、ブログ制作において遭遇した様々なアクシデントから学んだことと解決方法をまとめました。

● Word Press 新入力画面はブロック管理になっているので、ブロックの機能を使いながら文章や画像入力ができる。

● ブロック間の余白はスペーサー機能を使うことで設定できる。

● 新エディターは、ブロックの追加からギャラリーを選んで、複数枚の写真を表示させることができる。

● iPhoneにヘッダー画像を表示させるには、ヘッダー設定だけでなく、モバイルヘッダーの設定も行う。

● グローバルナビゲーションの設定方法を学び、iPhoneにも表示されていることがわかった。

● simplicityテーマでは、プラグインなしで設定できる機能が備わっている。

以上6つのアクシデントを経験して、諦めないで学ぶことの大切さを実感できました。

そして得られた教訓は、記事を検索するときは、自分が使用しているテーマ名「simplicity」を入れて検索をすることが一番効率が良い方法であるということでした。

様々な情報から自分が求めているものに最適な情報を見極めることが大切です。

もう一つは、スマホからアクセスしている読者が多いので、スマホで読みやすくすることも大切であるということです。 

おわりに

効率は悪かったかもしれませんが、諦めないで根気よく解決策を見つけ、自分で解決したことで、ブログ作りへの自信につながりました。

そしてブログに一層愛着が湧きました。

今回経験して学んだことはこれからのブログ作りに生かしてゆきたいと思います。

「まちがったら、またトライすればいい!」そんな気持ちで挑戦してゆきたいと思います。

こちらの記事がどなたかのお役に立てることができたなら幸いです。

最後までお読みいただきましてありがとうございました。

もう一つの失敗談!ブログの画像が消えてしまった失敗談を記事にしました。

ブログ記事内の画像が急に消えてしまった。原因はメディアライブラリの画像を消したからだった。簡単な解決方法があります。