lektor-website/docs/content/attachments/index.html

301 lines
8.6 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="../../../static/styles.css?h=dff0aaad">
<link rel="stylesheet" href="../../../static/pygments.css">
<link rel="shortcut icon" href="../../../static/favicon.png?h=fa09bedd">
<title>Attachments | Documentation | Lektor Static Content Management System</title>
</head>
<body class="default">
<nav class="navbar navbar-inverse navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="../../../">Lektor</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="../../../downloads/">Download</a></li>
<li class="active"><a href="../../">Documentation</a></li>
<li><a href="../../../showcase/">Showcase</a></li>
<li><a href="../../../plugins/">Plugins</a></li>
<li><a href="../../../community/">Community</a></li>
<li><a href="../../../blog/">Blog</a></li>
</ul>
</div>
</div>
</nav>
<div class="body-wrapper">
<div class="container">
<div class="row">
<div class="col-sm-3">
<ul class="tree-nav nocontent">
<li><a href="../../">Welcome</a></li>
<li><a href="../../what/">What is Lektor</a>
<li><a href="../../installation/">Installation</a>
<li><a href="../../quickstart/">Quickstart</a>
<li><a href="../../project/">Project</a>
<li><a href="../">Content</a>
<ul>
<li><a href="../alts/">Alternatives</a>
<li class="active"><a href="./">Attachments</a>
<ul></ul>
<li><a href="../databags/">Data Bags</a>
<li><a href="../flow/">Flow</a>
<li><a href="../paths/">Paths</a>
<li><a href="../system-fields/">System Fields</a>
<li><a href="../urls/">URLs and Slugs</a>
</ul>
<li><a href="../../templates/">Templates</a>
<li><a href="../../themes/">Themes</a>
<li><a href="../../guides/">Guides</a>
<li><a href="../../deployment/">Deployment</a>
<li><a href="../../plugins/">Plugins</a>
<li><a href="../../models/">Data Modelling</a>
<li><a href="../../cli/">Command Line</a>
<li><a href="../../api/">API</a>
<li><a href="../../search/">Search</a>
</ul>
<div class="visible-md-block visible-lg-block">
<h4>This Page</h4>
<ul class="toc">
<li><a href="#attachment-types">Attachment Types</a></li>
<li><a href="#metadata">Metadata</a></li>
</ul>
</div>
</div>
<div class="col-sm-9 doc-styling">
<h1>Attachments</h1>
<ul class=page-meta>
</ul>
<p>Each page in Lektor can have attachments appended. These files are stored
directly in the page folder and become available publicly.</p>
<h2 id="attachment-types">Attachment Types</h2><p>For the most part Lektor does not care much about what types your attachments
are but it will specially handle some. In particular image formats supported
by browsers have special support for automatic thumbnailing and accessing
basic image data.</p>
<p>The following file formats are specially handled:</p>
<table>
<thead><tr>
<th>Type</th>
<th>Extensions</th>
</tr>
</thead>
<tbody>
<tr>
<td>Image</td>
<td>.jpg .jpeg .gif .png</td>
</tr>
<tr>
<td>Video</td>
<td>.avi, .mpg, .mpeg, .wmv, .ogv</td>
</tr>
<tr>
<td>Audio</td>
<td>.mp3, .wav, .ogg</td>
</tr>
</tbody>
</table>
<h2 id="metadata">Metadata</h2><p>Attachments can also be given metadata. For this you need to create a lektor
content file with the same name as the attachment but with <code>.lr</code> added as
extra extension:</p>
<table>
<thead><tr>
<th>File</th>
<th>Metadata file</th>
</tr>
</thead>
<tbody>
<tr>
<td>sunset.jpeg</td>
<td>sunset.jpeg.lr</td>
</tr>
<tr>
<td>code.py</td>
<td>code.py.lr</td>
</tr>
</tbody>
</table>
<p>Attachments can be <a href="../../models/attachments/" class="ref">given a default model</a> or
a model can be explicitly given in the metadata content file with the <code>_model</code> field.</p>
<p>Here is a basic example:</p>
<pre><code>_model: image
---
description: A beautiful sunset.
---
photographer: Mr. Peter John Doe
---
copyright: 2015 by Mr. Peter John Doe
</code></pre>
<div class="comment-box">
<h2>Comments</h2>
<div id="disqus_thread"></div>
<script>
var disqus_config = function() { this.page.identifier = "/docs/content/attachments"; this.page.url = "https://www.getlektor.com/docs/content/attachments/"; };
(function() {
var d = document, s = d.createElement('script');
s.src = '//lektordocumentation.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
</script>
<noscript>
Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript"
rel="nofollow">comments powered by Disqus.</a>
</noscript>
</div>
</div>
</div>
</div>
</div>
<div class="bottomsummary">
<div class="container">
</div>
</div>
<footer>
<div class="container">
<div class="row">
<div class="col-sm-4 icon-bar">
<a href="https://github.com/lektor/lektor/" title="Lektor on GitHub"
><i class="fa fa-github"></i></a>
<a href="https://github.com/lektor/lektor/issues/" title="Report Issues for Lektor"
><i class="fa fa-bug"></i></a>
<a href="https://twitter.com/getlektor" title="Find Lektor on Twitter"
><i class="fa fa-twitter"></i></a>
<a href="https://gitter.im/lektor/lektor" title="Chat on Gitter"
><i class="fa fa-comment"></i></a>
<a href="https://github.com/lektor/lektor-website/tree/master/content/docs/content/attachments/contents.lr" title="View source for this page"><i class="fa fa-code"></i></a>
</div>
<div class="col-sm-8">
<a href="../../../license/">License & Copyright</a>
<a href="../../../contact/">Contact</a>
Made with <i class="fa fa-fw fa-heart" title="Heart"><span hidden>Heart</span></i> in Carinthia
</div>
</div>
</div>
</footer>
<script type=text/javascript src="../../../static/app.js?h=ee15141e" charset="utf-8"></script>
<script>
((window.gitter = {}).chat = {}).options = {
room: 'lektor/lektor',
activationElement: null
};
document.write('<button class="js-gitter-toggle-chat-button">Toggle Chat</button>');
var dnt = navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack;
if (dnt != "1" && dnt != "yes") {
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-70822533-1', 'auto');
ga('set', 'anonymizeIp', true);
ga('send', 'pageview');
} else {
console.debug("Respecting Do-Not-Track, not running analytics.");
}
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<script async defer id="github-bjs" src="https://buttons.github.io/buttons.js"></script>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
<script src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer></script>
</body>
</html>