<img src="http://saekosensei.com/blogclub/wp-content/uploads/chloe-bourhis-715346-unsplash-1024x768.jpg" alt="" width="700" height="525" class="alignnone size-large wp-image-220" />
6月24日は、Wordpressの『ビジュアルエディタ』と『テキストエディタ』の違いの確認と、『アイキャッチ』画像の設定を学びました。
ビジュアルエディタとテキストエディタ
『ビジュアル』と『テキスト』は、投稿画面のタブで切り替えます。
ビジュアルの場合、画像が表示されるなど、実際のブログと似たような見栄えで編集ができます。
テキストの場合は、HTMLタグで表示されます。
ビジュアルエディタとテキストエディタの使い分けは?
ビジュアルエディタ
ビジュアルエディタは、写真などの配置を確認しながら書くことができますので、初心者の方もなじみやすいです。
ビジュアルエディタの欠点は、本番のブログと全く同じ見栄えではないこと、余計なタグがついたりすることです。
このようなタグがついたりします。
本番のブログプレビューを確認しながら書けば大きな問題ではありません。
テキストエディタ
テキストエディタの利点は、タグがわかれば正確に画像などの配置ができることです。
慣れてくると、ドラッグ&ドロップをして移動するビジュアルエディタより使いやすいです。
基本のタグ
基本のHTMLタグをおさらいしておきましょう
aタグ
リンクを作るタグです
<a href=”リンク先のアドレス”>文字または画像(img)タグ</a>
imgタグ
画像を表示するタグです
<img src=”画像のアドレス”>
コピペのときは、ビジュアル・テキストの確認を
HTMLコードのついた文字を貼り付け、画像などを表示させる場合は、テキストエディタに貼り付けてください。
『テキスト』モードで張り付けると
きちんと画像が表示されました。
『ビジュアル』モードで張り付けると
コードのまま表示されてしまいます
アイキャッチ
アイキャッチとは、『見出し画像』のことで、記事一覧のときに、記事の内容を象徴的に表す画像です。
記事の中に使われている画像でなくても設定できますが、記事の内容に合った画像を選択することをおすすめします。
アイキャッチ画像の設定
投稿画面右下の『アイキャッチ画像を設定』をクリックします
画像をアップロードして
右下の『アイキャッチ画像を設定』ボタンを押します
このように設定されている画像が表示されます。
あとは、記事を公開・もしくは更新すれば完了です。
アイキャッチの表示のされ方は、選択している『テーマ(着せ替えデザイン)』によって大きく異なります。
自分の好きな位置に表示させるためには、コーディング、プログラミングの知識が必要ですので、初心者のうちは自分の好みのテーマを探すことからはじめてみましょう。
その他にやったこと
- サイドバーウィジェットの配置基礎
- WordPressのログイン画面のアドレス『http(s)://ブログのアドレス/wp-admin』
- 縮小専用の復習
- 投稿の削除、ゴミ箱について
まとめ
今回は、テキストエディタとビジュアルエディタの違いを学び、アイキャッチが設定できるようになりました。
今回勉強した内容については、次回も復習しますのでご安心ください。
次回
7月10日(火)
13:30-15:00
会議室D
今回の復習と、Jetpackというプラグインの導入を行う予定です。