Setup and First Implementation

セットアップ・はじめての実装

導入

かんたんセットアップ

POSTEASE のセットアップはわずか2ステップで完了します。
(あらかじめパッケージをダウンロードしてください)

STEP 1

postease の設置

  • ダウンロードした zip ファイルを解凍します。
    ※ Safariでダウンロードした場合はすでに解凍済みです。
  • 解凍してできあがったフォルダ「postease-master」を「postease」(任意の名前)にリネームします。
  • 「postease」をPHP5.1 以上がつかえるサーバの公開ルートにアップロードします。

root (https://example.com)
  |
  |-- postease
  |
  |-- index.html
  |-- about.html
  |-- ..

STEP 2

初期設定

上記例の場合、https://example.com/postease でアクセスできます。

  • 受信可能なメールアドレスを入力してアクティベーションキーを取得します。
  • メールアドレスに送信された24桁のアクティベーションキーを入力します。
  • アカウントとパスワードを半角英数字で入力します。
    ※ パスワードはセキュリティ保全のためできるだけ自動生成を利用してください。
  • データベースはデフォルトのまま SQLite を選択します。
  • テーブル接頭辞は自動生成ボタンで生成します。
  • 念のためパスワードをダウンロードしておきます。

必要項目の入力がおわったら、右下の「設定する」ボタンを押して初期設定を完了します。

*

NEXT STEP

さあ、使いはじめましょう

STEP2で登録したアカウントとパスワードを入力してログインします。使い始めましょう。

*

はじめての実装 1

WEBサイトと POSTEASE をつなぐ

POSTEASE API を利用してWEBサイトと POSTEASE を接続します。
接続したら投稿データの一覧を取得して内容を確認します。

STEP 1

配置の確認

サーバ内のディレクトリ構造がこのようになっているとします。

index.php を POSTEASE に接続する手順を見ていきます。


root (https://example.com)
|
|-- postease
|
|-- index.php
|-- about.php
|-- ..

STEP 2

POSTEASE API に接続

APIに接続するコードを書きます。接続はこれで完了です。


require_once dirname(__FILE__) . '/postease/api/local.php';

STEP 3

投稿データを取得

投稿データ一覧を取得するコードを書きます。1行で完了です。


require_once dirname(__FILE__) . '/postease/api/local.php';

$posts = get_posts();

// データ内容を確認する
print '<pre>';
print_r($posts);
print '</pre>';

はじめての実装 2

動的化

条件つきで投稿データを取得してくりかえし構文でHTMLを動的化します。

STEP 1

HTMLの用意

最新のニュースを3件表示するHTMLを用意します。

  • アイキャッチ画像のサムネイル
  • タイトル
  • 本文の最初の20文字

<html>
...
<div class="news-wrapper">

  <div class="news">
    <img src="img/news/01.png" alt="*">
    <h3>ニュース1のタイトル</h3>
    <p>ニュース1の本文の最初の20文字だけ表示..<p>
  </div>

  <div class="news">
    <img src="img/news/02.png" alt="*">
    <h3>ニュース2のタイトル</h3>
    <p>ニュース2の本文の最初の20文字だけ表示..<p>
  </div>

  <div class="news">
    <img src="img/news/03.png" alt="*">
    <h3>ニュース3のタイトル</h3>
    <p>ニュース3の本文の最初の20文字だけ表示..<p>
  </div>

</div>
...
</html>

STEP 2

動的化

STEP1 で用意した静的なHTMLを動的化します。

APIから取得した投稿データを foreach くりかえし構文で書き出します。おおまかな手順は4つです。

  • POSTEASE API に接続
  • データの取得条件を指定
  • 取得条件つきでデータを取得
  • くりかえし構文を使ってHTMLを動的にレンダリング

以上でニュース一覧の動的化は完了です。

このように POSTEASE は動的にしたい部分だけを自由に選んで実装できます。


<?php
// 1.POSTEASE API に接続
require_once dirname(__FILE__) . '/postease/api/local.php';

// 2.取得条件を指定
$config = [
'orderby' => 'DESC', // 新しい順で
'limit'   => 3, // 3件のみ
'content_length' => 20, // 本文は20文字だけ
];

// 3.取得条件つきでデータを取得
$posts = get_posts($config);

// 4.以下HTMLを動的にレンダリング ↓
?>

<html>
...
<div class="news-wrapper">

  <?php foreach ($posts['list'] as $row) ?>

  <div class="news">
    <img src="<?=$row['eyecatch']?>" alt="*">
    <h3><?=$row['title']?></h3>
    <p><?=$row['content']?>..<p>
  </div>

  <?php endforeach ?>

</div>
...
</html>