前回のつづきです。
wagonを使うとテンプレート（html,css,js,imageとかasset)をさくっと作れます。
siteを作ったらこういうdirができます。
.
├── Gemfile
├── Gemfile.lock
├── app
│ ├── content_types
│ └── views
│ ├── pages
│ │ ├── index.liquid
│ └── snippets
│ └── footer.liquid
├── config
│ ├── deploy.yml
│ ├── site.yml
│ └── translations.yml
├── config.ru
├── data
├── log
│ └── wagon.log
└── public
├── fonts
│ ├── ...
├── images
│ ├── hoge_banner_A.jpg
├── javascripts
│ ├── bootstrap.js
│ ├── bootstrap.min.js
│ ├── jquery-1.6.3.min.js
├── samples
│ └── favicon.png
└── stylesheets
├── bootstrap-theme.css
├── bootstrap.css
├── bootstrap.min.css
/app/view以下に置いたファイルがpageとしてlocomotiveアプリにデプロイできます。
とっつきにくいのはなんといっても
〜〜.liquid
です。
shopifyのストア編集機能で使われているhamlっぽい記法です。
{{ page.title }}
や
{{ 'bootstrap.min.css' | stylesheet_tag }}
など。
詳しい記法はドキュメントをみてください。
きっと後で書く場面があります。
wagon serveでサーバを動かしブラウザで見た目を確認しながら、/app/view以下でhtmlを、/public配下でassetsを編集するでしょう。
そしてpageができたら自分のlocomotiveCMSにデプロイします。
準備は簡単。
/config/deplay.ymlをいじるだけ。
development:
host: localhost:8080
email: [email protected]
password: nakamayakinnikunn
staging:
host: www.example.com
email: [email protected]
password: apassword
# api_key: <your api key here>
production:
host: www.example.com
email: [email protected]
password: apassword
# api_key: <your api key here>
自分で作ったlocomotiveアプリが動いているhost名、email、passwordを設定します。
いざデプロイ！
$ bundle exec wagon push staging
管理画面でローカルでつくったページが表示されることを確認してください。
これでひとまずcmsつくって簡単にpage編集できるようになりましたね。
あと対応すべきなのはi18nぐらいですかね。メモが溜まればポストします。
rubyistが最小限の努力で知り合いから感謝され、焼き肉でも奢ってもらえれば幸いです。
この後のオススメ
ハマりどころ
- liquid
デプロイ時はwagonが自動的にassetsをアップロードしてくれるのですが、/public/site/にhash値のdirを作成します。
この辺りのpath指定は先ほど紹介したliquidを使って書かないと自動で変換してくれません。
ですので、assetsの指定の部分は最低liquidで書く必要があります。
- 画像アップロード
管理画面から画像をアップロードするリンクが見つけにくいです。ページ編集の一番下にあります。
