2018年3月25日開催「WordPress初心者講座」(主催 UX Yokohama) の講義資料です。ページ数が多いため資料01から資料05まで5分割してSlideShareに投稿しています。WordPress 4.x の基本的な操作方法をハンズオン形式で解説する内容です。残念ながらWordPress 5.x (Gutenberg) の登場により講義後半の内容が無意味になってしまいました。 資料01 https://www.slideshare.net/akihiromoriyamaureka/wordpress2018325-01 資料02 https://www.slideshare.net/akihiromoriyamaureka/wordpress2018325-02 資料03 https://www.slideshare.net/akihiromoriyamaureka/wordpress2018325-03 資料04 https://www.slideshare.net/akihiromoriyamaureka/wordpress2018325-04 資料05 https://www.slideshare.net/akihiromoriyamaureka/wordpress2018325-05

1. 主催：
WordPress初心者講座・ワードプレスを使ってみよう
6. ブログ記事を投稿する
2018.3.25開催

2. >67
6. ブログ記事を投稿する
•数字付きリスト
•見出し
•挿絵
•フォーマット
•カテゴリとタグ
•アイキャッチ画像
•パーマリンク
•MOREタグ

3. メニューより「投稿 〉投稿一覧」を選んでくだ
さい。
>68

4. 画面左上の「新規追加」ボタンをクリックして
ください。
>69

5. WordPressの「新規投稿を追加」画面が表示さ
れていることを確認してください。
>70

6. エクスプローラに切り替え、SDカードを開き、
フォルダ「WordPress初心者講座」の中にあるテ
キ ス ト フ ァ イ ル 「 省 エ ネ ゆ で た ま ご の レ シ
ピ.txt」を開いてください。
>71

7. テキストの内容全てを選択し、クリップボード
にコピーしてください。
>72

8. WordPressに戻り、本文欄にクリップボードの
内容を貼り付けしてください（右クリックメ
ニューから貼り付けできます）。
>73

9. 本文テキストの１行目を文字列選択し、切り取
りして、タイトル欄に貼り付けしてください。
>74

10. 番号付きリストを作成します。テキストで番号付きリ
スト風に書かれた部分を文字列選択し、ツールバーの
「番号付きリスト」ボタンをクリックしてください。
>75

11. 選択部分の行頭に数字が追加されたことを確認
してください。
備考：WordPressはテキストは１行しかないと勘違いしています。
>76

12. Deleteキーで改行符号(見えない)を削除し、リ
スト部分をいったん１行のテキストに戻してく
ださい。
>77

13. Returnキーで、リスト部分を改行し直してくだ
さい。ついでに不要な文字｢1.｣｢2.｣｢3.｣も削除
してください。
>78

14. 見出しを作成します。「手順」と書かれた行を文
字列選択し、ツールバーの「段落」プルダウンメ
ニューから「見出し２」を選択してください。
>79

15. 文字サイズが少し大きくなったこと、プルダウ
ンメニューの表示が「見出し２」に変化してい
ることを確認してください。
>80

16. 本文の１行目に挿絵を挿入します。まずカーソ
ルを１行目に置き、次に「メディアを追加」ボ
タンをクリックしてください。
>81

17. WordPressの「メディアを追加」画面が表示さ
れていることを確認してください。
>82

18. 「ファイルを選択」ボタンをクリックしてくだ
さい。
>83

19. ファイル選択ダイアログからSDカードを開き、フォ
ルダ「WordPress初心者講座」の中にあるJPGファ
イル「ゆでたまご.jpg」を開いてください。
>84

20. アップロードには少し時間がかかります。
少し待ち、JPGファイルが１つWordPressに
アップロードされたことを確認してください。
>85

21. SLIDE
画面右下の設定項目「サイズ」で
「フルサイズ - 1920x1280」
を選択してください。
>86

22. ｢投稿に挿入｣ボタンをクリックしてください。
>87

23. 挿絵が挿入されたことを確認してください。
>88

