「style属性」対応の最終版 は撤回
「ver.3.5」を、これまでの「style属性」型の「Blog Table ⭐」の最終版だと先日書きましたが、「ver.3.6」を公開する事にしました。
「表」での英文の振舞いについてネットを調べると、予想以上に採り上げている記事が多く、それだけユーザーを困らせる要件のひとつだと判ります。 前ページでは『表内に「文章」を表示する使い方は、対象外で良い』というスタンスに固執していますが、これは改める事にしました。
今後の 「半角英数文字」に対する仕様
「表」の「英文の表示」を規定する設定を、以下の3種から選択可能にする
①「word_break: break-all」
単語の途中でも改行される様に、ワードラップを完全に無効にする。
➁「word_break: break-word」
通常の英文の扱いで、単語を分ける改行をしない。
➂「word_breakを指定しない」
この設定がない従来の「Blog Table ⭐」の状態を再現する。 過去の表のレイアウトが崩れた場合に対応する目的です。
「ver.3.5」は ① が固定でしたが、これで色々な場合に対応可能になります。
ストレージのアイテム数を追加
「word_break」の設定を採り入れる事になり、これまでのローカルストレージでは記録枠が足りなくなりました。 先を見越して予備枠を追加しましたが、この変更で、今回の「ver.3.6」に更新すると、これまでの「表コピー」で登録していた表のデザインがリセットされます。「表作成」時の「表の雛形」が初期化されるので、申し訳ありませんが、必要に応じで再設定をしてください。 ◞(..)◟
以下が、「word_break」を追加した、新しい登録アイテムの一覧です。
ver.3.6以降 / 2024.01.31
| 項目名 | 登録配列 | 初期値 | 対象の変数やプロパティ |
| ツール名 | setting[0] | BlogTable | --- |
| 列数 | setting[1] | 1 | col.value |
| 行数 | setting[2] | 1 | row.value |
| 配置 | setting[3] | 0 | posit_set |
| 表幅 | setting[4] | 620 | t_width.value |
| 本文幅メモ | setting[5] | 620 | |
| セル padding | setting[6] | 0.6 | add_padd |
| 枠線幅 | setting[7] | 1 | border_width.value |
| 左端列優先 | setting[8] | tr:not(:first-child) | left_full |
| 枠線色 | setting[9] | #999 | color_input[0].value |
| 最上行背景色 | setting[10] | #F4F4F4 | color_input[1].value |
| 左端列背景色 | setting[11] | #F4F4F4 | color_input[2].value |
| 全体背景色 | setting[12] | #FFF | color_input[3].value |
| 文字サイズ | setting[13] | 16 | t_font.value |
| セル均等幅 | setting[14] | auto | layout_fix |
| 英文禁則処理 | setting[15] | break-all | word_break |
| （予備） | setting[16] | ||
| （予備） | setting[17] |
「英文禁則」の設定方法
「英文禁則」の設定は、メインパネルで設定した方がインターフェイスとしては判り易いのですが、ボタンを置く空きがありません。 仕方が無いので、「セル幅の設定パネル」にボタンを置きました。
ただしこの「英文禁則」のボタンは、設定を変更すると「表更新」を押さなくても、即座に設定が反映します。
●「英文禁則」のボタンを「左Click」するごとに、順に設定が変わります。
▪ 指定した「英文禁則」の設定は、その段階で「表」に書き込まれ反映します。
▪ 新規に作成する表は、最後に「表コピー」をした表の設定（雛形）を再現します。
従って雛形の「禁則処理」を変更するには、「禁則処理」を目的の設定にした上で「表コピー」をする必要があります。
「英文禁則」の選択
「英文禁則」の設定で表のレイアウトが影響を受けるのは、「半角英数文字」の文字列を表中に書き込んでいる場合です。「漢字」（日本語の文字）のみの表では、どの設定でも、レイアウトとは無関係です。
下は「英文禁則」のパネル上の表示と設定内容です。
| パネル表示 | CSSの設定コード | 英文の表示結果 |
| No | word_break: break-all | 単語の途中でも改行される |
| Yes | word_break: break-word | 単語の途中では改行されない |
| --- | word_breakを指定しない | （従来の表の状態を再現） |
下は、「英文禁則」の設定による違いを示すサンプルです。
上の例では、「Yes」「---」の表示に差はありませんが、「---」は書き込まれた内容によっては、表のレイアウトが調節し難くなる場合があります。 お勧めは「No」か「Yes」で、英文を表にまとめる場合は「Yes」が適しているでしょう。
「Blog Table ⭐」の使い方
以下のページのマニュアルに、詳しい操作方法を纏めています。
「Blog Table ⭐」を利用するには
「Blog Table ⭐」のコードは「Github」で配布しています。
このリンク先は下の様な画面で、ここでコードのコピーが可能です。
❶ 赤枠のところに、コピー用のボタンがあります。 これをクリックします。
これで、ページ上のコードがクリップボードにコピーされます。
❷「Tampermonkey」の管理画面で「＋」マークの「新規スクリプト」を開きます。
❸「新規スクリプト」には、最初からテンプレートが記入されています。 これは全て削除して、完全に空白の編集枠にしてください。
❹ 編集枠内をクリックして「Ctrl+V」を押すか、右クリックして「貼り付け」を選択します。
➎ コードの先頭までスクロールして、最初の行から正しく貼り付けられたかを確認してください。
❻ 最後に「ファイル」メニューの「保存」を押すと、ツールが使用可能になります。
「Blog Table ⭐」最新版について
旧いバージョンの JavaScriptツールは、アメーバのページ構成の変更で動作しない場合があり、導入する場合は最新バージョンをお勧めします。
●「Blog Table ⭐」の最新バージョンのリンクは、以下のページのリンクリストから探せます。
