Lndr lets you integrate single page landing pages and make them fully editable through a simple and approachable templating system. Follow the documentation to learn about the basics of a Lndr compatible template and how to correctly make it editable for your customers.
A basic Lndr template has the following directory structure:
template_name/ +-- assets/ +-- img/ ¦ +-- image_01.png ¦ +-- image_02.png +-- js/ ¦ +-- anything.js +-- css/ +-- anything.css +-- index.html +-- screenshot.jpg +-- screenshot-large.jpg +-- favicon.ico
It is required that you have two screenshot files. One of them is a square screenshot of your template, usually 800x800 pixels. The other file
screenshot-large.jpg is a full screenshot usaully 800px wide of your webstie.
Without the screenshots, Lndr will not accept the template.
To hit the ground running feel free to use our simple template starter. You can clone in from GitHub and get started in a few easy steps:
Clone the repository:
$ git clone email@example.com:makehero/template-starter.git template_name
Use yarn to install project dependencies:
$ cd template_name/ $ yarn install
Start a local development server:
$ yarn dev
This will launch a comfortable development environment for implementing a template design. Whatever can be done with
yarn can also be done with
npm so use whichever feels right for you.
Neat Bourbon & Bitters
This project comes with a few SASS libraries:
- Bourbon - A lightweight mixin library for SASS
- Neat - A flexible SASS responsive grid
- Bitters - A basic structure for your SASS files
All of these can be found inside your
assets/sass directory. You can safely delete everything and start from scratch.
When you are done implementing the template you can build a Lndr compatible version by running the build command.
$ yarn build
This will generate a
/template directory with the correct conventional structure for Lndr.
This article is a work in progress and will require additional reading before it becomes remotely useful. Thank you for your patience.