多分もっと絶対簡単なやり方があるんですが、
(それこそdream.php様の方でご紹介されてます!)
javaに全然明るくなかったので、これでうまくいったから、もう一生これでやっています()
【名前変換入力フォーム】
①置きたい場所にショートコードを貼り付け
②CSSで見た目を加工
サイト様に詳細記載あるので参考にしながら加工
【夢漫画】
①HTMLで画像と名前変換のショートコードを指定
■HTML
※名前変換のショートコードだけだとCSSの加工が何故か反映しないので、「、」か「文章」も一緒に記載する
※「<p>」のみだとアップデートのたびに<p>が消えるので「<p class=name1>」などで囲うとうまくいった
名前変換をする画像・名前変換のショートコードをdivで囲って、名前変換のショートコードをさらに細かく指定できるようにpで囲う
同じページに複数名前変換をする場合は、pをclassで分けて、文字位置をそれぞれ指定する
②CSSで加工
■追加CSS
◯divの設定
.namechange1 {/*親div*/
position: relative;/*相対配置*/
text-align: right; }
◯画像の設定
.namechange1 img {
width: 724px; /*画像の横幅表示サイズ*/
height: 1024 px; /*画像の高さ表示サイズ*/ }
◯名前変換コードの設定
.namechange1 .name1{
position: absolute; /*絶対配置*/
top: 0px; /*縦位置:初期は一番上*/
left: 0px; /*横位置:初期は一番左*/
font-size: 0.7rem; /*文字サイズ*/
font-family: “メイリオ”,”ヒラギノ角ゴシック”,”Arial”; /*文字フォント*/
color: black; /*文字色*/
-ms-writing-mode: tb-rl; /*縦書きにする*/
writing-mode: vertical-rl; /*右から左に読む*/ }