Freo Template Gallery

CMS「freo」のテンプレートを画像つきで紹介しています。初心者にわかりやすい設置方法や創作サイト運営に役立つ情報を紹介しています。

freoはじめて物語(4) ページ記事を投稿しよう

第3回ではエントリー時期を公開しましたが、今回はエントリーとはまた違った特徴を持つ「ページ機能」を使って記事を公開してみます。

  1. ページって何?
  2. 記事を書いて公開しよう
  3. 画像を添付してみよう
  4. 一度投稿した記事の内容を変更しよう
  5. 親ページと子ページを作成してみよう

第2回ではテンプレートを変更しましたが、スクリーンショットの環境ではより汎用性を高めるため初期デザインに戻しています。

ページって何?

第3回でも説明しましたが、エントリーは投稿した順番に個別記事のURLが作成され、一覧表示するときは投稿した順番に列挙されます。

一方で「ページ記事」は投稿者が任意のURLを設定することができ、一覧表示の順番も任意で変更することができます。そのためアーカイブ性の高い小説や漫画といった作品展示や、用語辞書や解説記事といった頻繁な更新が少ないコンテンツの管理に向いています。

freoに最初から入っているテンプレート(下図)では、サイドバーの「ページ」枠に記事へのリンクが作成されます。

page_01.png

このリンクを開くとページ記事を表示できます。

page_02.png

ぱっと見た感じではエントリー記事に似ていますが、初期デザインではサイドバーが表示されないのでより記事の内容に集中できるデザインになっています。

この個別ページのURLは「http://~/index.php/page/任意の文字」という形で投稿者が任意の文字を設定することができます。

より詳しい説明はエントリーとページについて | freo.jpなどを参考にどうぞ。

記事を書いて公開しよう

では早速ページ記事を投稿してみましょう。

freo_login.png

