Extension:WikiEditor/Toolbar customization/Library

From testwiki
Revision as of 21:22, 4 August 2023 by imported>Clump (Reverted edits by 2601:403:C100:20E0:403D:2162:413:4E5A (talk) to last version by Samwilson)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

To use these snippets, you need to paste them in your common.js page, inside a wikiEditor.toolbarReady hook handler (as described in the basic setup section).

Snippets requiring no customization

Strikethrough button

This puts the button in the "Advanced" section of the toolbar. To put it in the top section of the toolbar instead, replace 'advanced' with 'main'.

	$textarea.wikiEditor( 'addToToolbar', {
		section: 'advanced',
		group: 'format',
		tools: {
			"strikethrough": {
				label: 'Strike',
				type: 'button',
				oouiIcon: 'strikethrough',
				action: {
					type: 'encapsulate',
					options: {
						pre: "<s>",
						post: "</s>"
					}
				}
			}
		}
	} );

Horizontal line button

This puts the button in the "Advanced" section of the toolbar. To put it in the top section of the toolbar instead, replace 'advanced' with 'main'. The button uses the old toolbar's horizontal line image; to change this, change the URL after icon:.

	$textarea.wikiEditor( 'addToToolbar', {
		section: 'advanced',
		group: 'format',
		tools: {
			hline: {
				label: 'Horizontal line',
				type: 'button',
				icon: 'https://upload.wikimedia.org/wikipedia/commons/a/a4/H-line_icon.png',
				action: {
					type: 'encapsulate',
					options: {
						pre: '----',
						ownline: true
					}
				}
			}
		}
	} );

Comment button

	$textarea.wikiEditor( 'addToToolbar', {
		section: 'advanced',
		group: 'format',
		tools: {
			comment: {
				label: 'Comment',
				type: 'button',
				icon: 'https://upload.wikimedia.org/wikipedia/commons/3/37/Btn_toolbar_commentaire.png',
				action: {
					type: 'encapsulate',
					options: {
						pre: '<!-- ',
						post: ' -->'
					}
				}
			}
		}
	} );

Math button

	$textarea.wikiEditor( 'addToToolbar', {
		section: 'advanced',
		group: 'format',
		tools: {
			math: {
				label: 'Math',
				type: 'button',
				oouiIcon: 'mathematics',
				action: {
					type: 'encapsulate',
					options: {
						pre: '<math>',
						post: '</math>'
					}
				}
			}
		}
	} );


See also