2014/1/26

ET Luv.Lab.に、WordPressのカスタムフィールドの入力値を活用して、wakkaへのバナーを作ってみる

立ち上げたはいいもののアクセスが全く伸びず広告に頼りきりになっているwakkaですが(思っていた以上にオーガニック検索が伸びない)、とりあえずやれることやっておこうと思って、出店いただいている方のET Luv.Lab.のページから、wakkaの各ページにリンクするバナーを作ってみました。

ここから:

marico – 「モノを作る、場を作る、時間を作る」 – ET Luv.Lab.

ここへ:

結ぶココロ – wakka

リンクします。

  <?php if(!is_page()): ?>
  <?php $wakka = get_post_meta($post->ID,'wakka',TRUE); ?>
  <?php $flickr = get_post_meta($post->ID,'flickr',TRUE); ?>
  <?php if(!empty($wakka)): ?>
  <a href="<?php echo $wakka; ?>" target="_blank">
    <div class="wakka">
      <span><img src="<?php echo $flickr; ?>_s.jpg" /></span>
      <span class="txt"><?php the_title(); ?></span>
      <div class="box"><img src="<?php bloginfo('template_url'); ?>/images/wakka.jpg" /></div>
    </div>
  </a>
  <?php endif; ?>

こんな感じで元々持っているFlickrの画像URLに加え、wakkaというカスタムフィールドにwakkaへのURLが入力されている場合に限りバナーを生成。バナーのベースになる画像は作っておいて、その上にプロフィール画像と名前を絶対配置してます。

.wakka {
  margin-bottom:40px;
  position:relative;
}
.wakka span img {
  position:absolute;
  left:242px;
  top:-10px;
  border:2px solid #fff;
  border-radius:37.5px;
}
.wakka span.txt {
  position:absolute;
  left:340px;
  top:20px;
  font-size:24pt;
  font-family:"Palatino Linotype", "Book Antiqua", Palatino,"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro",Meiryo,"メイリオ","MS P明朝","MS PMincho",serif;
  padding-bottom:5px;
  border-bottom:2px solid #333;
}
a .wakka  {
  color:#333;
}
a:hover .wakka  {
  opacity:0.8;
}
.wakka .box img {
  border-radius:10px;
}

これなんか定常的にアクセス作りたいけど、オーガニック検索伸びないとしんどいなあと思いつつ、試行錯誤のさなか。

ひとり仕事: フリーランスという働き方
(2012-10-5)
売り上げランキング: 14,705
100円
WordPressデザインレシピ集
狩野 祐東
技術評論社
売り上げランキング: 197,569
WordPress 高速化&スマート運用必携ガイド
こもりまさあき 岡本渉
エムディエヌコーポレーション
売り上げランキング: 435,263