返信先: 作品リストについて

#1103
佐高
ゲスト

通りすがりに失礼いたします。

見当違いだったら申し訳ないのですが、察するに1話ごとに改行するのではなく、いくつか横並びにしてスクロールを少なくしたいということなのかなと思って素人ながらCSSを簡単にいじってみました。

もしかしたら間違っていて変な風になってしまうかも&CSSにお詳しい方ならもっと色々できると思うので恐縮ですが、とっかかりとして参考になれば幸いです。

 

ショートコードに任意のclass(ここでは●●●にしています)を追加して、子テーマのCSSもしくは追加CSSに以下のように記述すると横並びにできました。

.●●●{
width: 100%;
display: flex;
flex-wrap: wrap;
}
.●●● li{
margin-right: 1em;
}

力不足で20話みたいにキリよく区切るのは難しかったので、とりあえず画面にあわせて改行するようにしてみました。
liの指定はスマホだと間が詰まってしまったので適当に1文字分の空白を足したのですが、お好みの間隔にご指定ください。

 

あとはgtgt様のおっしゃっているように作品タイプで区切るとだいぶスッキリ見やすくなると思います。

また、他にもスクロールを少なくする方法を考えてみると、作品タイプで区切った上でページ内リンクでの目次作成や、プラグインを使ってのアコーディオン/スポイラー(クリックでリストを開閉できるもの)なども簡単で便利かと思います。

 

掲載方法について自分もどうやったら見やすくなるのか悩み続けているので、少しでも参考になれば嬉しいです。
ここまででしゃばりましたが、見当違いでしたら本当に申し訳ありません……。