Events Manager(イベント一覧②)

イベント一覧の忘備録
こんな感じのイベント一覧
1

[events_list scope=”past” limit=10 ]
  <p class="eventh4"><a href="#_EVENTURL"> #_EVENTNAME</a></p>
<div class="list-box">
    <div class="list-img">{has_image}#_EVENTIMAGE{/has_image}
            {no_image}<img class="noimage" src="/img/results-no.png" alt="画像はありません" />{/no_image}</div>
    <div class="list-text">
    <p class="list-cat">
{is_future}近日開催{/is_future}
{is_current}開催中{/is_current}
{fully_booked}満員{/fully_booked}
{is_past}終了{/is_past}
</p>
                <p>日時 : #_{Y年n月j日(D)}#@_{-n月j日(D)} #_EVENTTIMES</p>
                <p>場所 : #_LOCATIONNAME
                <p>料金 : {is_free}無料{/is_free}{not_free}#_EVENTPRICERANGEALL{/not_free}</p>          
<a href="#_EVENTURL">詳しく見る</a>
    </div>

</div>
 [/events_list]

cssはこちら

.list-box {
  border-bottom: 1px solid #8d553b;
  display: table;
  width: 100%;
margin: 0px;
}
.list-box p{margin:7px;}
.list-img,
.list-text {
  display: table-cell;
  vertical-align: middle;
float: left;
 line-height: 110%;
}
.list-img img {
  width: 180px;
  margin: 5px;
}
.list-cat {
  background-color: #9F6D2D;
  border-radius: 10px;
  color: #fff;
  font-size: 14px;
  padding: 0 5px;
margin-bottm:2px;
width:80px;
text-align: center;

}
.list-date {
  color: #aaa;
  font-size: 10px;
  margin-left: 10px;
}
.list-text h2 {
  color: #000;
  font-size: 14px;
  line-height: 1.4;
  margin-right: 10px;
}
.eventh4{margin: 0px;font-size: 1.5em;}
.list-box br {
    display: none;
  }
  • このエントリーをはてなブックマークに追加
  • Pocket

この記事へのコメントはこちら

メールアドレスは公開されませんのでご安心ください。
また、* が付いている欄は必須項目となりますので、必ずご記入をお願いします。

内容に問題なければ、下記の「コメント送信」ボタンを押してください。

CAPTCHA