WordPressテーマSANGOの質問

記事リンクに使うカードの文字数を制限したい

アバター
坂巻

はじめまして。坂巻と申します。お世話になります。

トップページをサイト化しようと思い[catpost][/catpost]や[tagpost][/tagpost]を使って記事を出力させたのですが、2カラムで並べると文字数によってカードの縦幅が変わり左右でズレが発生してしまいます。

そこで文字数を制限してカードの並びを左右均等にしたいと考えているのですが、[catpost][/catpost]や[tagpost][/tagpost]に文字数制限を入れるにはどうしたら良いのでしょうか。

一応Google検索や、こちらのサイトの過去の質問履歴を見させて頂いたのですが改善に繋がるものが見つけられなかったので質問させてください。

お忙しいところ申し訳ありません。

SANGO
SANGO 質問ガイドライン
コメントへの回答
サルワカくん
サルワカくん
2020/10/09

catpostでカードタイプの記事を出力したときに最大の文字列を決めたいということですね。
CSSだけでできる行数制限テクニックを活用するのが良いと思います。
具体的には、以下のようなCSSを追加CSSなどに貼り付けます。

.catpost-cards .c_linkto_text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; /* 最大3行でカット */
    text-overflow: ellipsis;
    width: 100%;
    overflow: hidden;
    line-height: 1.5;
    padding-bottom: 0;
    margin-bottom: 0.7em;
}

よろしくお願いします。