🌐

Zennでタブ文字の深さをカスタマイズする方法

2023/01/06に公開

結論

まず

body {
	tab-size: 3; /*お好きな数字をどうぞ*/
}

の記述があるcssファイルを作ります。safariの場合safariの設定のAdvancedのstyle sheetからこのファイルを読み込みます。

他のブラウザの場合も同様の設定があるかと思います。自分はsafariしか使ったことがないのでわかりませんが(ぇ

注意点としては、まぁわかると思いますがsafari全体の設定を変更しているためあらゆるサイトでtab-size 3します。

蛇足

読む必要はありません。Chromium系を使ってる方には美味しい情報があるかも?

動機

自分はインデントにtabを使っています(tabを使う理由)。ですがそうするとエディタからzennへコピーした際に見辛くなってしまいます。というのはzenn上ではtab文字は8文字幅固定のため、コードによっては横幅がめちゃくちゃ広くなってしまいます。これをgithubのようにカスタムできる様にしたいわけです。

更に欲を言うと自分はインデント幅を3文字にしています。ですが大体の場合tabは2、4、8のいずれか。これもどうにかしたい。

解決

と言うことでzennの運営さんに要望を送ってみました

最終的にzennにこの設定がくるのは難しそうですが、stylebotという拡張機能を使うことで同様のことをすることが出来ると教えてもらいました。

ですがこの拡張機能、safariに対応していません。代替プラグインでsafariに対応しているものがあるにはあったのですが、なぜかインストできない(古いサイトあるある)。自分はcssの知識はないのですがどうやらタブサイズを設定できるらしいということは分かりました。そこからsafariにcssファイルを読み込ませる設定あったなと言うのを思い出し、読み込ませてみたらうまいこと機能してくれました。

締め

cssやhtmlには興味がありませんでしたがブラウザを頻繁に使用している以上、知識があると(今回の様に)便利だよなぁと思いました。
近いうちに勉強したいですねぇ

Discussion