説明会リンクの編集方法 - hbm-HR

管理画面 > [デザイン] > [トップページメインカラム] > [説明会] にて設定を行います。

HTML

<a class="urllist-item" href="#">
  <img class="pc_block" src="PC用の画像URL" alt=""><!-- PC用 -->
  <img class="sp_block" src="SP用の画像URL" alt=""><!-- SP用 -->
  <span class="urllist-title-link">
    説明会
</a>

ファイルアップローダーや貴社サーバーに画像素材をアップロードしていただき、画像のURLを設定してください。
!-- PC用 --のコメントアウトがある画像URLはPC時に表示、!-- SP用 --のコメントアウトがある画像URLはスマートフォン時に表示されます。

推奨画像サイズは次のとおりです。

PC ： 幅600px、高さ216px
SP ： 幅 : 高さ= 16 : 9 の縦横比のもの（推奨サイズ 幅800px：高さ450px）

ボタン背景を変更する

管理画面 > [デザイン] > [デザインCSS] にて設定を行います。

/* サイトカラー */
:root {
　--btn-bg:  #xxxxxx;/* 「説明会」「Info」のボタン背景 */
...
}

#xxxxxxの部分をurl('画像URL') とすることで画像の指定も可能です。
画像を使用する場合は、ファイルアップローダーや貴社サーバーにて画像素材をアップロードし、画像URLを取得してください。

画像を使用する場合は幅:高さ= 1 : 1 の縦横比のものを使用してください。（推奨サイズ 幅600px：高さ600px）

『Info』のボタン背景色と共通のため変更する際はご注意ください。

モジュールを復活させたい

モジュールを削除後に復活させたい場合の手順を解説します。

1. [モジュールを追加]からHTMLモジュールを追加

2. 下記のHTMLを貼り付ける

<a class="urllist-item" href="#">
  <img class="pc_block" src="PC用の画像URL" alt=""><!-- PC用 -->
  <img class="sp_block" src="SP用の画像URL" alt=""><!-- SP用 -->
  <span class="urllist-title-link">
    説明会
</a>

3. [高度な設定] を開き、class名に『seminar』と設定する