Contents・サイドバーに固定する目次用CSS2019/05/26前回”目次プラグイン”のマニュアルを作りました。Contents」は、なかなか面白い使い方ができるので、一度上記に目を通しておくといい発見があるかもしれません。その中で、PCのサイドバーに”目次”を固定できる機能があります。そのままだと微妙なので、CSSで見た目を整えてみました。Contents」に対し、テーマ側でCSSが用意されていることがあります。その場合は、以下のチェックを外してください。BeforeAfterコピペ用のコード・自分でカスタマイズ用のコード両方あるのでお好きな方でどうぞ。固定目次を鬼シンプルにするCSS固定目次のCSS【まとめ】カゲサイの固定目次用CSS当サイトで使用しているコードです。これでいいやって人はお使いください。「SANGO」は、サイドバーのliタグ子要素に、テーマ独自のCSSが適用されているので、調整してね。BeforeAfter固定目次を自分でカスタマイズしたい人用のCSS解説では、コードを分解して解説します。細かい調整をしたい方はご活用ください。先頭の赤字コードは、上記にチェックした場合、サイドバーの目次にも表示されてしまうので、それを消すコードです。折りたたみボタンを使わない人は不要。#ddd;}青字セレクタのイメージはこんな感じ。上記は「下線」ですが、点線にしたりいろいろできます。固定目次を鬼シンプルにするCSS先ほどは、一般的な固定目次で使いそうなコードを解説しました。今度は背景色や連番を抜いて、文字だけのバージョンです。アイコンも外しちゃっていいかもですね。normal;}連番を残したい場合は、紫コードを削除して、緑コードを使用してください。あとは上で紹介したコードを応用してください。好みの目次にできましたか?サイドバーは幅が狭いので、フォントを気持ち小さめにすると、オシャレになりますよ。次回は、記事内の目次CSSをいくつか書きますので、お楽しみに〜追記:書きました。【SANGO】のデフォルトアニメーションを完全OFFにするCSS【見出しタグの使い方】記事はh2〜h4だけで構成しようGoogleアナリティクス自分のアクセスを完全除外【スマホ・PC】Googleアナリティクスの使い方と見方23用語をわかりやすく解説この記事を書いた人カゲオ陰ながら最高の人生を模索するブログ「カゲサイ」の管理人です。自分が好きなものやブログのことを色々書いています。2019年6月21日いつも参考にさせていただいております。カゲサイさんのように固定目次を表示させたいのですが、本ページに公開されているCSSはSANGO専用なのでしょうか・・・?当方、Wordpressテーマ「JIN」を活用しているためか、コピペ(SANGO用部分を削除した上で)したのですが、特に変わらずうまくいきませんでした。お手数をおかけしますが、ご教授いただけますと幸いです。2019年6月21日えむ様コメントありがとうございます。ありゃそれは失礼しました。プラグイン用のCSSなので、テーマによる差異はないはずです。・キャッシュ削除はされているか?・プラグイン設定で以下のチェックが外れているか?上記をご確認の上、うまくいかないのであればコピーしたコードを貼り付けてください。コメントをキャンセルメールアドレスが公開されることはありません。7陰ながら最高の人生を模索するブログ「自分が好きなものを紹介したりブログのことを色々書いてます。