24. >89
SLIDE
>89フォーマットを編集します。「フォーマット」は
投稿内容が文章主体か画像主体かを明らかにする
ものです。この投稿は文章主体ですので「標準」
のままとします。

25. カテゴリーを編集します。「新規カテゴリーを
追加」と書かれた下線付文字列をクリックして
ください。
>90

26. 現れた記入欄に「レシピ」と記入し、「新規カ
テゴリーを追加」ボタンをクリックしてくださ
い。
>91

27. カテゴリー一覧に新しい項目「レシピ」が追加
されていることを確認してください。
>92

28. タグを編集します。記入欄に「たまご」と記入
し、「追加」ボタンをクリックしてください。
>93

29. タグ一覧に新しい項目「たまご」が追加されて
いることを確認してください。
>94

30. アイキャッチ画像を編集します。「アイキャッ
チ画像を設定」と書かれた下線付文字列をク
リックしてください。
>95
アイキャッチ画像とは、TwitterやFacebookに記事の
リンクを投稿すると優先的に引用される画像です。

31. 画像ファイルを１つ選び、画面右下端の「アイ
キャッチ画像を設定」ボタンをクリックしてく
ださい。
>96

32. アイキャッチ画像が設定されたことを確認して
ください。
>97

33. 画面右上の「プレビュー」ボタンをクリックし
てください。
>98

34. 極端に大きなアイキャッチ画像が表示されてい
ることを確認してください（このテーマの仕様
です）
>99

35. プレビューの表示されているタブの「閉じる」
ボタンをクリックしてください。
>100

36. SLIDE
「アイキャッチ画像を削除」と書かれた下線付
文字列をクリックしてください。
>101

37. アイキャッチ画像の削除されたことを確認して
ください。
>102

38. 画面右上の「公開」ボタンをクリックしてくだ
さい。
>103

39. パーマリンクが投稿のタイトルと同じになって
いることを確認してください。
>104

40. パーマリンクを書き換えます。「編集」ボタン
をクリックしてください。
>105

41. 現れた記入欄に「boiled-egg」と入力し、
「OK」ボタンをクリックしてください。
>106

42. パーマリンクが変更されたことを確認してくだ
さい。
>107

43. 画面右上の「更新」ボタンをクリックしてくだ
さい。
>108

44. 画面に現れた「投稿を表示」ボタンをクリック
してください。
>109

45. 極端に大きなアイキャッチ画像がなくなってい
ること、パーマリンクが英字のみであることを
確認してください。
>110

46. ページ上端の「マイホームページ Just Another
WordPress Site」という文字列をクリックしてく
ださい（ウェブサイトの表紙にリンクしています）
>111

47. 最新投稿一覧に、投稿のすべての文章が掲載さ
れていることを確認してください（このテーマ
の仕様です）
>112
←表紙絵
←ウィジェット
エリア
最新投稿一覧→

48. ウェブブラウザの「戻る」ボタンを２回クリッ
クして編集画面まで戻ってください。
>113

49. 本文の「…省エネにつながります。」の行末に
カーソルを移動し、「続きを読むタグを挿入」
ボタンをクリックしてください。
>114

50. MOREタグ（続きを読むタグ）が挿入されたこ
とを確認してください。
>115

51. 画面右の「更新」ボタンで投稿を更新し、メ
ニューより「マイホームページ」を選んでくだ
さい
>116

52. 最新投稿一覧が全文掲載でなくなったこと、
「続きを読む」ボタンが追加されたことを確認
してください。
>117
←表紙絵
←ウィジェット
エリア
最新投稿一覧→

53. メニューより「マイホームページ 〉ダッシュボー
ド」を選んでください。
>118

54. WordPressの「ダッシュボード」画面に戻った
ことを確認してください。
>119

55. ここまでのふりかえり
>120
•ブログ記事を投稿する
•数字付きリスト
•見出し
•挿絵
•フォーマット
•カテゴリとタグ
•アイキャッチ画像
•パーマリンク
•MOREタグ