メインビジュアルの設定 - hbm-HR

メインビジュアルの設定方法について解説します。

　

管理画面 > [デザイン] > [(1) トップページヘッダ] > [(2) メインビジュアル] のHTML記述欄にて各要素を調整して下さい。

遷移先を変更する

# を適切なリンクに置き換えてください。

<a href="#"><!-- 遷移先 -->

リンクが不要な場合は aタグを削除してください。
その際は閉じタグ（</a>）についても忘れず削除をお願いします。

画像を変更する

画像URL 部分に画像のURLを設定してください。
画像の説明についても必要であれば設定して下さい。（画像が何らかの問題で表示されない時に表示されます）

<source srcset="画像URL" media="(max-width: 767px)"><!-- SP用 -->
<img src="画像URL" alt="画像の説明"><!-- PC用 -->

!-- SP用 --のコメントアウトがある画像URLはスマートフォン時に表示、!-- PC用 --のコメントアウトがある画像URLはPC時に表示されます。

画像を増やす・減らす

下記HTMLli～/liタグを増やすことで、画像枚数を増やすことが可能です。
減らしたい場合は、li～/liタグを減らしたい枚数分削除してください。

<li>
  <a href="#"><!-- 遷移先 -->
    <picture class="hatena-module-mainvisual-img">
      <source srcset="画像URL" media="(max-width: 767px)"><!-- SP用 -->
      <img src="画像URL" alt=""><!-- PC用 -->
    </picture>
  </a>
</li>