ブログカードを全体リンクにして並列させたい

Simplicityの元からついている機能は、それを自身で実装できない場合は便利ですがカスタマイズするとなると手間になる場合もあります。

やりたいことを見てみると、
・ブログカードを並べておきたい
・ブログカードのどこ押してもリンクにしたい
ということですよね？

デフォルトのブログカードで「ブログカードを並べておきたい」ができるなら、全体的なリンクは利用せずともごく簡単なjQueryでゴーストボタン使えば、どんな並び方でもできます。

デフォルトの全体リンクを利用されていて「ブログカードを並べておきたい」ができないのであれば、それを行おうとしている(並ぶところだけできていない状態の)サイトのアドレスを公開してもらえれば、何を触ればよいかを指摘することはできるかと思います。

サンプル作ってみました。

サンプル: ブログカード全体をリンクにするゴーストボタン | codepen

何をしているかといいますと、.blog-cardの先頭にブログカードのタイトルのリンクから取得したアドレスを入れたaタグを挿入し、サムネイル、ブログカードのタイトル、フッターをそれよりも前に配置します。
※ サンプルでは状態がわかりやすいように挿入したaタグにはグレーの色がつけてあります。

ゴーストボタンより全面にある要素にリンクがアレばそのリンクが動作し、リンクがない部分は反応しませんがそれが考えられるのはフッターだけなので、まぁ良しとして、他はリンクなのでもちろんクリックしたらそのページに飛びます。
抜粋部分等はもともとリンクがないのでゴーストボタンが動作して飛びます。

Simplicityの全体リンクもだいたいこんな感じのものが使われているんだろうとは思うんですけど(見てないので知りませんが)、質問の内容から察するにサイズが固定されているから問題があるように思います。

今回のサンプルでは、ゴーストボタンとなるAタグは.blog-cardに対してwidth: 100%; height: 100%;で入っているので、.blog-cardのサイズに追従するということです。

で、横に並べる際に気になったのは、抜粋の部分がmax-heightで数値固定されているために全体が表示できません。これはそれで構わないという場合は任意の数値を入れておけばよいかと思います。
また横幅も500pxで固定なので、取りました。
サンプルではflexで並べていますが、floatでも並べられると思います。

一応簡単なレスポンシブ対応にもしてみましたが、全体がそうなっているわけではありません。.testブロックの中だけですので注意してください。おまけでアニメーションもつけてみたり。