働く環境モジュールの編集方法 - hbm-HR

記事一覧モジュールのclass名を『hatena-module-custom-recruit』とすることで、このレイアウトが適用されます。

画像は幅:高さ=16:9の縦横比のものを使用してください。
アイキャッチを記事に設定しない場合はスライドが空白となってしまうため、必ずアイキャッチ設定を行なってください。

特定のカテゴリの最新記事をこのモジュールに表示する場合

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

[カテゴリー]にて表示するカテゴリーを選択できます。

他項目については『「最新記事」を表示する』を参考にしてください。

記事の表示順を変更する

投稿日が新しい順に表示されます。
表示順を変更するには、管理画面 > [記事の管理] から対象記事を選択し、 [編集オプション]  > [投稿日時]にて記事の投稿日を変更してください。

表示する記事をHTMLで選択する場合

管理画面 > [デザイン] > [トップページメインカラム]  > [働く環境(HTML設定)]にて設定を行います。

HTMLを適宜編集してください。
表示数の増減は、下記HTMLli～/liタグの塊を増やす、または減らすことで変更することが可能です。

<li class="urllist-item">
  <div class="urllist-item-inner">
    <a class="urllist-image-link" href="遷移先URL">
      <img class="urllist-image" alt="" src="画像URL">
    </a>
    <a href="遷移先URL" class="urllist-title-link">テキストテキストテキスト</a>
  </div>
</li>

遷移先は下記aタグの遷移URLを修正してください。

<a class="urllist-image-link" href="遷移先URL">

画像は下記imgタグの画像URLを修正してください。

<img class="urllist-image" alt="" src="画像URL">

公開時にはモジュールタイトル『働く環境（HTML設定）』を適宜変更してください。

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

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

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

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

<ul class="hatena-urllist urllist-with-thumbnails">

<li class="urllist-item">
<div class="urllist-item-inner">
<a class="urllist-image-link" href="遷移先URL">
<img class="urllist-image" alt="" src="画像URL">
</a>
<a href="遷移先URL" class="urllist-title-link">テキストテキストテキスト</a>
</div>
</li>

<li class="urllist-item">
<div class="urllist-item-inner">
<a class="urllist-image-link" href="遷移先URL">
<img class="urllist-image" alt="" src="画像URL">
</a>
<a href="遷移先URL" class="urllist-title-link">テキストテキストテキスト</a>
</div>
</li>

<li class="urllist-item">
<div class="urllist-item-inner">
<a class="urllist-image-link" href="遷移先URL">
<img class="urllist-image" alt="" src="画像URL">
</a>
<a href="遷移先URL" class="urllist-title-link">テキストテキストテキスト</a>
</div>
</li>

</ul>

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