TCDテーマCURE：トップページの「診療案内一覧」の抜粋文を4行以上表示させる方法

Q.診療案内一覧の抜粋文を4行目まで表示させることはできますか？

▼変更箇所イメージ

A.カスタムCSSで対応できます。

管理画面のTCDテーマ > 基本設定 > カスタムCSSエリアに以下のCSSを記載してください。

抜粋文の表示行数調整

▼参考CSS

.index_service_list .service_list .item .desc span {
    -webkit-line-clamp: 4;
}

.index_service_list .service_list .item .desc {
    max-height: 8em;
}

上記対応で、抜粋文は4行目まで表示されます。
また、5行目まで表示させたい場合は、上記の-webkit-line-clampを5に、max-heightを10emに変更してください。
※ max-heightには表示させたい行数×2emを設定くださいませ。

▼修正後変更箇所イメージ

抜粋文の行数は変更せずに、もう少しだけ文章のコンテンツの幅を広げたい（左右のpaddingを減らしたい）という方は、以下の記事を参考にしてください。

2024.06.21

TCDテーマCURE：トップページの「診療案内一覧」の抜粋文の横幅を広げる方法

Q.診療案内一覧の抜粋文の左右paddingを減らして、横幅を広げるにはどうしたらいいですか？ ▼変更箇所イメージ A.カスタムCSSで対応できます。 管理画面のTCDテーマ > 基本設定 > カスタムCSSエリアに以下のCSSを記載してください。 抜粋文の表示幅調整 ▼参...