Getting Started

要求事項

• PHP 5.4+ が使えること
• Apacheで mod_rewriteが使えること。もしくは同等の機能が使えること。

インストール

手動インストール

Choco の最新版をダウンロードして解凍

git clone でインストール

git clone https://github.com/tsubo/Choco.git

composer でライブラリをインストール

cd your_choco_dir
curl -s https://getcomposer.org/installer | php
php composer.phar install

動作確認

webrootディレクトリに移動し、PHPビルトインサーバでChocoを起動

cd your_choco_dir/webroot
php -S localhost:8000

wwwブラウザで http://localhost:8000 を表示

ブログ

ブログ記事の編集は管理画面から行います。
ログインすると管理画面が使えるようになります。
User/Passwordは config.php内で指定します。

ページの作成

ページを作成するには view/pageディレクトリに *.html.twigファイルを作成します。

①view/pageディレクトリに移動

②雛形ファイルをコピーして新しいページを作成

• _SKELETON.html.twig（雛形ファイル）をコピーしてファイル名を変更。 この説明では new_page.html.twigとします。
• http://localhost:8000/new_page で新しいページが表示されることを確認。

③ページ情報を変更

• テキストエディタを使ってnew_page.html.twigの内容を変更します。
• 変更後にhttp://localhost:8000/new_page でページ情報が変更されていることを確認。

{#--------------------
 # page title
 #--------------------#}
{% block page_title %}__PAGE TITLE__{% endblock %}

{#-----------------------------------------------------
 # body id (This is used to identify the page by css.)
 #-----------------------------------------------------#}
{% block body_id %}__BODY ID__{% endblock %}

{#--------------------
 # document header
 #--------------------#}
{% block doc_header %}
  {% embed 'partial/doc_header.html.twig' %}
    {% block content %}
      <h1>__DOC HEADER TITLE__</h1>
      <p class="lead">__DOC HEADER LEAD__</p>
    {% endblock %}
  {% endembed %}
{% endblock %} {# dec_header #}

変更箇所	内容
__PAGE_TITLE__	HTMLの titleタグ
__BODY_ID__	HTMLの bodyタグの id属性。 必要が無ければ設定しなくても大丈夫です。
__DOC HEADER TITLE__	ページ上部に表示されるタイトル
__DOC HEADER LEAD__	ページ上部に表示されるページの説明文

④ページ内容を変更

テキストエディタを使ってnew_page.html.twigの内容を変更します。
**__CONTENT__**の部分にHTMLでページ内容を記述します。

{% block layout %}
  {% embed 'layout/12.html.twig' %}
    {#--------------------
     # content
     #--------------------#}
    {% block content %}
      __CONTENT__  <--- この部分にHTMLでページ内容を記述します。
    {% endblock %} {# content #}
  {% endembed %}
{% endblock %} {# layout #}

Markdown形式でページ内容を記述することも出来ます。

{% block layout %}
  {% embed 'layout/12.html.twig' %}
    {#--------------------
     # content
     #--------------------#}
    {% block content %}
      {% markdown %}        <--- markdown ブロックで囲む。
        # Mark Down の例    <--- ここにmarkdownでページ内容を記述します。
        ## ヘッダ2
        ### ヘッダ3

        * リスト1
        * リスト2
        * リスト3
      {% endmarkdown %}     <--- markdown ブロックで囲む。
    {% endblock %} {# content #}
  {% endembed %}
{% endblock %} {# layout #}

ページファイルの場所とURLの関係

ページファイルの場所	URL
view/page/index.html.twig	/
view/page/sub.html.twig	/sub
view/page/sub/index.html.twig	/sub (上と同じ)
view/page/sub/page.html.twig	/sub/page
view/page/a/very/long/url.html.twig	/a/very/long/url

メニューの追加

新しく作成したページをメニューに追加するには、テキストエディタで view/partial/header.html.twigファイルを編集します。

①view/partialディレクトリに移動

②header.html.twig を編集

MENU ITEM SKELETON と書かれた部分の li タグをコピーして
li タグを１行増やします。

<ul class="nav navbar-nav">
  {# Menu Item #}
  <li class="{{resource_uri == '/' ? 'active'}}"><a href="{{siteUrl('/')}}">Home</a></li>
  <li class="{{resource_uri == '/page' ? 'active'}}"><a href="{{siteUrl('page')}}">Page</a></li>
  <li class="{{resource_uri starts with '/blog' ? 'active'}}"><a href="{{siteUrl('blog')}}">Blog</a></li>
  <li class="{{resource_uri == '/contact' ? 'active'}}"><a href="{{siteUrl('contact')}}">Contact</a></li>

  <li class="{{resource_uri == '__PATH__' ? 'active'}}"><a href="{{siteUrl('__PATH__')}}">__MENU_TITLE__</a></li>

  {# ----- MENU ITEM SKELETON -----  *** ↓ ここをコピーして ↑ 上に１行 li タグを増やす ***
  <li class="{{resource_uri == '__PATH__' ? 'active'}}"><a href="{{siteUrl('__PATH__')}}">__MENU_TITLE__</a></li>
   -------------------------------- #}
</ul>

__PATH__と__MENU_TITLE__を変更する。
__PATH__は２箇所あります。**'/'**の有無に注意して下さい。 以下はnew_page.html.twigを追加した例です。

<li class="{{resource_uri == '/new_page' ? 'active'}}"><a href="{{siteUrl('new_page')}}">新しいページ</a></li>

http://localhost:8000 で新しいメニューが表示されることを確認。