エントリー記事を投稿したときと同様に、ログイン画面(http://~/index.php/login)にユーザーIDとパスワードを入力して管理ページを開きましょう。

page_03.png

管理ページの左側にある「ページ登録」をクリックします。

page_04.png

ページ記事の投稿画面です。実際には下部にはさらに設定項目がありますが、今回は投稿するために必要な項目だけ説明します。

  1. 記事のタイトルを記入します。ページ内の大見出しや、titleタグに使用されます。
  2. 記事本文を記入します。
  3. タイトルと本文を記入したら、「登録する」をクリックすると記事を公開できます。「確認する」は記事公開の前に実際にどのように表示されるかを確認できます。
  4. ページIDを半角英数字で記入します。ここで入力した文字がページのURLに反映されます。
  5. 親IDを設定できます。別項で解説します。

page_05.png

タイトルと本文とページIDを入力したら「確認する」or「登録する」をクリックします。

page_06.png

画面が遷移して、上部に「ページを新規に登録しました」と表示されたら完了です。

page_07.png

トップページのサイドバーを確認し、登録したページが表示されていたら成功です!

画像を添付してみよう

ページ記事にももちろん画像を掲載することができます。画像掲載には複数の方法がありますが、今回はその中でももっとも手軽な「添付ファイル機能」を使う方法を紹介します。

page_img_01.png

添付ファイル機能は初期設定では使えないようになっています。まずはこれを使えるようにしましょう。

管理画面の左下にある「設定管理」をクリックします。

page_img_02.png

表示されたリンク一覧の中から「ページの設定」をクリックします。今度は画面下に各種の設定項目が表示されるので、その中の「添付ファイル」欄まで移動します。

page_img_03.png

その中から「添付ファイル機能」を「利用する」に変えて、最下部にある「設定する」をクリックすると設定完了です。

必要であればサムネイル画像の自動作成機能とオリジナル画像の縮小機能も設定しましょう。

  • 「サムネイル画像」を「利用する」にすると、アップロードした画像とは別に縦横サイズを変えた画像を自動で作成します。
  • 「オリジナル画像の縮小」を「利用する」にすると、アップロード画像の縦横サイズを自動で変更してくれます。

文章の説明ではなかなか想像しにくいと思いますので、それぞれ設定した場合にアップロードした画像がどうなるのか下図にまとめました(第3回で紹介した内容と同じです)

entry_img_03hosoku.png

あらためて、必要な項目を記入し最後に「設定する」をクリックします。

page_img_04.png

ページ上部に「ページの設定を編集しました」と表示されたら完了です。

記事の編集に戻りましょう。画面左の「ページの編集」をクリックし、画像を添付したい記事の「編集」をクリックします。

page_img_05.png

設定が変更されていれば、本文フォーム下に添付イメージの入力フォームが増えているので、ここで必要な内容を入力しましょう。

  1. アップロードしたい画像はここで設定します。自動サムネイルを「利用する」にしている場合、この画像を元に作成されます。
  2. 手動で作成したサムネイル画像を使いたい場合はここでアップロードします。自動サムネイル画像を「利用する」にしていても、ここで指定した画像が優先して表示されます。
  3. テキストを記入しておくと画像のALTに反映されます。

項目が多くてびっくりするかもしれませんが、最低限1番だけあれば画像をアップロードすることができます。

すべて記入したら「確認する」or「登録する」をクリックして完了です。

page_img_06.png

ふたたび記事を表示し、アップロードした画像が表示されていたら成功です!

一度投稿した記事の内容を変更しよう

ページ記事も投稿後に記事の内容を変更(編集)できます。

page_edit_01.png

まずは管理画面を開き、画面左の「ページ管理」をクリックします。

page_edit_02.png

投稿した記事の一覧が表示されるので、内容を変えたい記事の「編集」をクリックします。

page_edit_03.png

再び投稿画面が出てきますが、編集時には投稿した内容が最初から入力されています。

また画面下部に投稿した日時と投稿ユーザー名が表示されており、最下部には削除ボタンが表示されています。編集ではなく、記事そのものを削除したい場合はこのボタンをクリックすればOKです。

なおページ記事の特徴として、ページIDは原則変更できません。

必要な変更を入力したら最後に「登録する」をクリックして完了です。

親ページと子ページを作成してみよう

ページ機能はカテゴリー機能を持たない代わりに、ページ記事にツリー構造の上下関係を持たせることで分類できます(下図)

ページの親子構造例
親ページ
 ├─子ページ その1
 ├─子ページ その2
 ├─子ページ その3
 └─子ページ その4

長編シリーズを「親ページ=シリーズ名、子ページ=各話」としてまとめたり、「親ページ=ジャンル・モチーフ、子ページ=作品ページ」と内容によって分類するなど、さまざまな用途に使えます。

では作成済みのページ記事を親ページとして、その下に連なる子ページを作成してみましょう。今回使う管理ページは「一度投稿した記事の内容を変更しよう」でも開いた「ページ管理」です。

page_tree_01.png

表示された一覧から、親ページにしたいページIDをクリックします。

page_tree_02.png

さらに表示されたページの「この階層にページを登録する」をクリックします。

page_tree_03.png

ページ投稿画面が表示されます。基本的に新規でページ投稿するときと同じ表示ですが、「親ID」にさきほど選択したページIDがあらかじめ入力されています。

page_tree_04.png

必要な内容を記入し終えたら、「登録する」をクリックします。

ここでワンポイント。子ページのIDを決めるときに「親ID/このページのID」(間に半角スラッシュを入れる)とするルールを決めて入力するとのちのち管理がしやすいです。

page_tree_05.png

遷移したページで「ページを新規に登録しました。」と表示されたら完了です。

page_tree_06.png

ではまず親ページを開いてみます。親ページの本分下に、さきほど登録した子ページへのリンクが表示されているはずです。

page_tree_07.png

リンクをクリックすると子ページの記事が表示されました。子ページ投稿成功です!

予告

第3回と今回でfreoを使って記事を公開することができました。次回はその中で説明し切れなかった万能アップロード機能「メディア機能」について解説します。

freoはじめて物語(5) メディア機能を使いこなそう

テンプレートを探す

人気のテンプレート

更新通知