skin-tako-2偽横タブ型/白黒・赤アクセントカラーのシンプルスキンです。
#skin-tako-2試しに見てみる＜スキンについて＞●左サイドバーはheight100%のボックスをposition:fixedで固定しています。skin１のような、同じページ内に内容を表示するタブ型ではないです（ページが変わります）
（もうちょっといいやり方があるのかもしれません。。。）
一番上のリンクはホームに戻るリンク、その下は[[CATEGORY:TREE]]を挿入しています。
●外側スキン[[CATEGORY:TREE]]の装飾について
①まずは見た目を安定させるため、第２階層以降を非表示にします。公式説明に従って
.depth2 { display:none; }を記述します。
┗てがろぐ公式：
カテゴリの第1階層だけを表示させる方法 ②付箋っぽくしたいので、サイドバーの右側、カテゴリーの各リンクをボーダーで適当に囲います。
③「○○のカテゴリを表示すると、○○のボタンの色が反転する」という装飾をします。
公式説明に従って<body>とかに
class="[[SITUATION:CLASS]]"を指定します。
┗てがろぐ公式：
そのときの表示状況に応じてページデザインを切り替える方法 これでカテゴリ名に対応したカテゴリIDをクラス名として持つページができます。
<body>に指定しているのでページ全体の背景を変更したり、自由なカスタマイズが可能です。
（これでできる方にはできると思いますが、管理人自身が忘れないためのメモ的説明です。多分もっと簡単でちゃんとした方法があると思います…。）続きを読む
今回は『カテゴリ名「共通内容」カテゴリID「cat1」というページを表示したとき』に装飾をしたいので、
.selected-cat.cat-cat1 .catlink.cat-cat1 {～～}
というような記述をします。
.selected-cat.cat-cat1はcat1を表示したときに[[SITUATION:CLASS]]に出力されているクラス、
.catlink.cat-cat1はカテゴリツリーのcat1に付与されているクラスです。
畳む ④縦書きにします。（ここは好み）
writing-mode: vertical-rl; ⑤box-shadowで右に水平に5pxくらい伸ばして付箋っぽくします。そのほか、適当に好みの形に整えて終わりです。
●CSSだけでページ内移動をなめらかにする方法
html { scroll-behavior: smooth;} を記述
Javascripttとかわかる方はこれ以外の方法でもできると思います。
＜参考リンク＞CSSでページ内リンクをなめらかにスクロールする
#skin-tako-1 について
クイック投稿フォームをすっきりさせる方法クラス「changelink」「decoBtns」をdisplay: none;にすると、投稿フォームでの「他のIDに切り替える」と各種装飾ボタンが一括で削除できます。以下旧記載
続きを読む文字数カウンタの設定なんですが、おそらくクラス設定されていない（idが付与されてるんですが、投稿に紐づく乱数の文字列みたいです）ので、CSSの設定ができません。
ただ、文字数カウンタ（他ID切り替えも）CGIの設定で管理できるので、不要な方は削除して使用しているかと思います。
●設定＞＞投稿欄の表示＞＞【投稿コントロール枠内の設定】
☑入力文字数のカウンタを表示
☑他のIDに切り替えるリンクを表示
その他、装飾～機能ボタンも設定で管理できます。
が、個人的に「ゆっくり細かい設定もしたいけど、とりあえずメモ…みたいな場面でクイック投稿フォームでは表示したくない」（気が散るので）をやりたかったのでやってみました。
装飾では実装済みですが、そのうちクイックと本投稿フォームで画像～機能ボタンの切り替えとかすっきりできていいなと思います。
畳む（2022/11/19追記）
上記の方法だと文字数カウンタが消せなかったんですが、下記サイトで紹介されている方法のほうが文字数カウンタまで非表示にできます。
https://10prs.com/tegalog/?postid=25.line-control input ~ * { display:none; }
この方法のほうが簡単にできそうです。
「input」だけだと投稿ボタンまで非表示になるし、文字数カウンタは非表示にはできないのであきらめてました。兄弟結合子、勉強します！