「タイル」リストスタイル3列時にheightを揃える

>タイルとはそういうものなので、そういった表示になるのはしょうがないのですが

ですよね。承知の上です(>_<)

上記のスタイルシートで対応したいと思います！

ありがとうございます！！

参考情報として。以下のスクリプトを試してみたやつ→blazechariot(hostinger)
あまりよい方法ではないですが、

$(function(){
  $(".entry-content h2 a").each(function(){
    var max = 24;
    var count = $(this).text();
    if ( count.length >= max){
      var str = count.slice(0,max);
      $(this).text(str + "...");
    }
  });
});

これで指定文字数(var max)でタイトル文字数を揃えることができますが、タイトルに日本語と英語が混在している場合が問題です。タイトルをうまくつけれればいいんですけどね。
あとはcssでmin-heightあたりを入れてみたりでサイズを揃えるとか。うーん、なんかいまいち。

$(this).text(str + “…”); では、$(“.entry-content h2 a”)の文字列を指定文字で丸めた後「…」を入れて続きがあるというような表示にしています。Simplicityではマウスオーバーすればtitleに入ってる全文が表示されるので問題ないといえばそうなのですが…。
マウスオーバーしたらタイトル全文を表示するようにしても良いかも知れません。リンクのtitle属性を拾うとかで。
また、if〜の部分をswitchに変えて、任意の文字数の時、cssを操作して文字サイズを変更しても良いかも知れないのですが、あまりよい感じではないかも知れません。
heightを.entry-content h2 aに与えて、overflowとかでhiddenとかスクロールにするのも良いのかも。

マルチバイト、シングルバイト混合の時に対応したものを発見したので、先日のスクリプトに合わせて書いておきます。

(function($){
  $.fn.cutString=function(options){
    var defaults = {
      length: 20,
      ellipsisText: "..."
    };
    var options = $.extend(defaults, options);
    return this.each(function(){
      obj = $(this);
      var str = $.trim(obj.html()),
      strLen=str.length,
      optLen=options.length,
      len=0;
      function cut(){
        for (var i=0; i<strLen; i++) {
          len += (str.charCodeAt(i) > 128) ? 2 : 1;
          if (len > optLen) return str.substring(0,i) + options.ellipsisText;
        }
        return str;
      }
      obj.html(cut());
    });
  };
})(jQuery);

$(function(){
  $(".entry-content h2 a").each(function(){
    var max = 36;
    $(this).cutString({length: max});
  });
  $(".entry-content .entry-snippet").each(function(){
    var max = 120;
    $(this).cutString({length: max});
  });
});

これで、entry-snippetの文字列を囲んでるブロックの高さをmin-heightとかで調節すればサイズが揃うのではないかと思います(※抜き出す文字数は要調整)。マルチバイトとシングルバイトを判断している部分はプラグイン化しているので別で読み込んでも可。子テーマjavscript.jsにコピペでもイケると思います。

マルチバイトとシングルバイトを判断している部分は、jquery multibyte stringより引用。

あぁ使い方書いてなかった。

$(“字数を丸めたいセレクタ”).each(function(){

})

うぉぉぉぉ、猫がenter押してもた

$(“字数を丸めたいセレクタ”).each(function(){
$(this).cutString({length: 字数});
})

こんな感じでイケます。サンプルとして blazechariot(hostinger)で公開しています。min-heightやらheightやらは設定していません。

今、色々試してみた所、サムネイルのサイズ(高さ)が小さいものはズレが生じるようです。
ここらから、サムネイルをある程度高さを持ったもので作成すれば良いかも知れません。