簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
Forum » フォーラムディスカッション / 一般 » 簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
このユーザーにより開始: 7happy7 7happy7
日付: 18 Oct 2019 16:53
投稿数: 7
rss icon RSS: 新しい投稿
簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
7happy7 7happy7 18 Oct 2019 16:53

こんにちは、テクニカルスタッフの7happy7 7happy7 です。

皆さんの中には下書きを仕上げる際に直接サンドボックスを、編集エリアを編集する方も多いのではと思います。

ところで、編集エリアには簡易的なwiki構文をペーストする機能がありますよね。コレ、皆さんは使ったことがありますか?太字構文やら(**text**)を書くのにこんな機能を使うことは、少なくとも私はありませんし、何より欲しい折りたたみ構文などのペースト機能はありません。何に使うか分からないボタンがいくつもあることも注目すべきでしょう。

no

下の列のボタンの用途が殆ど分からない

痒い所に手が届かない絶妙な仕様を誇るこの簡易ペースト機能ですが、しかし使えないならば使えるように作り替えてしまえばいいとは思いませんか?

というわけで、これをとっても便利に作り変えるブックマークレットをご用意いたしました。

b-aft.png

概観

適用方法

PC

以下のボタンをブックマークバーにドラッグ&ドロップしてください

スマートフォン(あるいはPCにおいて上記の手法が上手くいかなかった方)

下記のコードを下に挙げるページを参考に登録してください

