Skip to content

Instantly share code, notes, and snippets.

@LordAmit

LordAmit/amp.html

Last active July 19, 2020 16:47
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save LordAmit/34c2c2e59f072091cf6729dbe6e7d7f4 to your computer and use it in GitHub Desktop.
Save LordAmit/34c2c2e59f072091cf6729dbe6e7d7f4 to your computer and use it in GitHub Desktop.
Download ZIP
AMP html for the jekyll now amp thing https://amitsealami.com/blog/2020/07/18/using-amp-in-jekyll/
Raw
amp.html
<!doctype html>
<html amp lang="en">
<head>
{% include meta.html %}
<link rel="canonical" href="{{ site.url}}{{site.baseurl}}{{ page.url | replace: '/amp', '' }}">
<title>{% if page.title %}{{ page.title }} – {% endif %}{{ site.name }}</title>
{% capture styles %}
{% include amp_style.scss %}
{% endcapture %}
<style amp-custom>
{{ styles | scssify }}
</style>
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<link rel="alternate" type="application/rss+xml" title="{{ site.name }} - {{ site.description }}" href="{{ site.baseurl }}/feed.xml" />
{% include favicons.html %}
<script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
<body>
<div class="wrapper-masthead">
<div class="container">
<header class="masthead clearfix">
<a href="{{ site.baseurl }}/" class="site-avatar">
<!-- <img src="/{{ site.avatar }}" alt="{{ site.name }}"/> -->
<amp-img width="480" height="480" layout="responsive" src="/images/resized/480/portrait.webp"></amp-img>
</a>
<div class="site-info">
<h1 class="site-name"><a href="{{ site.baseurl }}/">{{ site.name }}</a></h1>
<p class="site-description">{{ site.description }}</p>
</div>
<nav>
<a href="/">Home</a>
<a href="{{ site.baseurl }}/">Blog</a>
<a href="{{ site.baseurl }}/archive/">Archive</a>
</nav>
</header>
</div>
</div>
<div id="main" role="main" class="container">
<article class="post">
<h1>{{ page.title }}</h1>
<div class="date">
Written on {{ page.date | date: "%B %e, %Y" }}
{% if page.last_modified_at %}
, Last updated on: {{ page.date | date: "%B %e, %Y" }}
{% endif %}
</div>
<div class="entry">
{{ content }}
</div>
</article>
</div>
<div class="wrapper-footer">
<div class="container">
<footer class="footer">
{% include svg-icons.html %}
</footer>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment