diff --git a/app/index.ejs b/app/index.ejs index 0f3ec664c..915b22ea1 100644 --- a/app/index.ejs +++ b/app/index.ejs @@ -9,6 +9,7 @@ + <%= snippets %>
diff --git a/docs/development/build-config.md b/docs/development/build-config.md index 4467dbfe0..ba12b7623 100644 --- a/docs/development/build-config.md +++ b/docs/development/build-config.md @@ -6,10 +6,44 @@ Soapbox supports compile-time customizations in the form of environment variable You can place files into the `custom/` directory to customize the Soapbox build. +### Custom snippets (`custom/snippets.html`) + +If you'd like to include analytics snippets, custom meta tags, or anything else in the `` of the document, you may do so by creating a `custom/snippets.html` file. + +For example: + +```html + + + + + + + + + + +``` + +The snippet will be included **before** any Soapbox application code. + ### Custom locales (`custom/locales/*.json`) It is possible to override locale messages by creating a file for each language, eg `custom/locales/en.json`. In this file, add only the messages you want to be overridden. + For example: ```json @@ -26,6 +60,7 @@ These messages will be merged into the language file shipped with Soapbox. ### Feature overrides (`custom/features.json`) You can create a file called `custom/features.json` to disable version-checking and force some features on or off. + For example: ```json diff --git a/webpack/shared.js b/webpack/shared.js index 55ac4d6a7..9dee79de1 100644 --- a/webpack/shared.js +++ b/webpack/shared.js @@ -1,5 +1,6 @@ // Note: You must restart bin/webpack-dev-server for changes to take effect +const fs = require('fs'); const { join, resolve } = require('path'); const CopyPlugin = require('copy-webpack-plugin'); @@ -16,6 +17,15 @@ const rules = require('./rules'); const { FE_SUBDIRECTORY, FE_INSTANCE_SOURCE_DIR } = require(join(__dirname, '..', 'app', 'soapbox', 'build_config')); +// Return file as string, or return empty string +const readFile = filename => { + try { + return fs.readFileSync(filename, 'utf8'); + } catch { + return ''; + } +}; + const makeHtmlConfig = (params = {}) => { return Object.assign({ template: 'app/index.ejs', @@ -30,6 +40,9 @@ const makeHtmlConfig = (params = {}) => { removeStyleLinkTypeAttributes: true, useShortDoctype: true, }, + templateParameters: { + snippets: readFile(resolve('custom/snippets.html')), + }, }, params); };