自分の記事を投稿してみる ワープロソフト感覚で使えるエディタで文章を書いたり画像を挿入したりできる

ブログサイトの立ち上げ方
スポンサーリンク
スポンサーリンク

 

 

 

簡単な記事を投稿してみる

WordPressをインストールした段階で、すでに自分のブログサイトは動き始めています。

「プロフィール」や「パーマリンク設定」の修正、「テーマ」や「プラグイン」の更新を済ませたら、自分の記事を投稿する準備は整いました。

早速、簡単な記事を投稿してみましょう。

 

お試しブログ ダッシュボード
ログイン後に表示される、「ダッシュボード」の画面です。

 

お試しブログ 投稿 新規追加
「投稿」-「新規追加」をクリックします。

 

記事を編集するエディタ画面

お試しブログ 投稿 新規追加 執筆に集中 非表示にする
「新規投稿を追加」画面が表示されます。
この画面は、自分の記事を編集するエディタです。

最初に「新規投稿を追加」の画面に行くと、「執筆に集中」の吹き出しが表示されることがあります。

吹き出しの先の「集中執筆モード」のアイコンをクリックすると、エディタ周辺のアイテムの表示がなくなり、記事の執筆に集中?できる機能の紹介です。
ここでは、「非表示にする」をクリックして、この吹き出しの表示を消しておきます。

 

タイトルの入力

お試しブログ 新規投稿を追加 こんにちは 地球さん!
まず、記事のタイトルを入力します。

”ここにタイトルを入力”と表示されているタイトル入力枠に、記事の内容に合った、好きなタイトルを入力します。

ここでは、例として”こんにちは 地球さん!”と入力します。

 

画像の挿入

お試しブログ 新規投稿を追加 メディアを追加
次に、画像を挿入してみましょう。

「メディアを追加」ボタンをクリックします。

 

お試しブログ メディアを挿入
「メディアを挿入」画面が表示されます。

自分のPCにある好きな画像ファイルをこの画面にドラッグします。
すると、画面全体が青色に変わって、”ファイルをドロップしてアップロード” と表示されるので、ファイルをドロップします。

ファイルをドロップすると、サーバーにアップロードが始まります。

 

お試しブログ メディアを挿入 ファイルアップロード後
画像ファイルがアップロードされている間、

①:プログレスバーが表示されます。アップロードが完了すると画像のサムネイルが表示されます。

サムネイルの右上には、この画像を選択していることを示すチェックマークが付いています。

②:「投稿に挿入」ボタンを押します。

 

お試しブログ 新規投稿を追加 こんにちは 地球さん! メディアを追加後
「新規投稿を追加」画面に戻ります。

先ほど、ドラッグ&ドロップした画像が、記事の先頭に挿入されました。

このように、画像も自分の記事の中に簡単に挿入できます。
ここでは説明しませんが、画像だけでなく音楽やビデオ、Google地図なども簡単に挿入できます。

以下のAdminWebさん、TechAcademyマガジンさんのブログなどが参考になります。

記事にYouTubeの動画を挿入する - WordPressの使い方
WordPressで記事にYouTubeの動画を挿入する方法について解説します。簡単に挿入するにはURLを記述するだけでできますが、幅や高さを指定するにはYouTubeで用意されている埋め込みコードを使用します。
WordPressでGoogleマップの地図を表示させる方法【初心者向け】
WordPressでグーグルマップの【地図】を表示させる方法を初心者向けに解説した記事です。地図の埋め込みコードを使って挿入する方法と、プラグインを使った方法の2つを紹介しています。記事を参考にして、地図を表示させてみてください。

 

文章の入力

お試しブログ 新規投稿を追加 こんにちは 地球さん! 地球は青かった!
画像の下に文章を追加してみます。

画像の下に、マウスのカーソルを持って行ってクリックします。
文字入力のカーソルが表示されるので、好きな文章を入力します。

例として”地球は青かった!”と入力しました。

さらに、入力した文字の色や大きさ、ボールドやイタリックなどの修飾などもワープロソフトの感覚で簡単に変更できます。
この説明は省略しますが、以下のAdminWebさんブログなどが参考になります。

エディタを使った記事の作成
記事を作成する時に使用するビジュアルエディタとテキストエディタの使い方です。ツールバー上に表示されている各アイコンの意味と使い方や、リンクの設定、画像や動画の挿入方法、Moreタグの使い方などを解説します。

ちなみに、私は、以下のプラグイン“TinyMCE Advanced”をインストールして使っています。

TinyMCE Advanced – LaptopTips
Enhances the WordPress WYSIWYG editor adding 16 plugins and admin page for arranging the toolbars.

このプラグインを使うと、エディタの上の編集ボタンの種類が下図のように増え、よりワープロソフトの感覚で文章や文字、段落の見栄えを編集しやすくなります。

デフォルト状態
エディタの編集ボタン デフォルト
“TinyMCE Advanced”導入後
エディタの編集ボタン TinyMCE Advanced

 

記事の公開

お試しブログ 新規投稿を追加 こんにちは 地球さん! 公開
ここまでは、まだ、記事の編集中なので、WEB上では、非公開の状態です。

「公開」ボタンをクリックして、この記事を公開します。

「公開」ボタンを押した段階で、この記事は、ネット上の誰からも見ることができるようになります。

 

お試しブログ 投稿の編集 こんにちは 地球さん! 公開後
エディタの左上に”投稿を公開しました。”と表示されます。

自分の画面はエディタ画面のままなので、先ほど公開した記事が、ネット上ではどのように見えているのか確認してみます。

“投稿を公開しました。”の右の“投稿を表示する”をクリックします。

 

お試しブログ こんにちは 地球さん!
記事の表示画面に変わり、先ほど公開した記事が見えました。

ネット上の人は、この表示状態で記事を見ていることになります。

ちなみに、「パーマリンク」を「投稿名」にしているので、この記事のURLは、

“freetrial.minibird.jp/blog/こんにちは-地球さん!”

と記事のタイトルが使われています。

記事を公開した後も「投稿の編集」をクリックすると、この投稿の編集画面に切り替わり、先ほどと同じように文章の編集や画像の挿入ができます。

 

まとめ

このように、記事の内容は、普段使っているワープロソフトと同じ感覚で作成/編集することができます。
画像やビデオの挿入も簡単です。

編集した記事は、「公開」ボタン1つで、自分のブログサイトに投稿ネット上に公開できます。

あとは、記事をどんどん投稿して、WordPressのエディタの使い方に慣れていってください。

 

 

コメント