archive.albums.lens

<koken:include file="inc/header.html" />

<!-- Add Facebook Open Graph and Twitter Cards metadata for nicer sharing -->
<!-- Using a separate koken:load for this so it doesn't conflict with page data -->
<koken:load limit="4">
	<koken:head>
		<meta property="og:site_name" content="{{ site.title }}" />
		<meta property="og:title" content="{{ labels.album.plural }}" />
		<meta property="og:description" content="{{ site.description strip_html='true' }}" />
		<meta property="og:type" content="website" />
		<koken:first>
			<koken:covers>
				<koken:first>
					<meta property="og:image" content="{{ content.presets.medium_large.url }}" />
					<meta property="og:image:width" content="{{ content.presets.medium_large.width }}" />
					<meta property="og:image:height" content="{{ content.presets.medium_large.height }}" />
				</koken:first>
			</koken:covers>
		</koken:first>
		<meta property="og:url" content="{{ location.site_url }}{{ location.here }}" />
		<koken:not empty="profile.twitter">
			<meta name="twitter:card" content="gallery" />
			<meta name="twitter:site" content="@{{ profile.twitter }}" />
			<meta name="twitter:creator" content="@{{ profile.twitter }}" />
			<koken:loop>
				<koken:covers>
					<koken:shift>
						<meta name="twitter:image{{ index }}" content="{{ content.presets.medium_large.cropped.url }}">
					</koken:shift>
				</koken:covers>
			</koken:loop>
		</koken:not>
	</koken:head>
</koken:load>

<!-- Load this template's source data (albums) and limit for pagination -->
<koken:load limit="20">

	<!-- Display breadcrumb navigation -->
  <nav id="bread">
    <koken:breadcrumbs />
  </nav>

	<div class="lcol">

				<!-- Loop over all albums, render each with the following -->
		<koken:loop>

			<!-- wrapper used for keyboard navigation targetting -->
			<section class="item">

				<!-- Display each album's first album cover, link to album.lens -->
				<koken:link title="View {{ album.title }}">
					<koken:img />
				</koken:link>

				<!-- To display all covers, use koken:covers -->
				<!--
				<koken:covers>
					<koken:loop>
						<koken:link title="View {{ album.title }}">
							<koken:img size="1:1" />
						</koken:link>
					</koken:loop>
				</koken:covers>
				-->

				<!-- Display each album's title, link to album.lens -->
				<h2><koken:link title="View {{ album.title }}">{{ album.title }}</koken:link></h2>

				<!-- Display the album's summary (shorter than description) -->
				{{ album.summary paragraphs="true" }}

				<footer>

					<ul class="blank">

						<!-- Display the timestamp -->
						<li>
							<strong>Published:</strong>
							<!-- Link to view all albums published the same month -->
							<koken:link to="archive" title="View all albums published this month">
								<koken:time />
							</koken:link>
						</li>

						<!-- Display album categories, link each to archive.albums.lens -->
						<koken:categories>
							<li>
								<strong>{{ labels.category.plural }}:</strong>
								<koken:loop separator=", ">
									<koken:link title="View all {{ labels.album.plural case='lower' }} in {{ category.title }}">
										{{ category.title }}
									</koken:link>
								</koken:loop>
							</li>
						</koken:categories>

						<!-- Display album tags, link each to archive.albums.lens -->
						<koken:tags>
							<li>
								<strong>{{ labels.tag.plural }}:</strong>
								<koken:loop separator=" ">
									<koken:link title="View all {{ labels.album.plural case='lower' }} in #{{ tag.title }}">
										#{{ tag.title }}
									</koken:link>
								</koken:loop>
							</li>
						</koken:tags>

					</ul>

				</footer>

			</section>

		</koken:loop>

		<!-- Display pagination links -->
		<koken:include file="inc/pagination.html" />

	</div> <!-- close .lcol -->

	<div class="rcol">

		<aside>

			<section>
				<!-- Links to view albums by publish date in archive.albums.lens -->
				<h5>View {{ labels.album.plural case="lower" }} by date</h5>
				<koken:dates limit_to="albums">
					<koken:select label="Select month" />
				</koken:dates>
			</section>

			<section>
				<!-- Links to view albums by category in archive.albums.lens -->
				<koken:categories limit_to="albums" order_by="album_count">
					<h5>View {{ labels.album.plural case="lower" }} by {{ labels.category.singular case="lower" }}</h5>
					<koken:loop>
						<koken:link title="View all {{ labels.album.plural case='lower' }} in {{ category.title }}">
							{{ category.title }} ({{ category.counts.total }})
						</koken:link>
						<br>
					</koken:loop>
				</koken:categories>
			</section>

			<section>
				<!-- Links to view albums by tag in archive.albums.lens -->
				<koken:tags limit_to="albums" order_by="album_count">
					<h5>View {{ labels.album.plural case="lower" }} by {{ labels.tag.singular case="lower" }}</h5>
					<koken:loop>
						<koken:link title="View all {{ labels.album.plural case='lower' }} in #{{ tag.title }}">
							{{ tag.title }} ({{ tag.counts.total }})
						</koken:link>
						<br>
					</koken:loop>
				</koken:tags>
			</section>

		</aside>

	</div> <!-- close .rcol -->

<!-- Fallback content if no data was loaded by koken:load -->
<koken:else>

	<!-- Display fallback message in Site editor only -->
	<koken:note>
		No albums found
	</koken:note>

</koken:load>

<koken:include file="inc/footer.html" />