CKAN 前端開發(v2.9): 自訂 base template

 http://docs.ckan.org/en/2.9/contributing/frontend/template-tutorial.html

page.html 提供基本 CKAN 網頁結構及其 header、footer。

{% extends "page.html" %}

page.html template 中有許多 block 可擴充，最常用的就是 *_content：

• primary_content
• secondary_content: sidebar
• breadcrumb_content
• actions_content: breadcrumb 左邊的 actions bar 

Primary Content

加入以下內容：

{% block primary_content %}

  {{ super() }}

  {% block my_content %}

    <h2>{{ _('This is my content heading') }}</h2>

    <p>{{ _('This is my content') }}</p>

  {% endblock %}

{% endblock %}

把內容放在 block，如此其他 template 也能覆寫。

Secondary Content

通常由 reusable module 的 snippet 內容組成。snippet 可讓 template 保持簡潔，方便 theme extension 覆寫。

{% block primary_content %}
  {{ super() }}
  {% block my_sidebar_module %}
    {% snippet "snippets/my-sidebar-module.html" %}
  {% endblock %}
{% endblock %}

Breadcrumb 及 Actions

每個網頁上方都有 breadcrumb ，也用來顯示這個網頁可做的 action。

{% block breadcrumb_content %}

  <li class="active">{% link_for _('Viewing Dataset'), named_route=pkg.type ~ '.read', id=pkg.id %}</li>

{% endblock %}

{% block actions_content %}

  {{ super() }}

  <li class="active">{% link_for _('New Dataset'), named_route='dataset.new', class_='btn', icon='plus' %}</li>

{% endblock %}

Scripts 及 Stylesheets

透過 styles 及 scripts 這兩個 block 可自訂樣式及 JavaScript。這功能將被 {% resource %} 取代。

{% block styles %}

  {{ super() }}

  <link rel="stylesheet" href="{% url_for_static "my-style.css" %}" />

{% endblock %}

{% block scripts %}

  {{ super() }}

  <script src="{% url_for_static "my-script.js" %}"></script>

{% endblock %}