dependencies updates, readme stuff and optimized head structure
This commit is contained in:
madrilene
parent
f4c113fb46
commit
6edc545db4
6 changed files with 677 additions and 651 deletions
1215
package-lock.json
generated
1215
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -42,7 +42,7 @@
|
|||
"cssnano": "^5.1.7",
|
||||
"dayjs": "^1.11.5",
|
||||
"dotenv": "^16.0.3",
|
||||
"esbuild": "^0.15.10",
|
||||
"esbuild": "^0.16.4",
|
||||
"eslint": "^8.24.0",
|
||||
"eslint-config-prettier": "^8.5.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
|
|
|
|||
22
readme.md
22
readme.md
|
|
@ -1,11 +1,11 @@
|
|||
# Eleventy starter
|
||||
# Eleventy Excellent
|
||||
|
||||
Opiniated but easy to use Eleventy starter, based on the workflow suggested by Andy Bell's buildexcellentwebsit.es.
|
||||
Opiniated but easy to use Eleventy starter, based on the workflow suggested by Andy Bell's [buildexcellentwebsit.es](https://buildexcellentwebsit.es/).
|
||||
|
||||
If you end up using this starter, feel free to send me a link, I'd love to see it!
|
||||
Also let me know if you miss any features. Currently in planning: automatically generated OpenGraph images (as fallback) and dark mode.
|
||||
|
||||
- [Eleventy starter](#eleventy-starter)
|
||||
- [Eleventy Excellent](#eleventy-excellent)
|
||||
- [Preview](#preview)
|
||||
- [Features](#features)
|
||||
- [First steps](#first-steps)
|
||||
|
|
@ -14,7 +14,9 @@ Also let me know if you miss any features. Currently in planning: automatically
|
|||
- [Install dependencies](#install-dependencies)
|
||||
- [Working locally](#working-locally)
|
||||
- [Creating a production build](#creating-a-production-build)
|
||||
- [Built with Eleventy Excellent](#built-with-eleventy-excellent)
|
||||
- [Logbook](#logbook)
|
||||
- [22-12-12](#22-12-12)
|
||||
- [22-11-24](#22-11-24)
|
||||
- [22-11-04](#22-11-04)
|
||||
- [22-10-30](#22-10-30)
|
||||
|
|
@ -36,10 +38,10 @@ https://eleventy-excellent.netlify.app/
|
|||
- Youtube embed with lite-youtube _(see blog post)_
|
||||
- Easy resource fetching with eleventy-fetch _(see blog post)_
|
||||
- Syntax highlighting via eleventy-plugin-syntaxhighlight _(see blog post)_
|
||||
- Advanced markdown handling _(see blog post)_
|
||||
- SEO basics (XML-sitemap, metadata)
|
||||
- dayjs handling dates & times
|
||||
- 301 redirects for Netlify
|
||||
- Advanced markdown handling
|
||||
- Bundling via esbuild
|
||||
- RSS feed
|
||||
- Links to social networks in footer
|
||||
|
|
@ -82,8 +84,20 @@ Minify JS, inline and minify CSS.
|
|||
npm run build
|
||||
```
|
||||
|
||||
## Built with Eleventy Excellent
|
||||
|
||||
- [www.lenesaile.com](https://www.lenesaile.com/)
|
||||
- [stephenanfield.com](https://stephenanfield.com/)
|
||||
- [krgr.dev](https://krgr.dev/)
|
||||
|
||||
## Logbook
|
||||
|
||||
### 22-12-12
|
||||
|
||||
- updated head structure for better performance
|
||||
- added "built with this" section in readme
|
||||
- added note for internal links in markdown blog post
|
||||
|
||||
### 22-11-24
|
||||
|
||||
- updated required node version in package.json
|
||||
|
|
|
|||
|
|
@ -1,7 +1,3 @@
|
|||
<!-- https://htmlhead.dev / https://www.matuzo.at/blog/html-boilerplate/
|
||||
-->
|
||||
|
||||
<!-- Set the base URL for all relative URLs within the document -->
|
||||
<base href="{{ page.url }}" />
|
||||
|
||||
<meta
|
||||
|
|
@ -16,50 +12,30 @@
|
|||
"
|
||||
/>
|
||||
|
||||
<meta name="theme-color" content="{{ meta.themeColor }}" />
|
||||
<meta name="robots" content="index,follow" /><!-- All Search Engines -->
|
||||
<meta name="googlebot" content="index,follow" /><!-- Google Specific -->
|
||||
<meta name="generator" content="eleventy" /><!-- thank you, Zach Leatherman -->
|
||||
<meta name="generator" content="{{ eleventy.generator }}" /><!-- thank you, Zach -->
|
||||
<!-- Disable automatic detection and formatting of possible phone numbers -->
|
||||
<meta name="format-detection" content="telephone=no" />
|
||||
<!-- Helps prevent duplicate content issues -->
|
||||
<link rel="canonical" href="{{ meta.url }}{{ page.url }}" />
|
||||
|
||||
<title>
|
||||
{% if seo.title %} {{ seo.title }}
|
||||
{% elif title %}
|
||||
{{ title }}
|
||||
{% else %}
|
||||
{{ meta.siteName }}
|
||||
{% endif %}
|
||||
</title>
|
||||
|
||||
<!-- Links to information about the author(s) of the document -->
|
||||
<link rel="author" href="humans.txt" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" href="{{ '/favicon.ico' | url }}" sizes="any" />
|
||||
<link rel="icon" href="{{ '/favicon.svg' | url }}" type="image/svg+xml" />
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="{{ '/apple-touch-icon.png' | url }}" />
|
||||
<link rel="icon" type="image/png" href="{{ '/favicon-32x32.png' | url }}" sizes="32x32" />
|
||||
<link rel="icon" type="image/png" href="{{ '/favicon-16x16.png' | url }}" sizes="16x16" />
|
||||
<link rel="manifest" href="{{ '/site.webmanifest' | url }}" />
|
||||
|
||||
{% if meta.meta_data.mastodonProfile %}
|
||||
<!-- Mastodon verified site -->
|
||||
<link rel="me" href="{{ meta.meta_data.mastodonProfile }}" />
|
||||
{% endif %}
|
||||
|
||||
<meta name="theme-color" content="{{ meta.themeColor }}" />
|
||||
<meta name="generator" content="Eleventy" />
|
||||
|
||||
<!-- Facebook Open Graph meta -->
|
||||
<!-- Open Graph meta -->
|
||||
<meta property="og:url" content="{{ meta.url }}{{ page.url }}" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta
|
||||
property="og:title"
|
||||
content="{% if title %}{{ title }}{% else %}{{ meta.siteName }}{% endif %}"
|
||||
/>
|
||||
|
||||
<meta
|
||||
property="og:image"
|
||||
content="{{
|
||||
|
|
@ -68,7 +44,6 @@
|
|||
meta.meta_data.opengraph_default
|
||||
}}{% endif %}"
|
||||
/>
|
||||
|
||||
<meta
|
||||
property="og:description"
|
||||
content="{% if description %}{{ description }}{% else %}{{
|
||||
|
|
@ -79,13 +54,19 @@
|
|||
<meta property="og:locale" content="{{ meta.locale }}" />
|
||||
<meta property="article:author" content="{{ meta.author }}" />
|
||||
|
||||
<!-- Twitter Open Graph meta -->
|
||||
<!-- Twitter meta -->
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
{% if meta.meta_data.twitterSite %}
|
||||
<meta name="twitter:site" content="{{ meta.meta_data.twitterSite }}" />
|
||||
{% endif %} {% if meta.meta_data.twitterCreator %}
|
||||
<meta name="twitter:creator" content="{{ meta.meta_data.twitterCreator }}" />
|
||||
{% endif %}
|
||||
|
||||
<!-- disallow Twitter from using your site's info for personalization purposes -->
|
||||
<meta name="twitter:dnt" content="on" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" href="{{ '/favicon.ico' | url }}" sizes="any" />
|
||||
<link rel="icon" href="{{ '/favicon.svg' | url }}" type="image/svg+xml" />
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="{{ '/apple-touch-icon.png' | url }}" />
|
||||
<link rel="icon" type="image/png" href="{{ '/favicon-32x32.png' | url }}" sizes="32x32" />
|
||||
<link rel="icon" type="image/png" href="{{ '/favicon-16x16.png' | url }}" sizes="16x16" />
|
||||
<link rel="manifest" href="{{ '/site.webmanifest' | url }}" />
|
||||
|
|
|
|||
|
|
@ -3,13 +3,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="{{ meta.lang }}">
|
||||
<head>
|
||||
<!-- charset/http-equiv/viewport -->
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||
{% include "partials/meta-info.njk" %}
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<!-- fonts preload -->
|
||||
<!-- title -->
|
||||
<title>
|
||||
{% if seo.title %} {{ seo.title }}
|
||||
{% elif title %}
|
||||
{{ title }}
|
||||
{% else %}
|
||||
{{ meta.siteName }}
|
||||
{% endif %}
|
||||
</title>
|
||||
|
||||
<!-- synchronous js / schema -->
|
||||
{% include "schemas/base-schema.njk" %}
|
||||
|
||||
<!-- synchronous css / inline css -->
|
||||
<link rel="stylesheet" href="/assets/css/global.css?{{ assetHash }}" />
|
||||
|
||||
<!-- preloads -->
|
||||
<link
|
||||
rel="preload"
|
||||
href="/assets/fonts/inter/inter-v7-latin-500.woff2"
|
||||
|
|
@ -17,7 +32,6 @@
|
|||
type="font/woff2"
|
||||
crossorigin
|
||||
/>
|
||||
|
||||
<link
|
||||
rel="preload"
|
||||
href="/assets/fonts/redhat/red-hat-display-v7-latin-900.woff2"
|
||||
|
|
@ -26,23 +40,11 @@
|
|||
crossorigin
|
||||
/>
|
||||
|
||||
<link rel="stylesheet" href="/assets/css/global.css?{{ assetHash }}" />
|
||||
|
||||
<!-- defer js -->
|
||||
<!-- defered js -->
|
||||
<script type="module" src="/assets/app.js" defer></script>
|
||||
|
||||
<!-- Add facility for pages to declare an array of stylesheet paths -->
|
||||
{% if pageStylesheets %} {% for item in pageStylesheets %}
|
||||
<link
|
||||
rel="stylesheet"
|
||||
media="print"
|
||||
href="{{ item }}?{{ assetHash }}"
|
||||
onload="this.media='all'"
|
||||
/>
|
||||
{% endfor %} {% endif %}
|
||||
|
||||
<!-- include base schema -->
|
||||
{% include "schemas/base-schema.njk" %}
|
||||
<!-- everything else: meta tags, icons, open graph etc. -->
|
||||
{% include "partials/meta-info.njk" %}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -8,6 +8,12 @@ A lot of markdown packages are installed to help you write your posts. You can c
|
|||
|
||||
As of my personal preference, there are some presets. For example the automatic conversion of web pages to links (lenesaile.com) and the automatic addition of `target: '_blank'` and `rel: 'noreferrer noopener'` for external links (all links with the pattern`/^https?:/`).
|
||||
|
||||
This is a small pitfall! Take care to not prefix your internal links with your domain, or else they will be treated ad external as well. To link internally use this pattern:
|
||||
|
||||
```
|
||||
An internal link to the [about page](/about/)
|
||||
```
|
||||
|
||||
## h2 Heading
|
||||
|
||||
### h3 Heading
|
||||
|
|
|
|||
Loading…
Reference in a new issue