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
You can find the example site code in [packages/site](https://github.com/eshlox/gatsby-theme-axii/tree/master/packages/site) directory.
25
-
26
-
## How to use the theme
27
-
28
-
1. Create a new directory and add `package.json` file with this content:
29
-
30
-
```json
31
-
{
32
-
"private": true,
33
-
"name": "blog",
34
-
"version": "0.0.1",
35
-
"license": "MIT",
36
-
"scripts": {
37
-
"build": "gatsby build",
38
-
"develop": "gatsby develop",
39
-
"clean": "gatsby clean"
40
-
}
41
-
}
42
-
```
43
-
44
-
2. Installation
45
-
46
-
```
47
-
npm install gatsby @eshlox/gatsby-theme-axii
48
-
```
49
-
50
-
3. Create `.env` file to provide Algolia credentials.
51
-
52
-
```env
53
-
ALGOLIA_APPLICATION_ID=APP-ID
54
-
ALGOLIA_ADMIN_API_KEY=ADMIN-API-KEY
55
-
ALGOLIA_SEARCH_API_KEY=SEARCH-API-KEY
56
-
```
57
-
58
-
4. Run the development server.
59
-
60
-
```sh
61
-
npm run develop
62
-
```
63
-
64
-
5. Build the site.
65
-
66
-
```sh
67
-
npm run build
68
-
```
69
-
70
-
## Configuration
71
-
72
-
Create a `gatsby-config.js` file, use the configuration below and modify it to your needs.
73
-
74
-
```js
75
-
// Loads environment variables from a .env file into process.env
76
-
require("dotenv").config();
77
-
78
-
constoptions= {
79
-
// The directory with blog posts (markdown/mdx files)
80
-
contentPosts:"content/posts",
81
-
// The site configuration
82
-
siteMetadata: {
83
-
// The site URL
84
-
siteUrl:`https://gatsby-theme-axii.netlify.com`,
85
-
// The index page title
86
-
siteTitle:`Homepage`,
87
-
// The site description
88
-
siteDescription:`Very simple blog theme.`,
89
-
// Author data
90
-
author: {
91
-
nickname:`eshlox`,
92
-
// Author name. It's added to each page title.
93
-
name:`Foo Bar`,
94
-
email:`email@example.com`
95
-
},
96
-
// Social accounts. Remove to disable.
97
-
social: {
98
-
twitter: {
99
-
username:"eshlox",
100
-
url:"https://twitter.com/eshlox"
101
-
},
102
-
github: {
103
-
url:"https://github.com/eshlox/gatsby-theme-axii"
104
-
},
105
-
linkedin: {
106
-
url:"https://linkedin.com/eshlox"
107
-
},
108
-
telegram: {
109
-
url:"https://telegram.me/eshlox"
110
-
}
111
-
},
112
-
// Data used for the manifest page file
113
-
manifest: {
114
-
name:`AXII - A Gatsby blog theme`,
115
-
short_name:`AXII`
116
-
},
117
-
// Data used to display support component. Remove to disable.
118
-
support: {
119
-
buymeacoffee: {
120
-
url:"https://www.buymeacoffee.com/eshlox"
121
-
}
122
-
},
123
-
// Comments services. Remove to disable.
124
-
comments: {
125
-
disqus: {
126
-
shortname:"axii-a-gatsby-theme"
127
-
}
128
-
},
129
-
// Alogolia application ID and credentials
130
-
search: {
131
-
algolia: {
132
-
posts: {
133
-
applicationId:process.env.ALGOLIA_APPLICATION_ID,
134
-
searchApiKey:process.env.ALGOLIA_SEARCH_API_KEY,
135
-
adminApiKey:process.env.ALGOLIA_ADMIN_API_KEY
136
-
}
137
-
}
138
-
}
139
-
}
140
-
};
141
-
142
-
constplugins= [
143
-
{
144
-
resolve:"@eshlox/gatsby-theme-axii",
145
-
options
146
-
}
147
-
];
148
-
149
-
module.exports= {
150
-
plugins
151
-
};
152
-
```
153
-
154
-
### Index page
155
-
156
-
To build the index page, create an `index.mdx` file in `src/pages` directory. It supports MDX so you can import and use all components. Components from [src/components](https://github.com/eshlox/gatsby-theme-axii/tree/master/packages/gatsby-theme-axii/src/components) are available automatically. Example:
0 commit comments