--- title: Using teasers in Hakyll author: Ivan Veselov --- ## Introduction Sometimes it is convenient to have an excerpt of a post displayed on the index page along with a "Read more..." link to encourage your readers to read the rest of the post. You can do this in Hakyll by using "teasers" functionality. ## Marking teasers in posts First, you have to put a tag in your post which separates the teaser from the rest of the article. We use `` for this to mimic the [WordPress convention](http://codex.wordpress.org/Customizing_the_Read_More): ``` markdown --- title: My teasering post --- In this post I'll try to explain how to use teasers. And here I am proceeding with the explanation. ``` This is an HTML comment, so it doesn't have any visual impact on the post, it is there solely for semantic purposes. ## Referring to teasers in templates Now, we want to refer to the teaser in the template. We can do this pretty intuitively by using `$teaser$` key: ``` html
  • $date$ - $title$

    Teaser: $teaser$

    Read more
  • ``` ## Gluing together The only thing left is to glue those things together. An important question here is on what stage of the compilation we want to extract a teaser. Usually, we want to use pandoc output, i.e. raw HTML without any templates applied (since we do not want some surrounding JavaScript or common text from the templates to be included in the teaser). We can specify this by using snapshots: we save the snapshot during compilation and load it to resolve `$teaser$` key later: ``` haskell match "posts/*" $ do route $ setExtension ".html" compile $ pandocCompiler -- save immediately after pandoc, but before the templates are applied >>= saveSnapshot "content" >>= loadAndApplyTemplate "templates/post.html" defaultContext ... ``` You can read more about snapshots in [Snapshots tutorial](/tutorials/05-snapshots-feeds.html). Then we use this snapshot while generating teasers using `teaserContext` function: ``` haskell loadAndApplyTemplate "template/postitem.html" (teaserContext "content" <> defaultContext) item ``` Here, we've just added a new context which knows how to handle `$teaser$` key to the default context (note that we passed the same snapshot name `"content"` which we used while saving). ## Known issues Since we use an HTML comment `` to separate the teaser, sometimes `pandoc` can "eat" the comment while converting (for example this happens with literate Haskell source). In order to overcome this problem you may try to use something like this as a separator: ``` html
    ```