javascript:if(!window.pasteMod)%7Bwindow.pasteMod%3D%7Bnow%3A%22off%22%2Cq%3Afunction(v)%7Breturn%20document.querySelector(v)%3B%7D%2Cpaste%3Afunction(v1%2Cv2)%7Bvar%20t%3Dthis.q(%22%23edit-page-textarea%22)%3Bvar%20all%3Dt.value%3Bvar%20start%3Dt.selectionStart%3Bvar%20end%3Dt.selectionEnd%3Bif(v2%3D%3Dundefined)%7Bt.value%3Dall.substr(0%2Cstart)%2Bv1%2Ball.substr(start%2Call.length)%3B%7Delse%20if(start%3D%3Dend)%7Bt.value%3Dall.substr(0%2Cstart)%2Bv1%2B%22%3Ctext%3E%22%2Bv2%2Ball.substr(start%2Call.length)%3B%7Delse%7Bt.value%3Dall.substr(0%2Cend)%2Bv2%2Ball.substr(end%2Call.length)%3Ball%3Dt.value%3Bt.value%3Dall.substr(0%2Cstart)%2Bv1%2Ball.substr(start%2Call.length)%3B%7D%7D%2Ccnt_char%3Afunction()%7Bvar%20ev%20%3D%20this.q(%22%23edit-page-textarea%22).value%3Bthis.q(%22%23cnt_char%22).innerHTML%20%3D%20ev.length%20%2B%20%22%20(%E7%A9%BA%E7%99%BD%3A%20%22%20%2B%20(ev.split(%2F%20%7C%E3%80%80%2F).length%20-%201)%20%2B%20%22%2C%20%E6%94%B9%E8%A1%8C%3A%20%22%20%2B%20(ev.split(%22%5Cn%22).length%20-%201)%20%2B%20%22)%22%3B%7D%2Cbousen%3Afunction()%7Bthis.paste('%5B%5Bspan%20class%3D%22bousen%22%5D%5D'%2C'%5B%5B%2Fspan%5D%5D')%3B%7D%2Cnamisen%3Afunction()%7Bthis.paste('%5B%5Bspan%20class%3D%22namisen%22%5D%5D'%2C'%5B%5B%2Fspan%5D%5D')%3B%7D%2Ckenten_now%3A%22kenten-b%22%2Ckenten_init%3Afunction(v)%7Bthis.kenten_now%3Dv%3B%7D%2Ckenten%3Afunction()%7Bthis.paste('%5B%5Bspan%20class%3D%22'%2Bthis.kenten_now%2B'%22%5D%5D'%2C'%5B%5B%2Fspan%5D%5D')%3B%7D%2Ccol%3Afunction()%7Bthis.paste('%5B%5Bcollapsible%20show%3D%22%2Bopen%22hide%3D%22-close%22%5D%5D%5Cn'%2C'%5Cn%5B%5B%2Fcollapsible%5D%5D')%3B%7D%2CmCol%3Afunction()%7Bthis.paste('%5B%5Binclude%20%3Ascp-int%3Acomponent%3Acoltop%20show%3D%2Bopen%7Chide%3D-close%5D%5D%5Cn'%2C'%5Cn%5B%5Binclude%20%3Ascp-int%3Acomponent%3Acolend%5D%5D')%3B%7D%2Cruby%3Afunction()%7Bthis.paste('%5B%5Bspan%20class%3D%22ruby%22%5D%5D'%2C'%5B%5Bspan%20class%3D%22rt%22%5D%5D%3Cruby%3E%5B%5B%2Fspan%5D%5D%5B%5B%2Fspan%5D%5D')%3B%7D%2Cfoot%3Afunction()%7Bthis.paste('%5B%5Bfootnote%5D%5D'%2C'%5B%5B%2Ffootnote%5D%5D')%3B%7D%2Ccolor%3Afunction()%7Bthis.paste('%23%23%23b01%7C'%2C'%23%23')%3B%7D%2Csize%3Afunction()%7Bthis.paste('%5B%5Bsize%20120%25%5D%5D'%2C'%5B%5B%2Fsize%5D%5D')%3B%7D%2Cbb%3Afunction()%7Bthis.paste('%E2%96%88')%3B%7D%2Cpict%3Afunction()%7Bthis.paste('%5B%5Binclude%20component%3Aimage-block%5Cn%7Cname%3D%3Cfile%20name%3E%5Cn%7Ccaption%3D'%2C'%5Cn%5D%5D')%3B%7D%2Crep%3Afunction()%7Bvar%20t%3Dthis.q(%22%23edit-page-textarea%22)%3Bt.value%3Dt.value.split(this.q(%22%23repBef%22).value).join(this.q(%22%23repAft%22).value)%3B%7D%2Cinit%3Afunction()%7Btry%7Bvar%20meta%3Dthis.q('%5Bname%3D%22viewport%22%5D')%3Bmeta.setAttribute(%22content%22%2Cmeta.getAttribute(%22content%22)%2B%22%2Cuser-scalable%3Dno%22)%3B%7Dcatch(e)%7B%7Dif(!this.q(%22%23edit-page-textarea%22))%7Bif(!window.WIKIDOT)%7Breturn%20alert(%22Detection%20failed%3A%20WIKIDOT%20object%20is%20undefined%22)%3B%7Delse%7Btry%7BWIKIDOT.page.listeners.editClick()%3Bvar%20target%3Dthis.q(%22%23action-area%22)%3Bvar%20observer%3Dnew%20MutationObserver(records%3D%3E%7Bobserver.disconnect()%3Breturn%20this.init()%3B%7D)%3Bvar%20options%3D%7BchildList%3Atrue%7D%3Bobserver.observe(target%2Coptions)%3B%7Dcatch(e)%7B%7D%7D%7Delse%7Bvar%20newWikiButtons%3D%60%3Cdiv%20class%3D%22repEdit%22%3E%3Cinput%20type%3D%22text%22id%3D%22repBef%22placeholder%3D%22XXXX%22%3E%3Cbutton%20onclick%3D%22pasteMod.rep()%22%3E%E2%86%92%3C%2Fbutton%3E%3Cinput%20type%3D%22text%22id%3D%22repAft%22placeholder%3D%229999%22%3E%3C%2Fdiv%3E%3Cbutton%20onclick%3D%22pasteMod.col()%22%3E%3Cspan%3Ecollapsible%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.mCol()%22%3E%3Cspan%3Ecol%20mod%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22WIKIDOT.Editor.buttons.tableWizard()%22%3E%3Cspan%3Etable%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.foot()%22%3E%3Cspan%3Efootnote%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.ruby()%22%3E%3Cspan%3Eruby%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.size()%22%3E%3Cspan%3Esize%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.color()%22%3E%3Cspan%3Ecolor%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22WIKIDOT.Editor.buttons.quote()%22%3E%3Cspan%3Eblock%20quote%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.bb()%22%3E%3Cspan%3Eblackbox(%E2%96%88)%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.pict()%22class%3D%22pmod_mid%22%3E%3Cspan%3Eimage(caption)%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.jFire()%22data-j%3D%22off%22class%3D%22pmod_mid%22%3EJStyles%3A%3Cspan%3EOFF%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.cnt_char()%22%3E%E6%96%87%E5%AD%97%E6%95%B0%3A%20%3Cspan%20id%3D%22cnt_char%22%3E%20-%20%3C%2Fspan%3E%3C%2Fbutton%3E%60%3Bvar%20wikiOptionStyle%3D%60%23action-area%20h1%7Bborder%3A2px%20solid%20%23b01%3Bborder-radius%3A0.25em%3Bdisplay%3Aflex%3Bflex-wrap%3Awrap%3Bjustify-content%3Aspace-around%3Bpadding%3A0.25em%3B%7D%23action-area%20h1%20.pmodBtn%2C%23action-area%20h1%20button%7Bdisplay%3Ablock%3Bflex-grow%3A1%3Bmargin%3A0%3Bpadding%3A0.25em%3Bwidth%3A26%25%3B-moz-appearance%3Anone%3B-webkit-appearance%3Anone%3B%7D%23action-area%20h1%20.repEdit%7Bbackground-color%3A%23F4F4F4%3Bborder%3A1px%20solid%20%23AAA%3Bdisplay%3Aflex%3Bflex-grow%3A1%3Bjustify-content%3Aspace-around%3Bmargin%3A0.25em%200%3Bpadding%3A0.25em%3Bwidth%3A90%25%3B%7D%23action-area%20h1%20.repEdit%20input%7Bborder%3A1px%20solid%20%23AAA%3Bcolor%3A%23b01%3Bflex-grow%3A1%3Bfont-family%3Asans-serif%3Bfont-size%3A0.925rem%3Bwidth%3A40%25%3B-moz-appearance%3Anone%3B-webkit-appearance%3Anone%3B%7D%23action-area%20h1%20.repEdit%20button%7Bflex-grow%3Aunset%3Bwidth%3A2rem%3B%7D%23action-area%20h1%20.pmod_mid%7Bwidth%3A40%25%3B%7D%23action-area%20h1%20.pmod_wide%7Bwidth%3A40%25%3B%7D%23action-area%20h1%20button%5Bdata-j%5D%7Bbackground%3A%23fff0f0%3B%7D%23action-area%20h1%20button%5Bdata-j%5D%20span%7Bdisplay%3Ainline-block%3Btext-shadow%3A0%200%202px%3Btransition%3Aall%200.25s%20ease-in-out%3Bwidth%3A2.5em%3B%7D%23action-area%20h1%20button%5Bdata-j%3D%22on%22%5D%20span%7Bcolor%3Agreen%3B%7D%23action-area%20h1%20button%5Bdata-j%3D%22off%22%5D%20span%7Bcolor%3Ared%3B%7D%23action-area%20h1%20.act%3Aafter%7Bcolor%3Agreen%3Bcontent%3A%22(J)%22%3Btext-shadow%3A0%200%202px%3B%7D%23action-area%20h1%20.pmodBtn%7Bbackground-color%3A%23F4F4F4%3Bborder%3A1px%20solid%20%23AAA%3Bcolor%3A%23000%3Bflex-grow%3Aunset%3Bmargin%3A0%3Bpadding%3A0.25em%3Btext-decoration%3Anone%3Bwidth%3A2rem%3B%7D%23action-area%20h1%20.pmodBtn%3Anot(%3Afocus)%7Bbackground-image%3Aurl(%22https%3A%2F%2Fja.m.wikipedia.org%2Fw%2Fload.php%3Fmodules%3Dmobile.ooui.icons%26image%3Dexpand%26format%3Drasterized%26skin%3Dminerva%26version%3Diffcu%22)%3Bbackground-position%3Acenter%3Bbackground-repeat%3Ano-repeat%3Bbackground-size%3A50%25%3Bfont-size%3A0%3B%7D%23wd-editor-toolbar-panel%7Bdisplay%3Anone%3B%7D%60%3Bvar%20wikiOption%3Dthis.q(%22%23action-area%20h1%22)%3BwikiOption.innerHTML%3DnewWikiButtons%3Bvar%20newStyle%3Ddocument.createElement(%22style%22)%3BnewStyle.innerHTML%3DwikiOptionStyle%3Bdocument.head.appendChild(newStyle)%3B%7D%7D%2CjFire%3Afunction()%7Bvar%20t%3Dthis.q(%22%23edit-page-textarea%22)%3Bvar%20e%3Dthis.q(%22%23action-area%20button%5Bdata-j%5D%22)%3Bthis.now%3De.getAttribute(%22data-j%22)%3Bvar%20rmv%3D(v)%3D%3E%7Bfor(var%20i%3D0%3Bi%3Cv.length%3Bi%2B%2B)v%5Bi%5D.remove()%3B%7D%3Bt.value%3Dt.value.split(%2F(%3F%3A%5Cn%7C%5E)%5C%5B%5C%5Binclude%20(%3F%3A%5C%3A.*%3F%3A%7C)component%5C%3Ajstyles%5C%5D%5C%5D%5Cn%3F%2Fg).join(%22%22)%3Bif(this.now%3D%3D%22off%22)%7Bt.value%3D'%5B%5Binclude%20%3Ascp-jp%3Acomponent%3Ajstyles%5D%5D%5Cn'%2Bt.value%3Be.setAttribute(%22data-j%22%2C%22on%22)%3Bthis.q(%22%23action-area%20button%5Bdata-j%5D%20span%22).innerHTML%3D%22ON%22%3Bthis.q(%22%23action-area%20h1%22).innerHTML%2B%3D%60%3Cbutton%20onclick%3D%22pasteMod.namisen()%22class%3D%22rmv%20act%22%3E%3Cspan%3E%E6%B3%A2%E7%B7%9A%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.bousen()%22class%3D%22rmv%20act%22%3E%3Cspan%3E%E5%82%8D%E7%B7%9A%3C%2Fspan%3E%3C%2Fbutton%3E%3Cbutton%20onclick%3D%22pasteMod.kenten()%22class%3D%22rmv%20act%22style%3D%22width%3Acalc(26%25-2rem)%22%3E%3Cspan%3E%E5%9C%8F%E7%82%B9%3C%2Fspan%3E%3C%2Fbutton%3E%3Cselect%20onchange%3D%22pasteMod.kenten_init(this.value)%22class%3D%22rmv%20pmodBtn%22%3E%3Coption%20value%3D%22kenten-b%22selected%3E%E5%B0%8F%E4%B8%B8(%E9%BB%92)%3C%2Foption%3E%3Coption%20value%3D%22kenten-wb%22%3E%E5%B0%8F%E4%B8%B8(%E7%99%BD)%3C%2Foption%3E%3Coption%20value%3D%22kenten-c%22%3E%E4%B8%B8(%E9%BB%92)%3C%2Foption%3E%3Coption%20value%3D%22kenten-wc%22%3E%E4%B8%B8(%E7%99%BD)%3C%2Foption%3E%3Coption%20value%3D%22kenten-goma%22%3E%E3%82%B4%E3%83%9E(%E9%BB%92)%3C%2Foption%3E%3Coption%20value%3D%22kenten-wgoma%22%3E%E3%82%B4%E3%83%9E(%E7%99%BD)%3C%2Foption%3E%3Coption%20value%3D%22kenten-t%22%3E%E4%B8%89%E8%A7%92(%E9%BB%92)%3C%2Foption%3E%3Coption%20value%3D%22kenten-wt%22%3E%E4%B8%89%E8%A7%92(%E7%99%BD)%3C%2Foption%3E%3Coption%20value%3D%22kenten-janome%22%3E%E8%9B%87%E3%81%AE%E7%9B%AE%3C%2Foption%3E%3Coption%20value%3D%22kenten-doublec%22%3E%E4%BA%8C%E9%87%8D%E4%B8%B8%3C%2Foption%3E%3Coption%20value%3D%22kenten-hoshi%22%3E%E6%98%9F%3C%2Foption%3E%3Coption%20value%3D%22kenten-kane%22%3E%EF%BF%A5%3C%2Foption%3E%3C%2Fselect%3E%60%3B%7Delse%7Be.setAttribute(%22data-j%22%2C%22off%22)%3Bthis.q(%22%23action-area%20button%5Bdata-j%5D%20span%22).innerHTML%3D%22OFF%22%3Brmv(document.querySelectorAll(%22%23action-area%20h1%20.rmv%22))%3B%7D%7D%7D%7D%3BpasteMod.init()%3B

