Collections

How the pages are organized.

Page collections

On the Troop 370 website, the pages organized into collections. The collections are as follows: About, Information, Events, Members, Photos, Contact, Payments, and Store.

To place a page into a collection , pages should be saved in the appropriate folder. See below for the folder structure with each collection

repository: troop370
    /_collections
        /_about
        /_contact
        /_events
        /information
        /_members
        /_payments
        /_photos
        /_store

Pages must be placed in a collection for them to appear in the site navigation

All pages should be placed in a collection in order to keep the file structure organized

Where are collections defined?

Collections are defined in _config.yml

_config.yml

collections:
  about:
    output: true
    permalink: /:path.html
  information:
    output: true
    permalink: /information/:path.html
  events:
    output: true
    permalink: /events/:path.html
  members:
    output: true
    permalink: /members/:path.html
  photos:
    output: true
    permalink: /:path.html
  contact:
    output: true
    permalink: /:path.html
  payments:
    output: true
    permalink: /pay/:path.html
  store:
    output: true
    permalink: /pay/:path.html
collections_dir: _collections

For each collection,outputmust be set to true in order for the pages to generated.

Setting permalink allows you to control the generated file path for the pages in that collection. For example, permalink: /:path.html sets the the generated pages on the about collection to be at troop370atlanta.org/file-name.html, and permalink: /members/:path.html sets the the generated pages on the members collection to be at troop370atlanta.org/members/file-name.html.

Permalinks can also be set to generate pages in the same directory for multiple collections.

When setting permalinks to generate multiple collections in the same directory, ensure there are no duplicate files names.

Collection pages in page navigation

Collections can be added to the page navigation in _layouts/default.html. If there is more than one page visible in the collection, the collection will automatically appear as a dropdown.

Top navigation

Navigation items for a collection can be added to the top navigation using _includes/topnav-item.html.

_layouts/default.html

<ul id="main-nav">
    {% include topnav-item.html collection="information" collection-label="info" collection-label-hide-small="rmation" %}
</ul>

With the topnav-item include, the collectionattribute value should be the name of the collection as defined in _config.yml, and the collection-label attribute should be the name of the collection that is displayed in the navigation. Additionally, and optional collection-label-small attribute value can be text that should be hidden from the navigation when the browser width is smaller.

Side navigation

Navigation items for a collection can be added to the top navigation using _includes/sidenav-item.html.

_layouts/default.html

<ul id="slide-out" class="sidenav">
    {% include sidenav-item.html collection="information" collection-label="Information" %}
</ul>

With the topnav-item include, the collectionattribute value should be the name of the collection as defined in _config.yml, and the collection-label attribute should be the name of the collection that is displayed in the navigation.

Hiding pages within collections

Sometime pages that are in collections should not be displayed in the top or side navigation. If this is the case, in the page's front matter, add menu: hide.

---
menu: hide
---