|
| 1 | +# mbgen |
| 2 | + |
| 3 | +An easy-to-use, intuitive and fast static **m**icro-**b**log site **gen**erator, |
| 4 | +embracing the convention-over-configuration philosophy. |
| 5 | + |
| 6 | +## Demo |
| 7 | + |
| 8 | +My personal website - [kion.name](https://kion.name/) - |
| 9 | +is generated with mbgen (using the default theme). |
| 10 | + |
| 11 | +## Installation |
| 12 | + |
| 13 | +If you have Go installed: |
| 14 | + |
| 15 | +```sh |
| 16 | +go get github.com/kion/mbgen |
| 17 | +``` |
| 18 | + |
| 19 | +Otherwise, download the latest binary |
| 20 | +from the [releases](https://github.com/kion/mbgen/releases) page, |
| 21 | +make it executable (`chmod +x mbgen` on any Unix-like system), |
| 22 | +and either add it to your `PATH` to make the `mbgen` command available globally |
| 23 | +or just place it in any dir to limit its usage from that dir only. |
| 24 | + |
| 25 | +## Quick Start |
| 26 | + |
| 27 | +Create an empty working dir for your site |
| 28 | +and run the following command inside it: |
| 29 | + |
| 30 | +```shell |
| 31 | +$ mbgen init |
| 32 | +``` |
| 33 | + |
| 34 | +This creates the following working dir structure: |
| 35 | + |
| 36 | +``` |
| 37 | +├── config.yml ☜ sample config file |
| 38 | +│ ├── deploy ☜ dir to be deployed to server |
| 39 | +│ │ ├── favicon.ico ☜ sample favicon |
| 40 | +│ │ ├── media ☜ media content dir |
| 41 | +│ │ │ ├── sample-page |
| 42 | +│ │ │ ├── sample-post-1 |
| 43 | +│ │ │ ├── ... |
| 44 | +│ ├── include ☜ include files dir |
| 45 | +│ │ ├── default ☜ default theme include files dir |
| 46 | +│ ├── pages ☜ page content markdown files dir |
| 47 | +│ │ ├── sample-page.md |
| 48 | +│ ├── posts ☜ post content markdown files dir |
| 49 | +│ │ ├── sample-post-1.md |
| 50 | +│ │ ├── ... |
| 51 | +│ ├── themes ☜ themes dir |
| 52 | +│ │ ├── default ☜ default theme dir |
| 53 | +``` |
| 54 | + |
| 55 | +Run the following command to generate your site: |
| 56 | + |
| 57 | +```shell |
| 58 | +$ mbgen generate |
| 59 | +``` |
| 60 | + |
| 61 | +This generates all the static content files (`.html`) inside the `deploy` dir, |
| 62 | +copies all the required theme resources (like fonts, styles, etc.) the static files require, |
| 63 | +as well as generates the thumbnails for the content images whenever appropriate |
| 64 | +_(this default behavior can be disabled in the `config.yml`)_. |
| 65 | + |
| 66 | +Run the following command to start a simple http server to serve the generated site locally: |
| 67 | + |
| 68 | +```shell |
| 69 | +$ mbgen serve |
| 70 | +``` |
| 71 | + |
| 72 | +Then open the following address in a browser to preview your site: |
| 73 | + |
| 74 | +[http://localhost:8080/](http://localhost:8080/) |
| 75 | + |
| 76 | +_(the default host and port values can be modified in the `config.yml`)_ |
| 77 | + |
| 78 | +Other supported commands: |
| 79 | + |
| 80 | +* parse content folders and print out the corresponding stats: |
| 81 | +```shell |
| 82 | +$ mbgen stats |
| 83 | +``` |
| 84 | + |
| 85 | +* install/update and/or activate a theme: |
| 86 | +```shell |
| 87 | +$ mbgen theme <action> <theme> |
| 88 | +``` |
| 89 | + |
| 90 | +* print out help/usage information: |
| 91 | +```shell |
| 92 | +$ mbgen help [command] |
| 93 | +``` |
| 94 | + |
| 95 | +## General Conventions |
| 96 | + |
| 97 | +* Content files should be placed inside the |
| 98 | + `pages` and `posts` dirs and have the `.md` file extension |
| 99 | +* The `deploy` dir contains all the content |
| 100 | + (images/videos, static resources, generated static `.html` site pages, etc.) |
| 101 | + to be uploaded to the web hosting server |
| 102 | +* All the images/videos are stored inside the `deploy/media` dir |
| 103 | + and should be placed into the sub-dirs with names matching |
| 104 | + the names of the corresponding content files, e.g.: |
| 105 | + ``` |
| 106 | + ├── deploy |
| 107 | + │ ├── media |
| 108 | + │ │ ├── sample-page |
| 109 | + │ │ │ ├── img-1.jpg |
| 110 | + │ │ │ ├── vid-1.mp4 |
| 111 | + │ │ ├── sample-post-1 |
| 112 | + │ │ │ ├── img-1.jpg |
| 113 | + │ │ │ ├── img-2.jpg |
| 114 | + │ │ │ ├── vid-1.mp4 |
| 115 | + │ │ ├── sample-post-2 |
| 116 | + │ │ │ ├── cover.png |
| 117 | + ├── pages |
| 118 | + │ ├── sample-page.md |
| 119 | + ├── posts |
| 120 | + │ ├── sample-post-1.md |
| 121 | + │ ├── sample-post-2.md |
| 122 | + ``` |
| 123 | +* Content files are a combination of the content body in the Markdown format |
| 124 | + along with Yaml formatted metadata in the beginning of the file |
| 125 | + * Post content file example: |
| 126 | + ``` |
| 127 | + --- |
| 128 | + date: 2023-08-01 |
| 129 | + title: Post title |
| 130 | + tags: |
| 131 | + - Tag1 |
| 132 | + - Tag2 |
| 133 | + - Tag3 |
| 134 | + --- |
| 135 | + |
| 136 | + Post body in the markdown format |
| 137 | + |
| 138 | + #Tag4 #Tag5 |
| 139 | + |
| 140 | + {media} |
| 141 | + ``` |
| 142 | + * Page content file example: |
| 143 | + ``` |
| 144 | + --- |
| 145 | + title: Page title |
| 146 | + --- |
| 147 | + |
| 148 | + Page body in the markdown format |
| 149 | + |
| 150 | + #Tag1 #Tag2 |
| 151 | + |
| 152 | + {embed:youtu.be/A_bCdEfGhIj-X} |
| 153 | + ``` |
| 154 | + * The following content directives are supported: |
| 155 | + * `#<tag>` - renders a hashtag link |
| 156 | + * _there's no need to add hashtags to the metadata `tags` section, |
| 157 | + i.e. hashtags are automatically included in the post's tag list_ |
| 158 | + * `{%<entry-type>:<entry-id>%}` - renders a URI to the given `<entry-id>` of the given `<entry-type>`, e.g.: |
| 159 | + * `<a href="{%page:sample-page%}">Sample Page</a>` - would render a link to the page defined in the `pages/sample-project.md` |
| 160 | + * `<a href="{%post:sample-post-1%}">Sample Post 1</a>` - would render a link to the post defined in the `posts/sample-post-1.md` |
| 161 | + * `{media(<properties>):<file(s)>}` - renders images/videos from the corresponding `deploy/media/<entry-id>` dir |
| 162 | + * to render specific media files, list them explicitly, e.g.: |
| 163 | + * `{media:1.jpg}` |
| 164 | + * `{media:1.jpg,2.png}` |
| 165 | + * `{media:1.mp4,1.jpg,2.png}` |
| 166 | + * `{media}` (without any explicitly listed files) |
| 167 | + renders all the media files from the corresponding `deploy/media/<entry-id>` dir, |
| 168 | + _excluding the explicitly listed media files_ |
| 169 | + * additional properties might be supported by each specific theme to fine-tune the media container rendering |
| 170 | + * properties should be comma-separated and use `=` |
| 171 | + to separate the key (on the left) and the value (on the right) of each particular property: |
| 172 | + * `{media(key1=val1):1.jpg}` |
| 173 | + * `{media(key1=val1,key2=val2)}` |
| 174 | + * `{with-media(<properties>):<file(s)>} <related-content> {/}` - |
| 175 | + renders images/videos alongside the `<related-content>` |
| 176 | + * otherwise, works the same way as the `{media}` directive above, e.g.: |
| 177 | + * `{with-media:1.jpg} ... {/}` |
| 178 | + * `{with-media:1.jpg,1.mp4} ... {/}` |
| 179 | + * `{with-media} ... {/}` |
| 180 | + * `{embed:<url>}` - allows to embed media from the supported media content hosting platforms, e.g.: |
| 181 | + * `{embed:youtu.be/A_bCdEfGhIj-X}` |
| 182 | + * `{embed:vimeo.com/1234567890}` |
| 183 | + * The following platforms are currently supported: |
| 184 | + * YouTube |
| 185 | + * Vimeo |
| 186 | + * Custom/additional resources can be integrated on the global and/or theme level |
| 187 | + by placing the corresponding resource files |
| 188 | + inside the `include` dir (for global level includes) |
| 189 | + and/or the `include/<theme-name>` dir (for theme level includes) |
| 190 | + * The following are included in **all** generated files: |
| 191 | + * `styles.css` - for custom CSS styles |
| 192 | + * `head.html` - for `<meta>` tags and `<link>` tags |
| 193 | + referencing additional resources (e.g. css/js/font files) |
| 194 | + * To include additional `<meta>` and `<link>` tags for _pages_ only |
| 195 | + (i.e. these are never included for _posts_), use the following include files: |
| 196 | + * `page-head.html` - is included in **all** generated page files |
| 197 | + * `page-head--<page>.html` - is included in the generated file for the **specific page only** |
| 198 | + (`<page>` is the name of the corresponding markdown content file without the `.md` extension, |
| 199 | + e.g. `page-head--sample-page.html`) |
| 200 | + * _Global includes are injected before any theme-specific ones |
| 201 | + (i.e. theme includes override the global ones)_ |
| 202 | + * Each specific theme might also support some additional includes |
| 203 | + * Sample files for the supported includes are automatically copied to the `include/<theme-name>` dir |
| 204 | + and should be modified/tweaked to include any custom markup and content |
| 205 | +
|
| 206 | +## Theme Specific Conventions |
| 207 | +
|
| 208 | +* [pretty-dark](https://github.com/kion/mbgen/blob/main/themes/pretty-dark/README.md) - the default theme |
| 209 | +
|
| 210 | +## Configuration |
| 211 | +
|
| 212 | +A number of configuration options can be specified in the `config.yml` |
| 213 | +to customize the app behavior / generated output |
| 214 | +(the options marked as **[required]** must be present |
| 215 | +and have a value defined for the `generate` command to work, |
| 216 | +while the [optional] ones do not require a value to be defined |
| 217 | +or can even be completely omitted from the config): |
| 218 | +
|
| 219 | +* **[required]** `siteName` - the name of the site |
| 220 | + - if `:` needs to be used in the site name, |
| 221 | + the property value must be enclosed in double quotes |
| 222 | +* **[required]** `theme` - path to the active theme dir |
| 223 | + (either relevant to the working dir or an absolute one) |
| 224 | +* [optional] `homePage` - an id of the page to use as the site's home page |
| 225 | + - for example, if there was a `pages/sample-page.md` content file, |
| 226 | + it would be possible to set the value to `sample-page` |
| 227 | +* [optional] `pageSize` - controls the maximum number of posts |
| 228 | + on any page that renders a list of posts |
| 229 | + - if not specified, the default value of `10` is used |
| 230 | +* [optional] `useThumbs` |
| 231 | + - if not specified (or set to `yes` explicitly), |
| 232 | + enables the thumbnail behavior (to optimize the page size / load time): |
| 233 | + - `generate` command generates a number of thumbnails |
| 234 | + (preserving the original image aspect ratio) |
| 235 | + with widths/heights (whichever one is larger) |
| 236 | + matching the values of the `thumbSizes` option |
| 237 | + for each image inside the `deploy/media` sub-dirs |
| 238 | + with the file size (**in MB**) larger than the `thumbThreshold` value |
| 239 | + (whether it's the explicitly specified or the default one) |
| 240 | + - all the `<img>` tags for the generated output (`.html` files) |
| 241 | + use the original image URL for the `href` attribute |
| 242 | + and the corresponding thumbnail URL for the `src` attribute |
| 243 | + as well as `srcset` attribute with all the URI and width values |
| 244 | + (if the option is disabled, both the `href` and the `src` |
| 245 | + attributes are set to point to the original image URL, |
| 246 | + while the `srcset` is not used at all) |
| 247 | + - the following image formats are supported: |
| 248 | + - JPEG (`.jpg` and `.jpeg` file extensions) |
| 249 | + - PNG (`.png` file extension) |
| 250 | + - set to `no` to disable the thumbnail behavior |
| 251 | +* [optional] `thumbSizes` - defines the set of size values for the generated thumbnails, |
| 252 | + where each value corresponds to either the width or the height of the generated thumbnail |
| 253 | + (depending on which one is larger for the original image) |
| 254 | + - if not specified, the default widths are used: `480, 960` |
| 255 | + - ignored if the `useThumbs` option is disabled |
| 256 | +* [optional] `thumbThreshold` - defines the min file size of the original image **in MB** |
| 257 | + to trigger the corresponding thumbnail generation |
| 258 | + - if not specified, the default value of `0.5` (i.e. **0.5 MB**) is used |
| 259 | + - ignored if the `useThumbs` option is disabled |
| 260 | +* [optional] `serveHost` - host to use for `serve` command |
| 261 | + - if not specified, the default value of `localhost` is used |
| 262 | +* [optional] `servePort` - port to use for `serve` command |
| 263 | + - if not specified, the default value of `8080` is used |
| 264 | +
|
| 265 | +## License |
| 266 | +
|
| 267 | +Distributed under the GNU AGPLv3 license. |
| 268 | +
|
| 269 | +See [LICENSE.txt](https://github.com/kion/mbgen/blob/main/LICENSE.txt) for more information. |
0 commit comments