https://qiita.com/aqril_1132/items/b5f9040ccb8cbc705d04

適用できましたか?できましたら、サンドボックスページでそのブックマークを「編集」ボタンの代わりに押してみてください!カスタム編集エリアが現れます!

b-aft.png

もいちど概観

1置換ツール
読んで字のごとくです。矢印ボタンを押すと、左のフォームに入れた文章と一致する部分を右のフォームに入れた文章に一括で置き換えます。SCP-XXXX-JPのXXXXを正規ナンバーに置き換えたりするなどができます。

2ペーストツール
ボタンを押すと、編集エリアのカーソルが置かれている位置に対応するwiki構文がペーストされます。テキストが選択状態の場合は、テキストを括るようにペーストされます。

b-samp.png

折りたたみで「aaaa」を括る

ボタンの一覧:

  • collapsible:
    wikidot標準の折り畳み([[collapsible]])です。
  • col mod:
    SCPウィキ専用の多重折りたたみです。詳しくはコチラ。
  • table:
    wikidot標準のテーブル(表)です。
  • footnote:
    wikidot標準の脚注構文です。
  • ruby:
    SCPウィキ専用のルビ構文です。選択範囲の括りは「ルビが振られるテキスト」です。
  • size:
    wikidot標準の文字サイズ変更構文です。
  • color:
    wikidot標準の文字色変更構文です。
  • block quote:
    wikidot標準の引用符です。選択範囲を引用符に納めます(ただし二重に括ることはできません)。
  • blackbox(█):
    SCP記事に多用される塗りつぶし文字です。選択範囲の括りはありません。
  • image(caption):
    SCPウィキ専用の画像ブロック構文です。選択範囲の括りは「キャプション部分のテキスト」です。


