Mediawiki运行javascript和css小工具的扩展CharInsert

CharInsert 是一个创建的JavaScript扩展,很多网站的低部都有快捷标签输入功能就是用这个扩展的一个小工具。

CharInsert下载

CharInsert地址:https://www.mediawiki.org/wiki/Extension:CharInsert

CharInsert安装

LocalSettings.php的底部添加以下代码:
Mediawiki1.25添加:
wfLoadExtension( 'CharInsert' );
Mediawiki1.24或更早:
require_once "$IP/extensions/CharInsert/CharInsert.php";

安装小工具前的准备工作

使用大多数小工具功能时,都需要安装Gadgets这个扩展,MediaWiki 1.18后已经包含在扩展目录中,之前的请下载:
https://www.mediawiki.org/wiki/Extension:Gadgets
Gadgets开启方法
在LocalSettings.php的底部加入:

Mediawiki1.25添加:
wfLoadExtension( 'Gadgets' );
MediaWiki 1.24或更早:
require_once "$IP/extensions/Gadgets/Gadgets.php";

第一个工具:快捷标签输入功能

快捷标签小工具工具安装第一步

在搜索中输入:Mediawiki:Common.css 并编辑,加入以下CSS:
/**
 * 20151112 内容低部快捷标签
 * Styling for links generated by [[MediaWiki:Edittools]]
 * @source https://www.mediawiki.org/wiki/Extension:CharInsert#Styling
 * @updated 2012-02-29
 */
.mw-charinsert-buttons {
	margin-top: 10px;
	border: 1px solid #aaaaaa;
	padding: 1px;
	text-align: center;
	font-size: 110%;
}
.mw-charinsert-buttons a {
	color: black;
	background-color: #cde !important;
	font-weight: bold;
	font-size: .9em;
	text-decoration: none;
	border: thin #069 outset;
	padding: 0 .1em .1em;
}
.mw-charinsert-buttons a:hover,
.mw-charinsert-buttons a:active {
	background-color: #bcd;
	border-style: inset;
}
.client-js .mw-edittools-section {
	display: inline;
}
.client-js .mw-edittools-section input[type="button"] {
	font-size: 0.9em;
	padding-left: 1px;
	padding-right: 1px;
	margin-left: 1px;
}

/**
 * 20151112 内容低部快捷标签结束
*/

工具安装第二步

在搜索中输入:MediaWiki:Edittools 并加入以下代码:
<!-- 这里的文字将显示在编辑和上传表格下面。 -->

<!-- Text here will be shown below edit and upload forms. -->
<!-- Please don't translate this page with sub pages (it will render support of that menu for your language very likely unmaintainable) -->
<div id="mw-edittools-charinsert" class="mw-charinsert-buttons">
<p class="mw-edittools-section" data-section-title="Standard">&nbsp;  
<charinsert>[[File:64gua_+.png]]</charinsert> ·
<charinsert>[[+]]</charinsert> ·
<charinsert>[[+|]]</charinsert> ·
<charinsert>{{+}}</charinsert> ·
<charinsert>– —</charinsert> ·
<charinsert>“+” ‘+’ «+» ‹+› „+“ ‚+‘</charinsert> ·
<charinsert>… ~ | ° <nowiki>&</nowiki>nbsp;</charinsert> ·
<charinsert>≈ ≠ ≤ ≥ ± − × ÷ ← → ² ³ ½ · § (css3)</charinsert>
<br />    
<charinsert>[[Category:+]]</charinsert> ·
<charinsert><poem>+</poem></charinsert> ·
<charinsert><code>+</code></charinsert> ·
<charinsert>[[:File:+]]</charinsert> ·
<charinsert>[[Special:MyLanguage/+]]</charinsert> ·
<charinsert><includeonly>+</includeonly></charinsert> ·
<charinsert><noinclude>+</noinclude></charinsert> ·
<charinsert>#REDIRECT[[+]]</charinsert> ·
<charinsert>&lt;translate>+&lt;/translate></charinsert> ·
<charinsert><languages/></charinsert> ·
<charinsert>&#123;&#123;#translation:&#125;&#125;</charinsert> ·
<charinsert>&#123;&#123;DEFAULTSORT:+&#125;&#125;</charinsert> ·
<charinsert><s>+</s></charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Latin" style="display: none;">
<charinsert>Á á   É é Í í Ó ó   Ú ú Ý ý   </charinsert> ·
<charinsert>À à È è Ì ì Ò ò Ù ù </charinsert> ·
<charinsert>Â â   Ê ê     Î î   Ô ô   Û û </charinsert> ·
<charinsert>Ä ä Ë ë Ï ï Ö ö Ü ü ÿ </charinsert> ·
<charinsert>Ã ã Ñ ñ Õ õ </charinsert> ·
<charinsert>Å å </charinsert> ·
<charinsert>Ç ç </charinsert> ·
<charinsert>  Š š  </charinsert> ·
<charinsert>  </charinsert> ·
<charinsert>    </charinsert> ·
<charinsert>Ø ø </charinsert> ·
<charinsert> ā  ē  ī  ō  ū </charinsert> ·
<charinsert>ß  </charinsert> ·
<charinsert>Æ æ Œ œ </charinsert> · 
<charinsert>Ð ð Þ þ |</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Greek" style="display: none;" >
<charinsert>Α  Β Γ Δ Ε  Ζ Η  Θ Ι  Κ Λ Μ Ν Ξ Ο  Π Ρ Σ Τ Υ  Φ Χ Ψ Ω </charinsert> · 
<charinsert>α  β γ δ ε  ζ η  θ ι  κ λ μ ν ξ ο  π ρ σ ς τ υ  φ χ ψ ω </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Cyrillic" style="display: none;">
<charinsert>А Б В Г Д  Е Ё Ж З  И Й  К Л  М Н  О П Р С Т  У Ф Х Ц Ч  Ш Щ Ъ Ы Ь Э Ю Я </charinsert> · 
<charinsert>а б в г д  е ё ж з  и й  к л  м н  о п р с т  у ф х ц ч  ш щ ъ ы ь э ю я </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="IPA" style="display: none;">
<charinsert>    ɡ    </charinsert> · 
<charinsert>               </charinsert> · 
<charinsert>      </charinsert> · 
<charinsert>     </charinsert> · 
<charinsert>     </charinsert> · 
<charinsert>        </charinsert> · 
<charinsert>    </charinsert> · 
<charinsert>      </charinsert> · 
<charinsert>      </charinsert> · 
<charinsert>    </charinsert> · 
<charinsert>    </charinsert> · 
<charinsert>    </charinsert> · 
<charinsert>  </charinsert> · 
<charinsert>       </charinsert> · 
<charinsert>   ɑ  </charinsert> · 
<charinsert>        </charinsert> · 
<charinsert>     </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Arabic" style="display: none;">
<span dir="rtl" style="font-size:120%;">
<charinsert>                           ☆氀琀;/charinsert> · 
<charinsert>                           </charinsert> ·
<charinsert>                           </charinsert> ·
<charinsert>                           </charinsert> ·
<charinsert>- - - - -       ☆氀琀;/charinsert> ·
<charinsert>     &#1696;          ☆氀琀;/charinsert>
</span>
</p>

