無料ホームページテンプレート Template Party無料ホームページテンプレート Template Party

『高機能版』求人サイト向けCMSのご紹介

求人サイト向けCMS(高機能版)共通メニュー

>> CMSバージョン履歴(2019/02/19更新) <<

一覧ページの各ブロックをもう少しコンパクトにする方法

job1とjob2の一覧ページの各ブロックがやや大きいので、少しコンパクトにする方法のご紹介です。
同じ要領でトップページの一覧出力も変更できます。cssへの設定は共通で使えるので、index_.htmlだけの編集でOK。

設定方法

  1. list.htmlを開き、figureの行をlist直下に移動します。
  2. 移動したfigureを左に回り込みさせるスタイルをstyle.cssに追加します。
    以下をコピペして使って下さい。
  3. 写真の右側に回り込みさせたいブロックを<div class="text">〜</div>で囲みます。
  4. 右に回り込むスタイルをstyle.cssに追加します。
  5. textスタイルをもしボタンの上で区切った場合、以下のような状態になってしまうと思うので、

    <p><a href="?act=bukken&id〜〜〜
    <p class="big1 c">募集は終了〜〜〜

    を、
    <p class="clear"><a href="?act=bukken&id〜〜〜
    <p class="big1 c clear">募集は終了〜〜〜

    にして回避しましょう。
  6. 端末が小さくなると、右寄せしたtextブロックが見辛くなるので、style.cssで再設定します。どこのブレイクポイントで再設定するかはお好みでどうぞ。
    以下をコピペして使って下さい。
  7. 以下のように変更できれば完成です。

マニュアルページに戻る