ClipBox

当サイトではアフィリエイト広告を掲載しています

English information available at mw:Extension:ClipBox

Extension:ClipBox は、‎<clipbox>タグを使って記事中にキャンペーンコード等^※を埋め込むために自作した、MediaWiki用Extension（拡張機能）。

テキストボックス‎<input>にキャンペーンコード、紹介コード等の文字列を入れておき、ボタンをクリック（またはテキストをダブルクリック）するとクリップボードにコピーされる。

1行文字列ならば特に制限なく使えるが、一般に半角英数字の利用を想定している。

Setting 初期設定

Download

ClipBox_20240201.zip (5KB)

Download and unzip it on your MediaWiki extensions directory.

You can use it freely at your own risk. I license it under the Revised BSD License.

⇒English installation guide is here.

LocalSettings.php

Edit LocalSettings.php file to add below.

LocalSettings.php　

/* Extension:ClipBox */
wfLoadExtension( 'ClipBox' );

And check Special:Version on your wiki.

Common.css

Edit MediaWiki:Common.css if you want to customize it. For example:

MediaWiki:Common.css　

/* Extension:ClipBox */
.clipbox {
	font-size: 16px;
	color: #333;
	text-align: center;
	align-items: center;
}
.clipbox input {
	padding: 7px 0;
	text-align: center;
	border-radius: 5px;
	font-size:14px;
	letter-spacing:1px;
}
.clipbox button {
	font-size: 16px;
	padding: 9px;
	border-radius: 5px;
	color:#444;
}
.clipbox button:hover {
	opacity: 0.8;
}

Note: You will need interface-admin permission to edit Common.css on MediaWiki 1.32 or above.

Example 使用例

<clipbox>MYCODE</clipbox>

パラメータは全て省略可。この場合、テキストボックスはreadonlyにならないので、書き換えできることに要注意。

<clipbox
	id="artofmiku"
	size="15"
	title="キャンペーンコード"
	input="readonly"
	style="text-align: center;">
ARTOFMIKU
</clipbox>

id, size, style, titleを指定できる。

input は readonlyにしたい時に指定する。

id, size は ‎<input>にそのまま適用される。 ‎<clipbox>を同一ページに複数配置する場合は、別個のid指定が必須。1つしか使わないなら省略可。

style, title は ‎<div>にそのまま適用される。

上の例を展開するとこんな感じ↓になっている。

<div class="clipbox" title="キャンペーンコード" style="text-align: center;">
<input id="artofmiku" value="ARTOFMIKU" readonly="" ondblclick="javascript:ClipBoxCopyToClipboard('artofmiku')">
<input id="artofmikuPreCaption" type="hidden" value="【キャンペーンコード】 ">
<input id="artofmikuPostCaption" type="hidden" value=" をコピーしました！">
<button onclick="javascript:ClipBoxCopyToClipboard('artofmiku')" type="submit">コピーする</button>
</div>
<script type="text/javascript">
（省略）
</script>

Bugs

便宜上（もとい、手抜きして）スクリプトを個別に埋め込んでいるが、きれいにまとめたい…
スタイルシートも…

History

2024.02.01 (v1.0.0): 初版