<p class="mw-edittools-section" data-section-title="Catalan" style="display: none;">
<charinsert>Á á À à Ç ç É é È è Ë ë Í í Ï ï Ó ó Ò ò Ö ö Ú ú Ù ù</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Czech" style="display: none;">
<charinsert>Á á     É é  ě Í í  ň Ó ó   Š š   Ú ú   Ý ý  </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Devanāgarī" style="display: none;">
<charinsert>                                                                                             ☉氀琀;/charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Esperanto" style="display: none;">
<charinsert>           </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Estonian" style="display: none;">
<charinsert>  Š š   Õ õ Ä ä Ö ö Ü ü</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="French" style="display: none;">
<charinsert>À à  â Ç ç É é È è Ê ê Ë ë Î î Ï ï Ô ô Œ œ Ù ù Û û Ü ü Ÿ ÿ</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="German" style="display: none;">
<charinsert>Ä ä Ö ö Ü ü ß </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Hawaiian" style="display: none;">
<charinsert> ā  ē  ī  ō  ū </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Hebrew" style="display: none;">
<charinsert>                             ★氀琀;/charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Hungarian" style="display: none;">
<charinsert>   </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Icelandic" style="display: none;">
<charinsert>Á á Ð ð É é Í í Ó ó Ú ú Ý ý Þ þ Æ æ Ö ö</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Italian" style="display: none;">
<charinsert>Á á À à É é È è Í í Ì ì Ó ó Ò ò Ú ú Ù ù</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Latvian" style="display: none;">
<charinsert> ā    ē    ī       Š š  ū  </charinsert> 
</p>

<p class="mw-edittools-section" data-section-title="Lithuanian" style="display: none;">
<charinsert>          Š š    ū  </charinsert> 
</p>

<p class="mw-edittools-section" data-section-title="Maltese" style="display: none;">
<charinsert>       </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Old English" style="display: none;">
<charinsert> ā Æ æ       Ð ð  ē    ī  ō  ū     Þ þ  </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Pinyin" style="display: none;">
<charinsert>Á á À à  ǎ  ā É é È è  ě  ē Í í Ì ì  ǐ  ī Ó ó Ò ò  ǒ  ō Ú ú Ù ù Ü ü  ǔ  ū  ǘ  ǜ  ǚ  ǖ</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Polish" style="display: none;">
<charinsert>        ń  ó Ó      </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Portuguese" style="display: none;">
<charinsert>Á á À à Â â Ã ã Ç ç É é Ê ê Í í Ó ó Ô ô Õ õ Ú ú Ü ü</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Romaji" style="display: none;">
<charinsert> ā  ē  ī  ō  ū</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Romanian" style="display: none;">
<charinsert>  Â â Î î    </charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Scandinavian" style="display: none;">
<charinsert>À à É é Å å Æ æ Ä ä Ø ø Ö ö</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Serbian" style="display: none;">
<charinsert>А а Б б В в Г г Д д   Е е Ж ж З з И и   К к Л л   М м Н н   О о П п Р р С с Т т   У у Ф ф Х х Ц ц Ч ч   Ш ш</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Spanish" style="display: none;">
<charinsert>Á á É é Í í Ñ ñ Ó ó Ú ú Ü ü ¡ ¿</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Turkish" style="display: none;">
<charinsert>Ç ç     Ö ö   Ü ü Â â Î î Û û</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Vietnamese" style="display: none;">
<charinsert>À à   Á á   Ã ã             Â â             È è     É é   Ê ê               Í í   Ì ì   Ó ó   Ò ò Õ õ Ô ô                       Ù ù     Ú ú                       Ý ý</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Welsh" style="display: none;">
<charinsert>Á á À à Â â Ä ä É é È è Ê ê Ë ë Ì ì Î î Ï ï Ó ó Ò ò Ô ô Ö ö Ù ù Û û       Ý ý     Ÿ ÿ</charinsert>
</p>

