You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+19-17Lines changed: 19 additions & 17 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -7,57 +7,59 @@ A place for services within digital prevention services to document their design
7
7
1. Clone the repo to a folder on your computer
8
8
2. In your terminal, `cd` to the folder
9
9
3. Run `npm install` to install pre-requisites
10
-
4. Run `npm run start` to build the design history site and serve it
10
+
4. Run `npm start` to build the design history site and serve it
11
11
5. View the site locally at `localhost:8080`
12
12
13
13
## Adding a new service
14
14
15
15
To add a new service, there is some set up involved.
16
16
17
-
You will need to create some files and folders based on the name of your service, using lowercase and hypens. For example `your-service-name`.
17
+
You will need to create some files and folders based on the name of your service, using lowercase and hyphens. For example `your-service-name`.
18
18
19
19
You’ll need to:
20
20
21
-
* create a Markdown file in `app/posts/`, for example `app/posts/your-service-name.md`. Copy an existing example and update any references to match your service.
22
-
* create a folder for your service in `app/images/`, for example `app/images/your-service-name/`
23
-
* create a folder for your service in `app/posts/`, for example `app/posts/your-service-name/`
24
-
* inside your service’s post folder, ceate a json file `your-service-name.json`, for exampole`app/posts/your-service-name/your-service-name.json`. Copy an existing example for what to put in it.
25
-
* update `eleventy.config.js` to create a new 'collection' for your service (copy one of the existing examples)
26
-
* update `app/_layouts/_product.njk` to list your new service in the sections variable
27
-
* open a pull request with your changes
21
+
- create a Markdown file in `app/posts/`, for example `app/posts/your-service-name.md`. Copy an existing example and update any references to match your service.
22
+
- create a folder for your service in `app/images/`, for example `app/images/your-service-name/`
23
+
- create a folder for your service in `app/posts/`, for example `app/posts/your-service-name/`
24
+
- inside your service’s post folder, create a JSON file `your-service-name.json`, for example`app/posts/your-service-name/your-service-name.json`. Copy an existing example for what to put in it.
25
+
- update `eleventy.config.js` to create a new ‘collection’ for your service (copy one of the existing examples)
26
+
- update `app/_layouts/_product.njk` to list your new service in the sections variable
27
+
- open a pull request with your changes
28
28
29
29
See [Divide a design history into different sections](https://x-govuk.github.io/govuk-design-history/divide-a-design-history-into-sections/).
30
30
31
31
## Adding a new post
32
32
33
33
You have two choices for adding a post:
34
34
35
-
*[Add a post manually](#add-a-post-manually)
36
-
*[Use the post generation scripts](https://x-govuk.github.io/govuk-design-history/generate-a-page-of-screenshots/)
35
+
-[Add a post manually](#add-a-post-manually)
36
+
-[Use the post generation scripts](https://x-govuk.github.io/govuk-design-history/generate-a-page-of-screenshots/)
37
37
38
38
### Add a post manually
39
39
40
-
1. Draft your design history post - it's often easiest to do this in Sharepoint
41
-
1. Create a new markdown file in `app/posts/[service-name]/YYYY/MM/[post-name].md`
42
-
** It's often easier to duplicate an existing post as that will have the headers you need
40
+
1. Draft your design history post - it’s often easiest to do this in SharePoint
41
+
2. Create a new markdown file in `app/posts/[service-name]/YYYY/MM/[post-name].md`
42
+
43
+
> It’s often easier to duplicate an existing post as that will have the headers you need
44
+
43
45
3. Edit the post with your content - make sure it has a title, subtitle, and date
44
46
4. If you have images, add them to a folder in `app/images/[service-name]/YYYY/MM/[post-name]/`
45
-
5. Make a PR with your changes and get it reviewed
47
+
5. Make a pull request with your changes and get it reviewed
46
48
47
49
### Add a post using the generation scripts
48
50
49
51
[View more details on the scripts here.](https://x-govuk.github.io/govuk-design-history/generate-a-page-of-screenshots/)
50
52
51
53
1. Use a PNG optimiser [like TinyPNG](https://tinypng.com/) to reduce the file size of your images.
52
54
2. Create a folder for your images and put them in `app/images/[service-name]/YYYY/MM/[post-name]/`
53
-
3. From the terminal, run `node scripts/generate.js [path]` where `path` is the full path to the folder of images. The easiest way to do this is to type `node scripts/generate.js` and then drag the folder from Finder on to your terminal to fill in the path.
55
+
3. From the terminal, run `node scripts/generate.js [path]` where `path` is the full path to the folder of images. The easiest way to do this is to type `node scripts/generate.js` and then drag the folder from Finder on to your terminal to fill in the path.
54
56
4. The script will generate a new post linking to each image and place it in `app/posts/[service-name]/YYYY/MM/[post-name].md`.
55
57
5. You should check the title text for each image and amend as needed.
56
58
6. The script will prepend the post filename with the current date but you can delete this if you like.
57
59
58
60
## Deploying and publishing
59
61
60
-
Once you have a post you want to publish, make a PR on this repo with your suggested change.
62
+
Once you have a post you want to publish, make a pull request on this repo with your suggested change.
61
63
62
64
Once it is merged the updated design history will automatically deploy with your post.
0 commit comments