Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sira313/eleventy-card
Clean and minimalist starter website for artists/photographers to post their artwork in a masonry layout and blog separately in a very simple layout. Created with Bulma CSS and Feather Icons.
https://github.com/sira313/eleventy-card
blog bulma eleventy eleventy-site eleventy-starter feathericons masonry-layout porftolio
Last synced: about 2 months ago
JSON representation
Clean and minimalist starter website for artists/photographers to post their artwork in a masonry layout and blog separately in a very simple layout. Created with Bulma CSS and Feather Icons.
- Host: GitHub
- URL: https://github.com/sira313/eleventy-card
- Owner: sira313
- License: mit
- Archived: true
- Created: 2024-04-20T17:27:44.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-07-20T10:18:03.000Z (4 months ago)
- Last Synced: 2024-09-26T16:04:45.318Z (about 2 months ago)
- Topics: blog, bulma, eleventy, eleventy-site, eleventy-starter, feathericons, masonry-layout, porftolio
- Language: Nunjucks
- Homepage: https://eleventy-card.netlify.app
- Size: 13.8 MB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## Eleventy Card
### [⚠️ DEPRECATED! MIGRATE TO DAISY UI VERSION](https://github.com/sira313/twcarty)
#### A starter project for photographer/artist showing their work and blog randomly
#### [eleventy-card.netlify.app](https://eleventy-card.netlify.app/)
[](https://app.netlify.com/sites/eleventy-card/deploys)
Powered by
[](https://www.11ty.dev/)[](https://bulma.io/)[](https://feathericons.com/)
---
### Basic Info
Clone this repo
```
git clone https://github.com/sira313/eleventy-card-bulma/
```
Use PNPM
```
npm install -g pnpm
```
Install modules
```
pnpm install
```
Run to your localhost
```
pnpm start
```
#### Menu
There are 2 menus (for indexing post, not a single page) we created by default:
- Photos
- Blog
So if you wanted to create another one, maybe [this tutorial](https://www.youtube.com/watch?v=kzf9A9tkkl4) will help.
#### Layout
There are 3 layouts in [/_includes](/_includes/):
- [/_includes/layout.html](/_includes/layout.html) is the main layout called in other layout frontmatter.
- [/_includes/post-blog.html](/_includes/post-blog.html) is for blog post layout.
- [/_includes/post-photos.html](/_includes/post-photos.html) is photos post layout.
#### Index
There are 3 indexs in this project
- [/index.md](/index.md) where you describe your own business.
- [/photos/index.html](/photos/index.html) is the index of all your photos.
- [/blog/index.html](/blog/index.html) is the index of your blog.
#### Post
We created a js script to make a post automatically, so you don't need to do that manual. [Thanks to my friend](https://github.com/mustofa-id).
To create a post in `/blog` you need to
```
pnpm mkpost -b Your post title
```
It will create a markdown file in `/blog`.
And if you wanted to create a post in `/photos` you just need to
```
pnpm mkpost -p Your post title
```
#### Asset
All assets are in [/asset](/asset/) directory and called in the frontmatter.
#### Tips
Better use [Squoosh](https://squoosh.app/) to convert your pics to webp