<p class="mw-edittools-section" data-section-title="Yiddish" style="display: none;">
<charinsert>                         +       +                </charinsert>
</p>  
</div>

工具安装第三步

在搜索中输入:Mediawiki:Gadget-Edittools.js 并加入以下代码:
/**
 * EditTools support: add a selector, change <a> into buttons.
 * The special characters to insert are defined at [[MediaWiki:Edittools]].
 *
 * @author Arnomane, 2006 (on the commons.wikimedia.org/wiki/MediaWiki:Edittools.js)
 * @author Kaganer, 2007 (adapting to www.mediawiki.org)
 * @author Krinkle, 2012
 * @source www.mediawiki.org/wiki/MediaWiki:Gadget-Edittools.js
 * @revision 2012-02-29
 */
/*jslint browser: true*/
/*global jQuery, mediaWiki*/
(function ($, mw) {
	"use strict";

	var conf, editTools, $sections;

	conf = {
		initialSubset: window.EditTools_initial_subset === undefined ? window.EditTools_initial_subset : 0
	};

	editTools = {

		/**
		 * Creates the selector
		 */
		setup: function () {
			var $container, $select, initial;

			$container = $('#mw-edittools-charinsert');
			if (!$container.length) {
				return;
			}
			$sections = $container.find('.mw-edittools-section');
			if ($sections.length <= 1) {
				// Only care if there is more than one
				return;
			}

			$select = $('<select>').css('display', 'inline');

			initial = conf.initialSubset;
			if (isNaN(initial) || initial < 0 || initial >= $select.length) {
				initial = 0;
			}

			$sections.each(function (i, el) {
				var $section, sectionTitle, $option;

				$section = $(el);
				sectionTitle = $section.data('sectionTitle');

				$option = $('<option>')
					.text(sectionTitle)
					.prop('value', i)
					.prop('selected', i === initial);

				$select.append($option);
			});

			$select.change(editTools.handleOnchange);
			$container.prepend($select);

			editTools.chooseSection(initial);
		},

		/**
		 * Handle onchange event of the <select>
		 *
		 * @context {Element}
		 * @param e {jQuery.Event}
		 */
		handleOnchange: function () {
			editTools.chooseSection(Number($(this).val()));

			return true;
		},

		/**
		 * Toggle the currently visible section
		 *
		 * @param sectionNr {Number}
		 * @param setFocus {Boolean}
		 */
		chooseSection: function (sectionNr) {
			var $choise = $sections.eq(sectionNr);
			if ($choise.length !== 1) {
				return;
			}

			// Making these buttons is a little slow,
			// If we made them all at once the browser would hang
			// for over 2 seconds, so instead we're doing it on-demand
			// for each section. No need to do it twice thoguh, so remember
			// in data whether it was done already
			if (!$choise.data('charInsert.buttonsMade')) {
				$choise.data('charInsert.buttonsMade', true);
				editTools.makeButtons($choise);
			}

			$choise.show();
			$sections.not($choise).hide();
		},

		/**
		 * Convert the <a onclick> links to buttons in a given section.
		 *
		 * @param $section {jQuery}
		 */
		makeButtons: function ($section) {
			var $links;

			if (!$section.length) {
				return;
			}

			$links = $section.find('a');
			$links.each(function (i, a) {
				var $a, button;
				$a = $(a);
				button = document.createElement('input');
				button.type = 'button';
				button.onclick = a.onclick;
				button.value = $a.text();
				$a.replaceWith(button);
			});
		}

	};

	$(document).ready(editTools.setup);

}(jQuery, mediaWiki));

工具安装第四步

在搜索中输入:Mediawiki:Gadgets-definition 并加入:
* Edittools[ResourceLoader|default]|Edittools.js
至此这个快捷功能已经安装成功了。

修远兮安装后记:一开始我以为安装完CharInsert就会开启此功能,可安装完后发现并没有出现快捷输入,于是重新看官网的介绍,按照里面的步骤一步步的试,用时两个小时才成功,希望这么详细的介绍对用mediawiki的朋友有帮助。

评论

大侠名号:   验证码: 点击我更换图片  

修远兮

在这里记录每一点自己需要的知识

添加创始人微信,一起交流心得

推荐文章RECOMMEND