皆さんの創作活動の一助となれれば幸いです。






P.S. 作者の気まぐれで配布コードをアップデートすることがあります。新版の適用を行いたい場合には、改めて登録し直してください。

リビジョン: 0
変更の概要: —

リビジョン: 1
変更の概要: Nanimono Demonai Nanimono Demonai さんのjstyles構文のペースト機能を付与しました。jstylesについてはコチラから: http://ja.scp-wiki.net/japanese-syntax

リビジョン: 2
変更の概要: 編集エリア内の文字数を計測するボタンを追加しました。







Footnotes
. Chromeの場合
b-how.png
. 通常の編集エリアを表示させてからでも適用できます。
最後の編集 03 Aug 2020 14:30 by 7happy7
by 7happy7 7happy7 , 18 Oct 2019 16:53
Re: 簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
Rokurokubi Rokurokubi 19 Oct 2019 02:33

何より欲しい折りたたみ構文などのペースト機能はありません。何に使うか分からないボタンがいくつもあることも注目すべきでしょう。

ですよねー!

サンドボックスで無事に動作確認しました。素晴らしい利便性だと思います!ありがとうございます。
ディスカッションのコメントでも折りたたみ構文を使ったりするのでこれが使えたらいいのになぁという感想を抱きました。

by Rokurokubi Rokurokubi , 19 Oct 2019 02:33
Re: 簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
7happy7 7happy7 19 Oct 2019 05:33

