jumbo-jekyll-theme 5.4.0 → 5.5.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +3 -412
- data/_config.yml +5 -1
- data/_data/nav.yml +0 -24
- data/_includes/core/button.html +1 -1
- data/_includes/core/buttons.html +1 -1
- data/_includes/core/text.html +1 -1
- data/_includes/flow_inner.html +2 -2
- data/_layouts/author.html +0 -2
- data/_layouts/error.html +8 -10
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 8cbffc67cb49c9953ba7f03a56f5ae4f1a2d46563275a34266e6709519645aa3
|
|
4
|
+
data.tar.gz: 718209333172e7e4ce1ada570c63bc2a9103e9efd7fe64830f813dc82aa0ef50
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 53cb472668bad8b506a115d5bbd99166965248f5c81a29fe96bd52e5b2dd5d1ce4fbedeb6a3819275f9cc6c8ad3915d4b9d0b1d07e4acbdede8c04f2bc6df00a
|
|
7
|
+
data.tar.gz: ff1ba33cc5b420d2f3c9030660e3920e5f17663b32a949732479afa528c1b7e8b1e6361e23415aa3d90e599e705a3982f2b66a2a26eba3d110df5b62985c16d3
|
data/README.md
CHANGED
|
@@ -2,414 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
This is an open source Jekyll theme built for use on the Linaro Jekyll static websites. This project aims to unify the styles and components of Linaro static websites and make it easier to replicate and deploy a new static site.
|
|
4
4
|
|
|
5
|
-
## Contents
|
|
6
|
-
- [Contributions](#contributions)
|
|
7
|
-
- [Theme Overview & Features](#overview)
|
|
8
|
-
- [Adding Content](#adding-content)
|
|
9
|
-
- [Adding Pages](#adding-pages)
|
|
10
|
-
- [Adding Posts](#adding-posts)
|
|
11
|
-
- [Adding Redirects](#adding-redirects)
|
|
12
|
-
- [Building the static site locally](#building-your-static-site)
|
|
13
|
-
|
|
14
|
-
## Contributions
|
|
15
|
-
We happy to consider any contributions that you may have whether bugfixes/features. Please submit a pull request with your changes and we will take a look.
|
|
16
|
-
|
|
17
|
-
## Examples of websites using the theme
|
|
18
|
-
|
|
19
|
-
* [96Boards.org](https://www.96boards.org)
|
|
20
|
-
* [Linaro.org](https://www.linaro.org)
|
|
21
|
-
* [OP-TEE.org](https://www.op-tee.org)
|
|
22
|
-
* [DeviceTree.org](https://www.devicetree.org)
|
|
23
|
-
* [TrustedFirmware.org](https://www.trustedfirmware.org/)
|
|
24
|
-
* [Connect.linaro.org](https://connect.linaro.org)
|
|
25
|
-
|
|
26
|
-
# Overview
|
|
27
|
-
|
|
28
|
-
The jumbo-jekyll-theme is the open source Jekyll theme that was developed to transform WordPress sites into ultra-fast static Jekyll websites statically hosted with AWS.
|
|
29
|
-
There are many features within this theme that you may be able to learn from/utilise.
|
|
30
|
-
|
|
31
|
-
### Features
|
|
32
|
-
|
|
33
|
-
A few of the main features that this theme offers:
|
|
34
|
-
|
|
35
|
-
* Lazy loaded content using the lazysizes.js library
|
|
36
|
-
* Jumbotron Header include with options for a video background, lazy loaded background carousel, background image or breadcrumb header.
|
|
37
|
-
* JQuery Double Scroll tables using the doubleScroll css class
|
|
38
|
-
* Sticky Tab bar include
|
|
39
|
-
* Setup the navigation bar using _data/nav.yml with option for active classes to be set
|
|
40
|
-
* Setup the footer using _data/footer.yml
|
|
41
|
-
* Custom universal navbar toggle - useful for sites that share the same parent company.
|
|
42
|
-
* Jekyll Assets - providiing minified Javascript/CSS packages.
|
|
43
|
-
* Jekyll-responsive-image plugin for generating resized images upon site build.
|
|
44
|
-
* Jekyll-data to override the settings added in this theme.
|
|
45
|
-
* Flow Layout - specific sections of a page in front matter based on predefined row styles
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
### Available Layouts
|
|
49
|
-
|
|
50
|
-
Below are a table showing the available layouts for you to use:
|
|
51
|
-
|
|
52
|
-
| Layout | Description |
|
|
53
|
-
| ------ | ----------- |
|
|
54
|
-
| base | This is the base layout that contains the main HTML to for pages. Other layouts are children of this layout. |
|
|
55
|
-
| jumbotron | This layout adds either a carousel header, background-image header or a breadcrumb header. Content using this layout should be added to Boostrap 3 rows. This
|
|
56
|
-
layout is useful when addng custom pages. |
|
|
57
|
-
| jumbotron-container (Most Common) | This is the exact same as the above but instead provides a Bootstrap 3 content container than can be used to add content to. |
|
|
58
|
-
| default | This is the default layout to use which is the jumbotron-container layout |
|
|
59
|
-
| flow | This layout utlises the flow.html Jekyll include which takes the `flow` frontmatter section and renders bootstrap 3 styled rows with predefined styles available. Perfect for creating a neat looking page without knowing any HTML. |
|
|
60
|
-
|
|
61
|
-
### Available Includes
|
|
62
|
-
|
|
63
|
-
Below are a table showing the available includes for you to use:
|
|
64
|
-
|
|
65
|
-
| Layout | Description |
|
|
66
|
-
| ------ | ----------- |
|
|
67
|
-
| ascii-art | This is an optional include that includes the Linaro Sprinkle as Ascii art |
|
|
68
|
-
| author-posts | The author-posts include outputs an author's posts based on page.username included in the _authors/username.md collection objects. |
|
|
69
|
-
| breadcrumb | Includes a breadcrumb that's generated from the page path. |
|
|
70
|
-
| carousel-header | Includes a carousel background image header. |
|
|
71
|
-
| css | The css include adds the links to css packages which are currently compiled from the sass partials using the jekyll-assets plugin. |
|
|
72
|
-
| display-blog-posts | The display-blog-posts include outputs blog posts from the paginator object (jekyll-paginate-v2) |
|
|
73
|
-
| disqus-comments | This include adds disqus comments to a page. site.data.settings.disqus.shortname should be customized to include the correct shortname for disqus. |
|
|
74
|
-
| footer | Includes the bootstrap footer which uses the footer.yml jekyll data file for adding content. |
|
|
75
|
-
| github-edit | Adds GitHub Edit buttons to a page based on data.settings.edit-on-github in jekyll settings.yml data file. |
|
|
76
|
-
| google-analytics-script | Adds the Google Analytics javascript to the head of the web pages. To modify change the site.data.settings.google.analytics or site.data.settings.google.tag_manager value to the your analytics code e.g. |
|
|
77
|
-
| google-analytics-script | Adds the Google Analytics javascript to the head of the web pages. To modify change the site.data.settings.google.analytics value to the your analytics code e.g. |
|
|
78
|
-
| gtm-script | Adds the Google Tag Manager javascript to the head of the web pages. To modify change the site.data.settings.google.tag_manager value to the your analytics code e.g. |
|
|
79
|
-
| gtm-no-script | Used in the base.html layout to add the noscript iframe for the Google Tag Manager |
|
|
80
|
-
| head | Includes the <head> code for the website. |
|
|
81
|
-
| http2 | Adds http2 preload/prefetch links to resources based on page specific resources/resources set in the site.data.settings.http2 value. |
|
|
82
|
-
| image | Used to include lazy loaded images in the markdown of your blog posts/pages. Currently used jekyll-assets to find the path of an image based on an image name. Will be moving to use the full image path soon. |
|
|
83
|
-
| javascript | Includes the compressed/uglified js packages which are compliled using jekyll-assets |
|
|
84
|
-
| jumbotron | Adds the bootstrap jumbotron html to a page. Options for a carousel image header/video background header/breadcrumb/background image are available when using this include.|
|
|
85
|
-
| linaro-404 | Adds the Linaro 404 SVG |
|
|
86
|
-
| linaro-svg | Linaro logo as an SVG |
|
|
87
|
-
| media | Includes a responsive media embed. Useful for including YouTube videos in posts/pages |
|
|
88
|
-
| nav | Adds the Bootstrap navbar to a page. This include uses the nav.yml data file to add specified pages to the nav items. The universal nav is also include inside this jekyll include. |
|
|
89
|
-
| pagination | Adds the pagination html for paginated jekyll collections/pages. Takes a path as a parameter e.g /news/:num/ where num is the paginated page number. |
|
|
90
|
-
| post-series | Adds the post-series html to a blog post for linking to posts in the same series. Simply tag all posts in the same series with a series: value. |
|
|
91
|
-
| post-sidebar | The sidebar which is included to the right of post. Gets the most recent/ random other blog posts. |
|
|
92
|
-
| post-tags | Includes the post's tags in the sidebar. |
|
|
93
|
-
| read_time | Calculates a posts read time based on the length of the content. |
|
|
94
|
-
| responsive-image | Adds a responsive picture element utilising the jekyll-responsive-image plugin to regenerate images on site build |
|
|
95
|
-
| schema | Adds schema json-ld to the head of the page. |
|
|
96
|
-
| sidebar | Adds a sidebar using the Bootstrap stacked nav. This include uses the sidebar-nav.yml data file to build out the stacked nav's |
|
|
97
|
-
| sticky-tab-bar | Adds an affixed Bootstrap tab bar to a page. This looks for settings in the page frontmatter or the sticky-tab-bar.yml Jekyll data file.|
|
|
98
|
-
| thumb | Adds a responsive thumbnail image using the jekyll-repsonsive-image plugin. |
|
|
99
|
-
| thumbnail_image | Adds a responsive thumbnail image using the jekyll-repsonsive-image plugin. |
|
|
100
|
-
| universal-nav | Adds a universal navbar. We used this feature to link between our main static sites. |
|
|
101
|
-
| youtube | Adds a lazy loaded youtube video. |
|
|
102
|
-
| flow | Contains the logic for include content specified in the flow frontmatter section of a page that uses the flow layout. Basically just contains a bunch of `if` statements that include the relevant `jekyll _includes` |
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
### Jumbotron Layout
|
|
106
|
-
|
|
107
|
-
If you are using a layout that contains `jumbotron` then you can choose to display an image carousel header, standard background image header or a simple breadcrumb.
|
|
108
|
-
|
|
109
|
-
#### Jumbotron Settings
|
|
110
|
-
|
|
111
|
-
With the jumbotron layouts you can add a title, sub title and buttons to your header through changing your pages' front matter.
|
|
112
|
-
|
|
113
|
-
The jumbotron `title` can be modified by changing the title value in the page front matter:
|
|
114
|
-
|
|
115
|
-
```yaml
|
|
116
|
-
---
|
|
117
|
-
title: Your Page Title (and jumbotron title)
|
|
118
|
-
...
|
|
119
|
-
---
|
|
120
|
-
```
|
|
121
|
-
|
|
122
|
-
The jumbotron `sub title`/`description` can be modified by changing the description value in the page front matter:
|
|
123
|
-
|
|
124
|
-
```yaml
|
|
125
|
-
---
|
|
126
|
-
...
|
|
127
|
-
description: >-
|
|
128
|
-
Your Page description (and jumbotron description/sub title)
|
|
129
|
-
...
|
|
130
|
-
---
|
|
131
|
-
```
|
|
132
|
-
|
|
133
|
-
The jumbotron `buttons` can be added with the following front matter:
|
|
134
|
-
|
|
135
|
-
```yaml
|
|
136
|
-
---
|
|
137
|
-
...
|
|
138
|
-
jumbotron:
|
|
139
|
-
...
|
|
140
|
-
buttons:
|
|
141
|
-
- title: Learn More
|
|
142
|
-
url: /about/
|
|
143
|
-
icon: fa fa-github
|
|
144
|
-
...
|
|
145
|
-
...
|
|
146
|
-
---
|
|
147
|
-
```
|
|
148
|
-
The above should hopefully be fairly self explanatory other than the icon value which should be the icon class for a Font Awesome 4.7 Icon. For all available icons [click here](https://fontawesome.com/v4.7.0/icons/).
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
#### Background Image Carousel
|
|
152
|
-
|
|
153
|
-
If you would like to display an image carousel for your page then add the following front matter to your page:
|
|
154
|
-
|
|
155
|
-
```yaml
|
|
156
|
-
---
|
|
157
|
-
...
|
|
158
|
-
jumbotron:
|
|
159
|
-
...
|
|
160
|
-
carousel-images:
|
|
161
|
-
- /assets/images/content/background-image1.jpg
|
|
162
|
-
- /assets/images/content/background-image2.png
|
|
163
|
-
- /assets/images/content/background-image3.jpg
|
|
164
|
-
...
|
|
165
|
-
...
|
|
166
|
-
---
|
|
167
|
-
```
|
|
168
|
-
Add as many images here as you would like. Even though these images are loaded lazily, try and make sure the images have been optimized as large images will increase the page load time. Also try to ensure the resolution of these images are fairly high.
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
#### Background Image
|
|
172
|
-
|
|
173
|
-
```yaml
|
|
174
|
-
---
|
|
175
|
-
...
|
|
176
|
-
jumbotron:
|
|
177
|
-
...
|
|
178
|
-
background-image: /assets/images/content/background-image1.jpg
|
|
179
|
-
...
|
|
180
|
-
...
|
|
181
|
-
---
|
|
182
|
-
```
|
|
183
|
-
Here you can add image to be used an the background image of the jumbotron. Try and make sure the image has been compressed/optimized as large images will increase the page load time. Also try to ensure the resolution of these images are fairly high.
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
#### Slider Jumbotron
|
|
187
|
-
|
|
188
|
-
You can add an owl carousel based jumbotron using the following front matter settings:
|
|
189
|
-
|
|
190
|
-
```yaml
|
|
191
|
-
---
|
|
192
|
-
jumbotron:
|
|
193
|
-
slider:
|
|
194
|
-
slides:
|
|
195
|
-
# Title of your Slide
|
|
196
|
-
- title: Accelerating deployment of Arm-based solutions
|
|
197
|
-
# CSS class for your slide title - not required.
|
|
198
|
-
title-class: big-title
|
|
199
|
-
# Slide inline style="" settings - useful for setting background positions
|
|
200
|
-
slide-style: "background-position-y: bottom;"
|
|
201
|
-
# Adds the overlay class to slide
|
|
202
|
-
darken: true
|
|
203
|
-
# The path to the image you'd like to use for the slide
|
|
204
|
-
image: https://www.linaro.org/assets/images/content/hkg18-tech-banner.jpg
|
|
205
|
-
- title: Industry leaders to present Open Source on Arm insights at Linaro Connect Bangkok 2019
|
|
206
|
-
description: Linaro Ltd, the open source collaborative engineering organization developing software for the Arm® ecosystem, announced today the keynote speakers for Linaro Connect Bangkok 2019.
|
|
207
|
-
darken: true
|
|
208
|
-
slide-style: "background-position-y: bottom;"
|
|
209
|
-
image: https://staging.linaro.org/assets/images/content/bkk19-website-banner.png
|
|
210
|
-
# Adds buttons as <a href="URL" class="btn btn-primary">TITLE</a> after the description
|
|
211
|
-
buttons:
|
|
212
|
-
- title: Learn more
|
|
213
|
-
url: https://www.linaro.org/news/industry-leaders-to-present-open-source-on-arm-insights-at-linaro-connect-bangkok-2019/
|
|
214
|
-
---
|
|
215
|
-
```
|
|
216
|
-
|
|
217
|
-
__Note__: The /assets/js/app/main.js theme file must be included since this instantiates the owl carousel if it exists.
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
### Flow Layout
|
|
221
|
-
|
|
222
|
-
This is the latest layout to be added to the theme. This allows you to use a predefined list of styled rows on a page in any combination that you like (see below for full list of rows).
|
|
223
|
-
|
|
224
|
-
| Row Style | Description |
|
|
225
|
-
|-----------|-------------|
|
|
226
|
-
| members-section | Outputs your typical members row featuring row(s) of member logos. Useful for showing sponsors or customers of your project.|
|
|
227
|
-
| members-section | Outputs your typical members row featuring row(s) of member logos. Useful for showing sponsors or customers of your project.|
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
# Adding Content
|
|
231
|
-
## Adding Pages
|
|
232
|
-
|
|
233
|
-
### Step 1 - Setup your site if not already setup
|
|
234
|
-
|
|
235
|
-
__Note: If you're reading these docs for a site that's already using the theme then you can skip this part.__
|
|
236
|
-
|
|
237
|
-
The first step when using this theme is to create your own Jekyll site based off of this theme.
|
|
238
|
-
|
|
239
|
-
### Step 2 - Create a new page file
|
|
240
|
-
|
|
241
|
-
Website pages are added as markdown files usually in a folder with a `README.md` file beneath to keep everything organised and to ensure content renders on GitHub too (e.g `/services/README.md` or `/services.md`). If your page mainly contains HTML then use the `.html` file extension.
|
|
242
|
-
|
|
243
|
-
### Step 2 - Add Jekyll front matter to your new page
|
|
244
|
-
|
|
245
|
-
The url/permalink for your page should be added to the `front matter` of your posts/pages (the section at the top of the file between the set of 3 dashes `---`) as the `permalink` so that your page url is exactly as you intended it to be. See below for an example of the front matter to add to your page.
|
|
246
|
-
|
|
247
|
-
Each theme layout may have different front matter variables that are required so if in any doubt refer to the [layouts](#available-layouts) section of this documentation..
|
|
248
|
-
|
|
249
|
-
#### Available front matter options
|
|
250
|
-
|
|
251
|
-
Below is a table of the most common front matter variable to add to your page.
|
|
252
|
-
|
|
253
|
-
| Front Matter Option | Value | Description |
|
|
254
|
-
| ------ | ----------- | ----- |
|
|
255
|
-
| layout | post | Layout to be used for the page (use `default` if you're unsure) |
|
|
256
|
-
| keywords | hikey970, Arm, Linaro, Open Source | Used for the meta keywords tag by jekyll-seo-tag plugin |
|
|
257
|
-
| published | false | Set `published` to false if you want to add the page but not show it on the website. |
|
|
258
|
-
| title | My Awesome Post | The title of your page/post. Used in the `meta` tags and in layouts to display your page correctly. |
|
|
259
|
-
| description | This is an awesome post about your site... | The description of your page used as the `meta` description.|
|
|
260
|
-
|
|
261
|
-
#### Example front matter
|
|
262
|
-
|
|
263
|
-
```YAML
|
|
264
|
-
---
|
|
265
|
-
# Layout of your web page - see below for available layouts.
|
|
266
|
-
layout: jumbotron-container
|
|
267
|
-
# URL of your page
|
|
268
|
-
permalink: /about/
|
|
269
|
-
# Title of your page
|
|
270
|
-
title: About Us
|
|
271
|
-
# Description of your web page.
|
|
272
|
-
desc: |-
|
|
273
|
-
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy
|
|
274
|
-
text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
|
|
275
|
-
survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was
|
|
276
|
-
popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
|
|
277
|
-
publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
|
278
|
-
# Keywords that describe your page used as meta keywords.
|
|
279
|
-
tags: lorem, ipsum, web, page
|
|
280
|
-
jumbotron:
|
|
281
|
-
carousel-images:
|
|
282
|
-
- /assets/images/content/background-image1.jpg
|
|
283
|
-
- /assets/images/content/background-image2.png
|
|
284
|
-
- /assets/images/content/background-image3.jpg
|
|
285
|
-
---
|
|
286
|
-
Markdown content goes here.
|
|
287
|
-
```
|
|
288
|
-
|
|
289
|
-
### Step 2 - Add content to your page
|
|
290
|
-
|
|
291
|
-
Now you can add content to your page using `html` of `markdown`. You can find a markdown cheatsheet [here](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet).
|
|
292
|
-
|
|
293
|
-
## Adding Posts
|
|
294
|
-
|
|
295
|
-
In order to add a blog post to your site copy an existing post from the _posts folder if one exists otherwise create a new _posts folder. Posts are best organised by year/month so add to the correct folder based on the month you are posting it in and if the folder doesn't exist create one.
|
|
296
|
-
|
|
297
|
-
#### Step 1 - Modify the post file name
|
|
298
|
-
|
|
299
|
-
The url for your title is based on the title provided in the filename e.g 2018-06-07-i2s-in-dragonboard410c.md will have a url of /blog/i2s-in-dragonboard410c/. Separate the words in your title by dashes and modify the date at the start of the filename as neccessary.
|
|
300
|
-
|
|
301
|
-
#### Step 2 - Modify the post front matter
|
|
302
|
-
|
|
303
|
-
Modify the post front matter based on your post. Values to modify are:
|
|
304
|
-
- author:
|
|
305
|
-
- date:
|
|
306
|
-
- image:
|
|
307
|
-
- tags:
|
|
308
|
-
- description:
|
|
309
|
-
|
|
310
|
-
##### Author
|
|
311
|
-
|
|
312
|
-
Change the author to a unique author shortname. If this is your first time posting then add your author values to the _authors Jekyll collection (see this [collection](https://github.com/Linaro/website/tree/master/_authors) for an example). Make sure to add a profile image to the [/assets/images/authors folder](https://github.com/96boards/website/tree/master/assets/images/authors) and then refernce in authors page in the _authors collection. Verify that the author username is an exact match to that provided as the author: in your post.
|
|
313
|
-
|
|
314
|
-
##### Date
|
|
315
|
-
|
|
316
|
-
Modify the date of your post to a valid time before you post the blog otherwise Jekyll will see it as a __future__ post and not render it until the time on the server exceeds/equals that provided as the date in the post front matter.
|
|
317
|
-
|
|
318
|
-
##### Image
|
|
319
|
-
|
|
320
|
-
This value is used for the featured image displayed on your blog post and the image that is used when sharing the blog post on social media sites.
|
|
321
|
-
|
|
322
|
-
```YAML
|
|
323
|
-
image:
|
|
324
|
-
featured: true
|
|
325
|
-
path: /assets/images/blog/DragonBoard-UpdatedImages-front.png
|
|
326
|
-
name: DragonBoard-UpdatedImages-front.png
|
|
327
|
-
```
|
|
328
|
-
Thumbnails are generated on site build by the jekyll-responsive-image plugin (so make sure that the image you provide is of a relatively high resolution).
|
|
329
|
-
|
|
330
|
-
Make sure that the image you add in this section of front matter is placed in the [/assets/images/blog folder](https://github.com/96boards/website/tree/master/assets/images/blog).
|
|
331
|
-
|
|
332
|
-
__Note:__ There is currently a bug with the version of `jekyll-assets` we are using which means the only acceptable image extensions are `.jpg` and `.png`. If you use `.jpeg` you image may not display as expected.
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
##### Tags
|
|
336
|
-
These should be modified based on the content of your post as they are used for Meta keywords so that people can find your post based on the [tags your provide](https://www.your site/blog/tag/).
|
|
337
|
-
|
|
338
|
-
##### Description
|
|
339
|
-
Change this value to a short description of your blog post as this is used for the meta description of your blog post.
|
|
340
|
-
|
|
341
|
-
#### Step 3 - Add your post content.
|
|
342
|
-
|
|
343
|
-
Write your post content in Markdown format; specifically the [Kramdown](https://kramdown.gettalong.org/) Markdown flavour.
|
|
344
|
-
|
|
345
|
-
##### Adding images
|
|
346
|
-
Please use the following code snipppet to add an image to your blog post. Make sure to add the images that you include to [/assets/images/blog folder](https://github.com/96boards/website/tree/master/assets/images/blog).
|
|
347
|
-
|
|
348
|
-
```
|
|
349
|
-
{% include image.html name="name-of-your-image.png" alt="The Alt text for your image" %}
|
|
350
|
-
```
|
|
351
|
-
|
|
352
|
-
You also align/scale your image using the following css classes.
|
|
353
|
-
|
|
354
|
-
|Class|Details|
|
|
355
|
-
|-----|-------|
|
|
356
|
-
|small-inline|Small image aligned to the left|
|
|
357
|
-
|small-inline right| Small image aligned to the right|
|
|
358
|
-
|medium-inline|Medium image aligned to the left|
|
|
359
|
-
|medium-inline right|Medium image aligned to the right|
|
|
360
|
-
|large-inline|Large image aligned to the left|
|
|
361
|
-
|large-inline right|Large image aligned to the right|
|
|
362
|
-
|
|
363
|
-
```
|
|
364
|
-
{% include image.html name="name-of-your-image.png" class="medium-inline" alt="The Alt text for your image" %}
|
|
365
|
-
```
|
|
366
|
-
|
|
367
|
-
Using this Jekyll include will allow your images to be lazy loaded and format the image HTML correctly.
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
##### Adding code
|
|
371
|
-
|
|
372
|
-
We are using the rouge syntax highlighter to highlight your glorious code.
|
|
373
|
-
|
|
374
|
-
```bash
|
|
375
|
-
$ bundle exec jekyll serve --port 1337
|
|
376
|
-
```
|
|
377
|
-
|
|
378
|
-
See the full list of languages [here](https://github.com/jneen/rouge/wiki/List-of-supported-languages-and-lexers).
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
##### Adding Media/YouTube videos
|
|
382
|
-
|
|
383
|
-
To add a media element / YouTube video use the following Jekyll include.
|
|
384
|
-
|
|
385
|
-
```
|
|
386
|
-
{% include media.html media_url="https://youtu.be/GFzJd0hXI0c" %}
|
|
387
|
-
```
|
|
388
|
-
|
|
389
|
-
# Adding Redirects
|
|
390
|
-
|
|
391
|
-
__Note__: This section is only applicable to static sites deployed within Linaro. You can however use the same approach for your site using the following method.
|
|
392
|
-
|
|
393
|
-
We are using [Edge-rewrite](https://github.com/marksteele/edge-rewrite) which is a rewrite engine running in Lambda@Edge. The redirects are to be added to the `_data/routingrules.json` file in the webiste repository following the syntax rules [here](https://github.com/marksteele/edge-rewrite).
|
|
394
|
-
|
|
395
|
-
```
|
|
396
|
-
^/oldpath/(\\d*)/(.*)$ /newpath/$2/$1 [L]
|
|
397
|
-
!^/oldpath.*$ http://www.example.com [R=302,L,NC]
|
|
398
|
-
^/topsecret.*$ [F,L]
|
|
399
|
-
^/deadlink.*$ [G]
|
|
400
|
-
^/foo$ /bar [H=^baz\.com$]
|
|
401
|
-
```
|
|
402
|
-
|
|
403
|
-
__Note:__ These redirects are currently not respected by the link checker until built. So if trying to fix broken links by adding redirects then this may not be the best way to go about it currently.
|
|
404
|
-
|
|
405
|
-
# Building your static site
|
|
406
|
-
|
|
407
|
-
We are working towards creating a Dockerfile for building Linaro's static sites (if familiar with Docker you can find many [Jekyll based Docker images])(https://hub.docker.com/r/jekyll/jekyll/) to get started). In the mean time you can still clone the site and install bundler/jekyll gems and ruby to build the site locally.
|
|
408
|
-
|
|
409
|
-
In order to build the 96Boards.org static site make sure you have Ruby and the bundler/jekyll gems installed. For instructions on how to setup an environment to build Jekyll sites see the official Jekyll documentation [here](https://jekyllrb.com/docs/installation/).
|
|
410
|
-
|
|
411
|
-
Once you have above installed you can simply clone this repo and the [96Boards Documentation Repo](https://github.com/96boards/documentation). You will then need to modify the [build.sh](https://github.com/96boards/website/blob/master/build.sh) file to pull the documentation into your website repo before building the static site. Amend the top two lines of the build.sh file so that the correct paths are used. Then run the script to move the documentation files over to the _documentation collection in the website repo.
|
|
412
|
-
|
|
413
5
|
```
|
|
414
6
|
$ ./build.sh
|
|
415
7
|
```
|
|
@@ -417,18 +9,17 @@ $ ./build.sh
|
|
|
417
9
|
After you have moved the documentation files over you can go ahead and run the following to get the site building:
|
|
418
10
|
|
|
419
11
|
```
|
|
420
|
-
$ bundle
|
|
12
|
+
$ bundle
|
|
421
13
|
```
|
|
422
14
|
|
|
423
15
|
This will install the required gems listed in the Gemfile.
|
|
424
16
|
|
|
425
17
|
```
|
|
426
|
-
$ bundle exec jekyll s
|
|
18
|
+
$ bundle exec jekyll s
|
|
427
19
|
```
|
|
428
20
|
|
|
429
21
|
This will serve (s) the Jekyll static website to the http://localhost:4000 where you can view the generated static website.
|
|
430
22
|
|
|
431
|
-
|
|
432
|
-
# Feature Requests / Bug Fixes
|
|
23
|
+
## Feature Requests / Bug Fixes
|
|
433
24
|
|
|
434
25
|
If anyone that uses the theme has any useful bug fixes / feature requests that may be of interest then please feel free to fork/submit a PR with your fixes/features.
|
data/_config.yml
CHANGED
|
@@ -39,6 +39,8 @@ exclude:
|
|
|
39
39
|
- _static-site
|
|
40
40
|
- .sass-cache
|
|
41
41
|
- _site
|
|
42
|
+
- jumbo-jekyll-theme*.gem
|
|
43
|
+
- jumbo-jekyll-theme*.gemspec
|
|
42
44
|
# Sass Configuration for the site styles
|
|
43
45
|
sass:
|
|
44
46
|
style: compressed
|
|
@@ -197,4 +199,6 @@ responsive_image:
|
|
|
197
199
|
extra_images:
|
|
198
200
|
- assets/foo/bar.png
|
|
199
201
|
- assets/bgs/*.png
|
|
200
|
-
- assets/avatars/*.{jpeg,jpg}
|
|
202
|
+
- assets/avatars/*.{jpeg,jpg}
|
|
203
|
+
|
|
204
|
+
include: ['_pages']
|
data/_data/nav.yml
CHANGED
|
@@ -18,34 +18,12 @@ pages:
|
|
|
18
18
|
active_paths:
|
|
19
19
|
- /new/
|
|
20
20
|
options:
|
|
21
|
-
# - text: Plugins
|
|
22
|
-
# options:
|
|
23
|
-
# - text: Jekyll Assets
|
|
24
|
-
# url: /jekyll/plugins/assets/
|
|
25
|
-
# - text: Jekyll Assets
|
|
26
|
-
# url: /jekyll/plugins/assets/
|
|
27
|
-
# - text: Jekyll Assets
|
|
28
|
-
# url: /jekyll/plugins/assets/
|
|
29
21
|
- text: Includes
|
|
30
22
|
url: /jekyll/includes/
|
|
31
23
|
- title: Layouts
|
|
32
24
|
options:
|
|
33
25
|
- text: Default
|
|
34
26
|
url: /layouts/default/
|
|
35
|
-
# - text: Jumbotron
|
|
36
|
-
# options:
|
|
37
|
-
# - text: Overview
|
|
38
|
-
# url: /layouts/jumbotron/
|
|
39
|
-
# - text: Carousel Header
|
|
40
|
-
# url: /layouts/jumbotron/carousel-header/
|
|
41
|
-
# - text: Video Header
|
|
42
|
-
# url: /layouts/jumbotron/video-header/
|
|
43
|
-
# - text: Background Image Header
|
|
44
|
-
# url: /layouts/jumbotron/background-image-header/
|
|
45
|
-
# - text: Slider Header
|
|
46
|
-
# url: /layouts/jumbotron/slider-header/
|
|
47
|
-
|
|
48
|
-
|
|
49
27
|
- title: About
|
|
50
28
|
options:
|
|
51
29
|
- text: Overview
|
|
@@ -53,7 +31,6 @@ pages:
|
|
|
53
31
|
- text: Collaborate
|
|
54
32
|
url: /collaborate/
|
|
55
33
|
- text: Jekyll
|
|
56
|
-
|
|
57
34
|
- title: CSS
|
|
58
35
|
options:
|
|
59
36
|
- text: Bootstrap
|
|
@@ -64,7 +41,6 @@ pages:
|
|
|
64
41
|
url: /js/jquery/
|
|
65
42
|
- text: Bootstrap
|
|
66
43
|
url: /js/bootstrap/
|
|
67
|
-
|
|
68
44
|
- title: Blog
|
|
69
45
|
url: /blog/
|
|
70
46
|
active_paths:
|
data/_includes/core/button.html
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<a href="{{include.object.url}}" class="btn {% if include.object.
|
|
1
|
+
<a href="{{include.object.url}}" class="btn {% if include.object.style %}{{include.object.style}}{% else %}btn-primary{% endif %}">
|
|
2
2
|
{{include.object.title}}
|
|
3
3
|
{% if include.object.icon %}
|
|
4
4
|
<i class="{{include.object.icon}}" aria-hidden="true"></i>
|
data/_includes/core/buttons.html
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<div class="col-xs-12 buttons no-padding {% if include.
|
|
1
|
+
<div class="col-xs-12 buttons no-padding {% if include.style %}{{include.style}}{% endif %}">
|
|
2
2
|
{% for button in include.object %}
|
|
3
3
|
{% include core/button.html object=button %}
|
|
4
4
|
{% endfor %}
|
data/_includes/core/text.html
CHANGED
data/_includes/flow_inner.html
CHANGED
|
@@ -6,13 +6,13 @@
|
|
|
6
6
|
{% elsif section.format == "block" %}
|
|
7
7
|
{% include core/blocks.html object=section %}
|
|
8
8
|
{% elsif section.format == "buttons" %}
|
|
9
|
-
{% include core/buttons.html object=section.content
|
|
9
|
+
{% include core/buttons.html object=section.content style=section.style %}
|
|
10
10
|
{% elsif section.format == "text" %}
|
|
11
11
|
{% include core/text.html object=section %}
|
|
12
12
|
{% elsif section.format == "custom" %}
|
|
13
13
|
{% include {{section.include_name}} object=section %}
|
|
14
14
|
{% elsif section.format == "slider" %}
|
|
15
|
-
{% include core/slider_row.html object=section
|
|
15
|
+
{% include core/slider_row.html object=section %}
|
|
16
16
|
{% elsif section.format == "feature_block" %}
|
|
17
17
|
{% include core/feature_block.html object=section.content %}
|
|
18
18
|
{% endif %}
|
data/_layouts/author.html
CHANGED
data/_layouts/error.html
CHANGED
|
@@ -1,25 +1,23 @@
|
|
|
1
1
|
---
|
|
2
2
|
layout: base
|
|
3
|
-
permalink: /404.html
|
|
4
3
|
css-package: error
|
|
5
|
-
title: 404 Page Not Found
|
|
6
4
|
---
|
|
7
5
|
<div class="row" id="content-container">
|
|
8
6
|
<div class="container">
|
|
9
7
|
<div class="text-center">
|
|
10
|
-
{% if
|
|
11
|
-
{% include image.html path=
|
|
12
|
-
{% elsif
|
|
13
|
-
{% include {{
|
|
8
|
+
{% if page.image.path %}
|
|
9
|
+
{% include image.html path=page.image.path %}
|
|
10
|
+
{% elsif page.image.svg %}
|
|
11
|
+
{% include {{page.image.svg}} %}
|
|
14
12
|
{% endif %}
|
|
15
|
-
{% if
|
|
13
|
+
{% if page.title %}
|
|
16
14
|
<h1>
|
|
17
|
-
{{
|
|
15
|
+
{{page.title}}
|
|
18
16
|
</h1>
|
|
19
17
|
{% endif %}
|
|
20
|
-
{% if
|
|
18
|
+
{% if page.description %}
|
|
21
19
|
<p>
|
|
22
|
-
{{
|
|
20
|
+
{{page.description}}
|
|
23
21
|
</p>
|
|
24
22
|
{% endif %}
|
|
25
23
|
</div>
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: jumbo-jekyll-theme
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 5.
|
|
4
|
+
version: 5.5.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Kyle Kirkby
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2019-
|
|
11
|
+
date: 2019-07-01 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll
|