+function register (...) {
+ peertubeHelpers.getSettings()
+ .then(s => {
+ if (!s || !s['site-id'] || !s['url']) {
+ console.error('Matomo settings are not set.')
+ return
+ }
+
+ // ...
+ })
+}
+```
+
+#### Get server config
+
+```js
+function register (...) {
+ peertubeHelpers.getServerConfig()
+ .then(config => {
+ console.log('Fetched server config.', config)
+ })
+}
+```
+
+#### Add custom fields to video form
+
+To add custom fields in the video form (in *Plugin settings* tab):
+
+```js
+async function register ({ registerVideoField, peertubeHelpers }) {
+ const descriptionHTML = await peertubeHelpers.translate(descriptionSource)
+ const commonOptions = {
+ name: 'my-field-name,
+ label: 'My added field',
+ descriptionHTML: 'Optional description',
+
+ // type: 'input' | 'input-checkbox' | 'input-password' | 'input-textarea' | 'markdown-text' | 'markdown-enhanced' | 'select' | 'html'
+ // /!\ 'input-checkbox' could send "false" and "true" strings instead of boolean
+ type: 'input-textarea',
+
+ default: '',
+
+ // Optional, to hide a field depending on the current form state
+ // liveVideo is in the options object when the user is creating/updating a live
+ // videoToUpdate is in the options object when the user is updating a video
+ hidden: ({ formValues, videoToUpdate, liveVideo }) => {
+ return formValues.pluginData['other-field'] === 'toto'
+ },
+
+ // Optional, to display an error depending on the form state
+ error: ({ formValues, value }) => {
+ if (formValues['privacy'] !== 1 && formValues['privacy'] !== 2) return { error: false }
+ if (value === true) return { error: false }
+
+ return { error: true, text: 'Should be enabled' }
+ }
+ }
+
+ const videoFormOptions = {
+ // Optional, to choose to put your setting in a specific tab in video form
+ // type: 'main' | 'plugin-settings'
+ tab: 'main'
+ }
+
+ for (const type of [ 'upload', 'import-url', 'import-torrent', 'update', 'go-live' ]) {
+ registerVideoField(commonOptions, { type, ...videoFormOptions })
+ }
+}
+```
+
+PeerTube will send this field value in `body.pluginData['my-field-name']` and fetch it from `video.pluginData['my-field-name']`.
+
+So for example, if you want to store an additional metadata for videos, register the following hooks in **server**:
+
+```js
+async function register ({
+ registerHook,
+ storageManager
+}) {
+ const fieldName = 'my-field-name'
+
+ // Store data associated to this video
+ registerHook({
+ target: 'action:api.video.updated',
+ handler: ({ video, body }) => {
+ if (!body.pluginData) return
+
+ const value = body.pluginData[fieldName]
+ if (!value) return
+
+ storageManager.storeData(fieldName + '-' + video.id, value)
+ }
+ })
+
+ // Add your custom value to the video, so the client autofill your field using the previously stored value
+ registerHook({
+ target: 'filter:api.video.get.result',
+ handler: async (video) => {
+ if (!video) return video
+ if (!video.pluginData) video.pluginData = {}
+
+ const result = await storageManager.getData(fieldName + '-' + video.id)
+ video.pluginData[fieldName] = result
+
+ return video
+ }
+ })
+}
+```
+
+#### Register settings script
+
+To hide some fields in your settings plugin page depending on the form state:
+
+```js
+async function register ({ registerSettingsScript }) {
+ registerSettingsScript({
+ isSettingHidden: options => {
+ if (options.setting.name === 'my-setting' && options.formValues['field45'] === '2') {
+ return true
+ }
+
+ return false
+ }
+ })
+}
+```
+#### Plugin selector on HTML elements
+
+PeerTube provides some selectors (using `id` HTML attribute) on important blocks so plugins can easily change their style.
+
+For example `#plugin-selector-login-form` could be used to hide the login form.
+
+See the complete list on https://docs.joinpeertube.org/api-plugins
+
+#### HTML placeholder elements
+
+PeerTube provides some HTML id so plugins can easily insert their own element:
+
+```js
+async function register (...) {
+ const elem = document.createElement('div')
+ elem.className = 'hello-world-h4'
+ elem.innerHTML = '<h4>Hello everybody! This is an element next to the player</h4>'
+
+ document.getElementById('plugin-placeholder-player-next').appendChild(elem)
+}
+```
+
+See the complete list on https://docs.joinpeertube.org/api-plugins
+
+#### Add/remove left menu links
+
+Left menu links can be filtered (add/remove a section or add/remove links) using the `filter:left-menu.links.create.result` client hook.
+
+#### Create client page
+
+To create a client page, register a new client route:
+
+```js
+function register ({ registerClientRoute }) {
+ registerClientRoute({
+ route: 'my-super/route',
+ onMount: ({ rootEl }) => {
+ rootEl.innerHTML = 'hello'