感想ありがとうございます!

ディスカッションのコメントでも折りたたみ構文を使ったりするのでこれが使えたらいい

フォーラムはキーとなるアクションが多い(「New Post」や「Reply」、「Create a new thread」など)ので、難しいですね...。

by 7happy7 7happy7 , 19 Oct 2019 05:33
Re: 簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
tsucchii0301 tsucchii0301 24 Oct 2019 13:34

これはとても良いものです。

by tsucchii0301 tsucchii0301 , 24 Oct 2019 13:34
Re: 簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
7happy7 7happy7 01 Nov 2019 01:51

tsucchii0301 tsucchii0301 さん、ありがとうございます!

新版にアップデートいたしました。変更の概要については、上のポストをご確認ください。

by 7happy7 7happy7 , 01 Nov 2019 01:51
Re: 簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
H0H0 H0H0 02 Nov 2019 18:39

非常に助かっています。非常に便利なものをありがとうございます!特に置換は今まで外部ツールに頼らざるを得なかったため、高頻度で活用させていただいています。

by H0H0 H0H0 , 02 Nov 2019 18:39
Re: 簡単!wiki構文コピペ用、「カスタム編集エリア」ブックマークレットの共有
7happy7 7happy7 27 Jan 2020 16:47

編集エリア内の文字数をカウントしちゃうボタンを追加しました。空白文字及び改行の数も一緒にカウントしちゃいます。

新版へのアップデートは一番上のポストの追記の通り行ってください。

by 7happy7 7happy7 , 27 Jan 2020 16:47
/forum/t-12708365/wiki#post-
特に指定がない限り、このサイトのすべてのコンテンツはクリエイティブ・コモンズ 表示 - 継承3.0ライセンス の元で利用可能です。
ページを編集するにはこのボタンをクリックしてください。
セクションごとの編集を切り替えるにはこのボタンをクリックしてください(ページにセクションが設定されている必要があります)。有効になった場合はセクションに"編集"ボタンが設置されます。
ページのソース全体を編集せずに、コンテンツを追加します。
このページが過去にどのように変化したかを調べることができます。
このページについて話をしたいときは、これを使うのが一番簡単な方法です。
このページに添付されたファイルの閲覧や管理を行うことができます。
サイトの管理についての便利なツール。
このページの名前(それに伴いURLやページのカテゴリも)を変更します。
編集せずにこのページのソースコードを閲覧します。
親ページを設定/閲覧できます(パンくずリストの作成やサイトの構造化に用いられます)
管理者にページの違反を通知する。
何か思い通りにいかないことがありますか? 何ができるか調べましょう。
Wikidot.comのシステム概要とヘルプセクションです。
Wikidot 利用規約 ― 何ができるか、何をすべきでないか etc.
Wikidot.com プライバシーポリシー

AltStyle によって変換されたページ (->オリジナル) /