mirror of
https://github.com/facebook/docusaurus.git
synced 2025-08-04 01:09:20 +02:00
feat(v2): allow users to specify a custom ssr HTML template (#3387)
* feat(v2): allow users to specify a custom ssr HTML template * docs(v2): add ssrTemplate property to docusaurus.config.js page
This commit is contained in:
parent
9857f7b2b5
commit
3ace60043b
6 changed files with 60 additions and 8 deletions
|
@ -306,6 +306,50 @@ module.exports = {
|
|||
};
|
||||
```
|
||||
|
||||
### `ssrTemplate`
|
||||
|
||||
An HTML template that will be used to render your application. This can be used to set custom attributes on the `body` tags, additional `meta` tags, customize the `viewport`, etc. Please note that Docusaurus will rely on the template to be correctly structured in order to function properly, once you do customize it, you will have to make sure that your template is compliant with the requirements from `upstream`.
|
||||
|
||||
- Type: `string`
|
||||
|
||||
Example:
|
||||
|
||||
```js title="docusaurus.config.js"
|
||||
module.exports = {
|
||||
ssrTemplate: `<!DOCTYPE html>
|
||||
<html <%~ it.htmlAttributes %>>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=0.86, maximum-scale=3.0, minimum-scale=0.86">
|
||||
<meta name="generator" content="Docusaurus v<%= it.version %>">
|
||||
<%~ it.headTags %>
|
||||
<% it.metaAttributes.forEach((metaAttribute) => { %>
|
||||
<%~ metaAttribute %>
|
||||
<% }); %>
|
||||
<% it.stylesheets.forEach((stylesheet) => { %>
|
||||
<link rel="stylesheet" type="text/css" href="<%= it.baseUrl %><%= stylesheet %>" />
|
||||
<% }); %>
|
||||
<% it.scripts.forEach((script) => { %>
|
||||
<link rel="preload" href="<%= it.baseUrl %><%= script %>" as="script">
|
||||
<% }); %>
|
||||
</head>
|
||||
<body <%~ it.bodyAttributes %> itemscope="" itemtype="http://schema.org/Organization">
|
||||
<%~ it.preBodyTags %>
|
||||
<div id="__docusaurus">
|
||||
<%~ it.appHtml %>
|
||||
</div>
|
||||
<div id="outside-docusaurus">
|
||||
<span>Custom markup</span>
|
||||
</div>
|
||||
<% it.scripts.forEach((script) => { %>
|
||||
<script type="text/javascript" src="<%= it.baseUrl %><%= script %>"></script>
|
||||
<% }); %>
|
||||
<%~ it.postBodyTags %>
|
||||
</body>
|
||||
</html>
|
||||
};
|
||||
```
|
||||
|
||||
### `stylesheets`
|
||||
|
||||
An array of CSS sources to load. The values can be either strings or plain objects of attribute-value maps. The `<link>` tags will be inserted in the HTML `<head>`.
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue