みやぎ震災復興研究センター

ブログ記事作成ページの使い方(第5回)
——投稿記事に画像やPDFファイルを挿入する
Picture of 遠州尋美

遠州尋美

みやぎ震災復興研究センター・事務局長(gmail登録)

Date

ブログ記事作成ページの使い方を解説します。
今回はその第5回『投稿記事に画像やPDFファイルを挿入する』です。
今回で一旦終了します。おそらく,ほとんどの投稿記事は,このシリーズの知識で十分かと思います。

「メンバーブログ」もしくは「能登・北陸支援フォーラム」投稿者に登録して記事投稿を行うことをお考えの方のために,ブログ記事作成ページの使い方を解説して行きます。今回の投稿は,その5回目です。

【ブログ記事作成ページの使い方】目次

  1. 「表題」欄とその効果
  2. 「カテゴリー」の選択
  3. 記事本文作成エディタのツールバー①
    (上の列のコマンドアイコン)
  4. 記事本文作成エディタのツールバー②
    (下の列のコマンドアイコン)
  5. 投稿記事に画像やPDFファイルを挿入する(この投稿です)

(第5回で一旦終了します)

<作成ページの要素と配置>

左側に作成ページに各要素とその配置を示しており,上から順番に◯で囲んだ番号と要素の名前が書いてあります。

今回は,このうち「投稿記事に画像やPDFファイルを挿入する」方法について少し詳しく説明します。

投稿記事に画像やPDFファイルを挿入する

最初は,作成中の投稿記事の任意の位置に画像やPDF書類などを挿入する方向です。

画像の挿入

画像の挿入から行ってみます。

「メディアを追加」ボタン

投稿記事作成ツールバーの上に,「メディアを追加」ボタンがあります。その画像が,下の画像です。

この画像も「メディアを挿入ボタン」で挿入したものです。せっかくですから,別の画像を挿入してみましょう。

能登半島地震で被災した輪島市の朝市の写真です。私が会員のなっている素材サイトからダウンロードしました。月会費を収めていますので,毎月10枚まで書作権フリーでダウンロードできます(違法アップロードではないのでご心配なく)。まず,この行の下に挿入位置を置いて,「メディアを追加」ボタンを押します。

画像などの投稿作成エリアに挿入は次の手順で行われます。①メディア・ライブラリにアクセス,②メディア・ライブラリ内のアップロード画像ファル選択ウィンドウへの移動,③投稿者のPC等に保存されたアップロード画像ファイルの選択,④メディア・ライブラリにアップロード,⑤メディア・ライブラリ内にアップロードされた画像の選択,⑥選択した画像の挿入

以上の6段階の手順です。

①メディア・ライブラリにアクセス:「メディアを追加」ボタンをクリックすることが,その操作にあたります。すると,みやぎ震災研サイトのWordPressメデイア・ライブラリの画面が開きます。

②メディア・ライブラリ内のアップロード画像ファル選択ウィンドウへの移動:上の画像の「ファイルをアップロード」タグを選択します。すると……

③投稿者のPC等に保存されたアップロード画像ファイルの選択:この画面の「ファイルを選択」ボタンをクリックしてください。

④メディア・ライブラリにアップロード:すると,PCに保存された画像の選択ダイアログが開きます。そこで,アップロードする画像ファイルを選択して「開く」ボタンをクリックします。(上の画像はMacの場合です。Windowsでは少し異なると思います。)

この画面はアップロードが進行中の状態です。

⑤メディア・ライブラリ内にアップロードされた画像の選択:アップロードが終わりました。この状態で,すでに今アップロードされた画像が選択されています。そこで,右下角の「投稿に挿入」ボタンをクリックすれば……

⑥選択した画像の挿入:無事に,投稿記事作成エリアに挿入されました。

あとは,表示位置を選択します。私は中央揃えにしました。

それでは,ウェブサイト上ではどう見えるでしょうか。

PDFファイルを挿入し投稿内に表示させる

次にPDFファイルを挿入し,そのPDFを投稿内に表示します。投稿内に表示することができるのは,バックエンドでPDF-Embedderというプラグインの助けを借りています。しかし,投稿者はそれを意識する必要はなく,単に画像ファイルと同じ手順で実行すればいいだけです。

①メディア・ライブラリにアクセス

②メディア・ライブラリ内のアップロードPDFファル選択ウィンドウへの移動

③投稿者のPC等に保存されたアップロードPDFファイルの選択

第3までの手順は全く画像の場合と一緒です。 今回は,私が東日本大震災復旧・復興支援みやぎ県民センター(みやぎ県民センター)が発行するニューズレターのうち,在宅被災者支援について執筆した特別号をアップロードしてみます。

「開く」ボタンでアップロードされます。

そこで「投稿に挿入」ボタンをクリックすると,

PDF-embedderのショートコードが挿入されました。実際の投稿を見ると。

投稿内にはPDFの資料名(論文タイトル・掲載誌名など)を記載してリンクを貼る

投稿内にPDFを直接表示するのではなく,資料名を記載してリンクを貼り,閲覧者がそのリンクをクリックしてPDFを表示し,閲覧やダウンロードの便宜をはかるとういう方法もあります。その時は,

「メディアを追加」ボタン>メディア・ライブラリ画面>「ファイルをアップロード」タグ>「ファイルを選択」ボタン>PC内でのファイル選択>メディア・ライブラリにアップロード>アップロードされたファイルの選択

までは,投稿内のPDFを表示する場合と同じ手順を踏みます。ただしファイルを選択したら,「投稿に挿入」ボタンを押さずに,アップロードされたPDFのURLをコピーします。

上記の図にあるように「クリップボードにURLをコピー」ボタンをクリックして,URLをコピーし,メディア・ライブラリの画面を閉じます(画面右上隅のバツ印をクリック)。

次に投稿作成エリアないの適切な位置に,閲覧者にわかりやすいリンク文字列を挿入します。例えば次のような感じですね。

遠州尋美「貧困な住宅補修支援と在宅被災者問題(第三回)──単線型支援システムと災害ケースマネジメント──」(みやぎ県民センターニューズレター第85号・特別号

入力したリンク文字列を選択して,ツールバーの「リンク挿入/編集」コマンドをクリックし,「リンクボックス」を表示して,先ほどコピーしたリンクをペーストします。

これでリンクが設定されました。

公開された投稿内のリンクをクリックすると………

いかがだったでしょうか。ぜひ,ブログ記事作成ページで記事を作成して積極的な情報発信を期待します。

第5回で一旦終了します。

More
posts