読者です 読者をやめる 読者になる 読者になる

Djangoroidの奮闘記

python,django,angularJS1~三十路過ぎたプログラマーの奮闘記

django備忘録10 Third Party Library - Django Crispy Forms

参照サイト

try-django-1.8 というjustinさんのサイトを参考に学習を進めています。 https://www.youtube.com/watch?v=KsLHt3D_jsE

markdown記法の備忘録用のリンク Markdown記法 チートシート - Qiita

Formの修正方法とか、Crispy Forms のinstallとか

  • とかすると、btnが今風になる。

  • その辺の詳しい修正方法は、bootstrap のcssの箇所参照:

CSS · Bootstrap

'$pip install --upgrade django-crispy-forms' するだけ

  • settings.py
INSTALLED_APPS = (
    ...
    # third party apps
    'crispy_forms',
     # myapps
)

サードパーティ→myappsの順番で記載する。読み込みの順番とかの問題?

  • settings.pyに、
CRISPY_TEMPLATE_PACK = 'bootstrap3'

を追加 bootstrap3の部分は、色々変更可能ぽい。

  • {% load crispy_forms_tags %} を挿入 これにより、crispy_forms_tagsが使えるようになる!

  • 簡単な使い方の例は、 {{ form.as_p }} → {{ form|crispy }}

とするだけで、crispy formに変形

  • bootstrap3 のgrid systemで、フォームの幅とかを調整する。

この辺を参照: CSS · Bootstrap

  • 導入方法はシンプルで、
<div class="row">
  <div class="col-md-1">.col-md-1</div>
...
  </div>
</div>

こんな感じで、コピペして</div>で閉じる感じです。

  • colum のsm,mdとかについて
<div class="col-sm-6 col-md-4">

とかってすると、ブラウザがsmの時は、sm-6, mdの時は、md-4とかいう感じで、条件でサイズを指定できる。

調べ物とか

foundation Foundation In creators words “The most advanced responsive front-end framework in the world”. This template pack is externally available through crispy-forms-foundation

とのことで、foundationにも対応している模様。