【Cocoon2020】WordPressでの記事の書き方新エディタグーテンベルグGutenberg

ワードプレス入力画面 ワードプレスCocoon

最近はてなブログからワードプレスにお引越しをしてきまして毎日試行錯誤しています。

私は最新版のワードプレスを使用して記事を書いています。

ネットで [ワードプレス 記事の書き方] と検索しても最新版は使いづらいから旧式の方法を解説しますというものが多かったので、自分でいろいろな所をクリックしてみて少しづつ分かってきました。

調べていて分かったのですが、私が言っている最新版というのはWordpress5.0の新エディタGutenberg(グーテンベルグ)というものなのですね。こちらを使っています。

同じところで悩んでいる方がいらっしゃると思いますので少しでも参考になればと思います。

【ワードプレスCocoon記事の書き方①】タイトルと次の1行目の書きかた

ワードプレス記事作成画面

ダッシュボードの投稿→新規追加をクリックすると上の画面になると思います。タイトルと次の1行を書く欄がすでにできています。タイトルを書きたいときは[タイトルを追加]の部分をクリックすれば文字が入れられます。文章を書きたいときは同様に[文章を入力、~]をクリックすれば大丈夫です。

【ワードプレスCocoon記事の書き方②】 その次の段落の書き方

その次の段を書くには3通りの方法があります。

①文章のさいごをクリックする

ワードプレス記事作成画面

点滅の線が上の部分にある状態でENTERキーを押すと下のように次の段落が現れます。

ワードプレス記事作成画面

○の中に+が入ったマークの横にカーソルを持っていくと右端にある3つのマークも出てきます。こちらは後ほど説明しますが、段落や吹き出しをここから設定できます。

②書いた段落より下にカーソルを合わせる

ワードプレス記事作成画面

カーソルを下にもっていくと○に+のマークが出てきます。そちらをクリックすると次の段落を書く場所が出てきます。

③記事作成画面の左上の○+マークをクリックする

ワードプレス記事作成画面

【ワードプレスCocoon見出しの作りかた】2通りあります

ワードプレス記事作成画面

①上の画像の赤まるのマークから

新しい段落を出した時に上の画像のように右側に3つのマークが出てくると思います。この H のマークをクリックするとその段落が見出しになります。

デフォルトではH2の見出しになるので、H3やH4に変更したいときは下のの赤マルの部分で変更してください。

ワードプレス グーテンベルグエディタ画面

②記事作成画面の上

ワードプレス記事作成画面

上の画像のあかまるで囲ったマークをクリックすると下のような選択画面が出てきます。そこで H を選択すればOKです。

ワードプレスワードプレス グーテンベルグエディタ画面

【ワードプレスCocoon吹き出しの作りかた】

上の見出しの作り方と同じです。吹き出しのカスタマイズの仕方はいろいろな方が記事にされているのでそちらをご覧ください。

私は吹き出しをよく使うので新しく○に+のマークを押したときに右側に吹き出しマークが出てきますが、他のものをよく使う方は吹き出しマークがないことがあると思います。その時は下の画像の赤で囲んだ○+マークを押すと段落以外の選択ができるようになります。

ワードプレスワードプレス グーテンベルグエディタ画面

吹き出しマークを選択すると下のように右側に吹き出しの選択ができる画面が出てきます。こちらで人の選択、人を右に配置するか左に配置するかを決められます。

ワードプレスワードプレス グーテンベルグエディタ画面

【ワードプレスCocoon画像の貼りかた】

上の見出しと吹き出しの作り方と同じです。

【ワードプレスCocoonアフィリエイトコードの貼りかた】

ワードプレス投稿画面 カスタムHTML

上の写真の真ん中にあるカスタムHTMLにしてコードを入力するだけです。入力後すぐには反映されないことが多いですが、数分経ってからプレビューで見てみるときちんと表示されます。

【ワードプレスCocoon保存のしかた】保存ボタンが見当たらない。どこ?

ワードプレス記事作成画面

上の画像の右側、[ブロック]が選択された状態だと保存ボタンが見えない場合があります、その時は横の青□で囲った[文書]をクリックしてみてください。

ワードプレス記事作成画面

めでたく[下書きとして保存]が出てきました!

この[文書]タグでパーマリンクやカテゴリー、タグやアイキャッチ画像の設定ができます。

今日はこれまで!

以上、ワードプレス新エディタGutenbergでの記事の書き方でした!

ホームページ風のトップページを作りたい時に参考にしてください↓

【Cocoon2020】簡単サイト型ホームページの作り方CSS,HTML不使用
CSSもHTMLも使わずにサイト型のトップページにする方法をご紹介します。Cocoonのテーマを使えばボタン操作だけでホームページ風のトップページにを作ることができますよ。エディタはGutenbergを使用しています。

その他ワードプレスCocoonに関する記事を書いています。よろしければご覧ください。

ワードプレス・旭川情報etc.しずくログトップ
shiizuku(しずく)ブログトップページへようこそ!2020年版Wordpressコクーンの各種設定方法やお気に入り商品のレビュー、旭川観光情報などを詳し~く発信しています。
タイトルとURLをコピーしました