Base project for eleventy websites
Generally, configuration is done in the .eleventy.js file. But for this project, configuration should be done in the JS files inside the src/config directory.
Collections are set in the file src/config/collections.js. The keys in this JS file will be the collection key in the collections object of Eleventy. So if the key in this file is pages, the collection will be accessed via collections.pages.
Each key should have a function value that returns an Eleventy collections object. See Eleventy documentation for details.
Eleventy filters are set in the file src/config/collections.js. Each key in this file will be the filter name in your template files. So if the key is markdown, you will use the filter in the template as {{ data | markdown }}.
Each key in this file should be mapped to a function value that will handle the filter. See Eleventy documentation for details.
Passthroughs should be in the src/config/passthrough.js. Each property in this file's exports should be mapped to a function that returns a key-value pair, where the key is the path of the passthrough in the src directory and the value is the path of the passthrough in the rendered site. Check Eleventy docs for details.
Plugins should be set in the src/config/plugins.js. Each property in this file's exports should be mapped to a function that returns an object with the following keys:
plugin: the plugin objectoptions: the set of options that should be passed to the plugin
The title of the website. This is also the default title of webpages.
The description of the website. This is also the default content of <meta name="description"> tag.
The base URL of this website with no trailing slash.
SEO images for the webpages. All of these keys have an src property which should contain the rendered path (path in the rendered site, not in the src directory) of the SEO image.
ogfor Open Graph. Optimal image size2400x1260.twitterfor Twitter. Optimal image size2160x1080.
Contact details. You can set your own key for each contact detail object. Each of the objects in this property has the following keys:
name- the name of the contact detail that will appear in links.identifier- the unique identifier for this contact detail. For phone numbers, this property will be the actual phone number. For online accounts, this could be the username. And for email accounts, this should be the email address.url- the URL for this contact details. If the contact detail is a phone number, this should be atel:link. If the contact detail is an email address, this should be amailto:link. If this is an online account, this property should be the URL of the online account profile.
Some sites have multiple domains. This array will be used in canonical URLs. Each object in this array should have the following keys:
name- the name of the domain service. For example, "Netlify", "Google Domains"domain- the domain nameisPreferred-trueif this domain name should be the preferred one to use. Ideally, only one domain in the array has this property set totrue. If there are multiple preferred domains, the first one will be used.
The different API endpoints used by this website. This is a key-value pair, where you can set your own key, and the value is the endpoint.
The file src/data/navigation.json contains the data for the navigation bar and menu.
This is an array of objects with the following keys:
text- the text that will be the label of the navigation linkurl- the url of the navigation link