他サイトへのリンクカードを２つデザインの違うものを用意したい

SANGOのショートコードの作成は、library/functions/style-shortcode.phpで行っています。
この中の複製したいショートコードの関数を子テーマのfunctions.phpにコピペして、関数名だけ変えればOKです。
例えば「他サイトへのリンクカードのショートコード」はstyle-shortcode.phpの以下のコードにより作られています。

add_shortcode('sanko', 'sng_othersite_link'); // 他サイトへのリンクを出力
// ...省略...
function sng_othersite_link($atts)
{
  $href = isset($atts['href']) ? esc_url($atts['href']) : null;
  $title = isset($atts['title']) ? esc_attr($atts['title']) : null;
  $site = isset($atts['site']) ? '<span>' . esc_attr($atts['site']) . '</span>' : "";
  $target = isset($atts['target']) ? 'target="_blank"' : "";
  $rel = isset($atts['rel']) ? ' rel="nofollow noopener noreferrer"' : ' rel="noopener noreferrer"';
  if ($href && $title) { // タイトルとURLがある場合のみ出力
      $output = <<<EOF
  <a class="reference table" href="{$href}" {$target}{$rel}>
    <span class="tbcell refttl">参考</span>
    <span class="tbcell refcite">{$title}{$site}</span>
  </a>
EOF;
    return $output;
  } else {
    return '<span class="red">参考記事のタイトルとURLを入力してください</span>';
  }
} // END sng_othersite_link

これを複製する場合、以下のようなコードを子テーマのfunctions.phpに追加します。

add_shortcode('sanko2', 'my_othersite_link'); // 他サイトへのリンクを出力
function my_othersite_link($atts)
{
  $href = isset($atts['href']) ? esc_url($atts['href']) : null;
  $title = isset($atts['title']) ? esc_attr($atts['title']) : null;
  $site = isset($atts['site']) ? '<span>' . esc_attr($atts['site']) . '</span>' : "";
  $target = isset($atts['target']) ? 'target="_blank"' : "";
  $rel = isset($atts['rel']) ? ' rel="nofollow noopener noreferrer"' : ' rel="noopener noreferrer"';
  if ($href && $title) { // タイトルとURLがある場合のみ出力
      $output = <<<EOF
  <a class="my-reference reference table" href="{$href}" {$target}{$rel}>
    <span class="tbcell refttl">参考</span>
    <span class="tbcell refcite">{$title}{$site}</span>
  </a>
EOF;
    return $output;
  } else {
    return '<span class="red">参考記事のタイトルとURLを入力してください</span>';
  }
} // END sng_othersite_link

↑
・ここでは複製したショートコード名をsanko2としています。好きな名前でOKです。
・関数名はsng_othersite_linkからmy_othersite_linkに変更しています（2箇所書きかえる必要があります）。こちらも別の名前でもOKです。
・カードのHTMLに.my-referenceというクラスを追加しておきました。複製したカードに対してのみスタイルを適用したい場合は.my-reference { ~ }などとCSSを書くことになります。

よろしくお願いします。

解決しました。
ありがとうございました。^ ^

もう一度すみません。
他サイトへのリンクカードの左側関連を任意の画像に変更することは可能でしょうか？

リンクカードのアイコンはFontAwesomeを疑似要素で指定することにより出力されています。

.reference .refttl:before {
    content: "\f02e";
}

f02eの部分を好きなアイコンのコードに書き換えることで変更できます。
・アイコン一覧
・アイコンのコードの探し方

よろしくお願いします。

すみません。私の質問文が間違えておりました。

FontAwesomeを利用するのではなく、自分で作成した画像に差し替えたい場合は、どのようにしたら良いでしょうか？

「関連記事」のように、アイキャッチを読み取るのではなく、作成画像を他リンクカードに入れたいのです。

あ、そういうことですね。
大変申し訳ないのですが、こちらは画像を挿入する機能には対応していません…。

返信ありがとうございます。

試行錯誤した結果、phpの方で読み取ることが出来ました。

お手数お掛けして申し訳ありませんでした。

丁寧にありがとうございます。
いえ、自己解決ありがとうございました。