Learn how to configure Docus.
::code-group
export default defineAppConfig({
docus: {
title: 'Docus',
description: 'My Docus Project',
url: 'http://docus.dev',
layout: 'default'
}
})
export default defineAppConfig({
docus: {
title: 'Docus',
description: 'My Docus Project',
url: 'http://docus.dev',
image: '/social-card-preview.png',
socials: {
twitter: '@docus_',
github: 'nuxtlabs/docus',
},
github: {
root: 'content',
edit: true,
contributors: false
},
aside: {
level: 1,
filter: [],
},
header: {
title: false,
logo: true,
showLinkIcon: false
},
footer: {
credits: {
icon: 'IconDocus',
text: 'Powered by Docus',
href: 'https://docus.com',
},
iconLinks: [
{
label: 'NuxtJS',
href: 'https://nuxtjs.org',
component: 'IconNuxtLabs',
},
{
label: 'Vue Telescope',
href: 'https://vuetelescope.com',
component: 'IconVueTelescope',
},
],
}
}
})
::
Key | Type | Default | Description |
---|---|---|---|
title |
string |
Docus | Website title |
description |
string |
My Docus Project | Website description |
url |
string |
Website URL | |
layout |
string |
default | Fallback layout to use |
Socials | |||
socials |
object |
{} |
Social links |
socials.github |
string |
The repository to use on GitHub links | |
socials.twitter |
string |
The account to use on Twitter links | |
socials.youtube |
string |
The channel to use on Youtube links | |
socials.instagram |
string |
The account to use on Instagram links | |
socials.facebook |
string |
The account to use on Facebook links | |
socials.medium |
string |
The account to use on Medium links | |
socials.[social] |
object |
Override social or display custom one | |
socials.[social].label |
string |
A label to use for the social | |
socials.[social].icon |
string |
A icon to use for the social | |
socials.[social].href |
string |
A link to use for the social | |
Header | |||
header |
object |
Header configuration | |
header.logo |
boolean |
Whether or not to use Logo.vue as the header logo |
|
header.title |
string |
If set to a string, will be used in the header | |
header.showLinkIcon |
boolean |
If set to true links icons will show in the header |
|
header.exclude |
string[] |
An array of path to exclude out from the header navigation | |
Aside | |||
aside |
object |
Aside configuration | |
aside.level |
string |
0 | Aside base level of nesting |
aside.collapsed |
boolean |
Will be used as default value for collapsible navigation categories | |
aside.exclude |
string[] |
An array of path to exclude out from the aside navigation | |
Footer | |||
footer |
object |
Footer configuration | |
footer.credits |
object |
An object defining the bottom left credits | |
footer.credits.icon |
object |
The icon to use for the credits | |
footer.credits.text |
object |
The text to use for the credits | |
footer.iconLinks |
array |
[] |
An array of icons to display in the footer |
footer.iconLinks[0].label |
string |
A label to use for the icon | |
footer.iconLinks[0].href |
string |
A link to use for the icon | |
footer.iconLinks[0].icon |
string |
The icon to use (can be a component name) | |
GitHub | |||
github |
object |
false |
GitHub integration configuration |
github.edit |
boolean |
Toggle "Edit this page on Github" component on documentation pages | |
github.contributors |
boolean |
Toggle contributors component on documentation pages | |
github.root |
string |
The root path to use for "Edit on Github" component |