BizVektor カスタマイズこのサイトでは
WordPressの無料テーマBizVektorを
自分でカスタマイズして使用しています。

カスタマイズした内容をメモしておきます。

とても技術寄りの話です。

業務改革・業務効率化とか、経営コンサルティングとは関係ない?

実は、
インターネットを活用した集客と関係あったりします。

functions.php

getHeadDescription()

トップページのmeta descriptionの内容を変更

if (is_home() || is_page('home') || is_front_page()) {
  $metadescription = get_bloginfo( 'description' );
if (is_home() || is_page('home') || is_front_page()) {
  $metadescription = '業務が捗る仕組みを創るコンサルタント“となりィ経営システム”が、業務改革・業務効率化に成功する進め方、今までに実践してきた事例に基いた手法をお伝えしています。';

ざっくりいうと、meta descriptionは、Googleなどの検索結果に表示される説明です。
(最近は違うようですが。。)

get_bloginfo( ‘description’ )だと、
全てのページの一番上に表示されている「業務が捗る仕組みを創るコンサルタント」になってしまいます。

この説明では、検索結果に表示されてもクリックしてもらえません。
もう少し詳しい説明を表示したい。

しかし、ページの一番上に長い文章は表示しない方が良い。
特にスマホで見ると、長い文章は数行になってしまって、よろしくない。

というわけで、
ページ上部は「業務が捗る仕組みを創るコンサルタント」のままにして、検索結果の説明だけ変更するために、このカスタマイズをしました。

header.php

ここはfunctionではない

固定ページ以外のpageTitBnrをカット

<div id="pageTitBnr">
<div class="innerBox">
<div id="pageTitInner">
<?php get_template_part('module_pageTit'); ?>
</div><!-- [ /#pageTitInner ] -->
</div>
</div><!-- [ /#pageTitBnr ] -->
投稿ページに「Blog」と表示される。

不要なので、カット。

panListをカット

<div id="panList">
<div id="panListInner" class="innerBox">
<?php get_template_part('module_panList'); ?>
</div>
</div>

このサイトでは、パンくずは不要なので、カット。

「MENU」h3をdivに変更

<h3 class="assistive-text"><span>MENU</span></h3>
<div class="assistive-text"><span>MENU</span></div>

「MENU」はh3である意味が無い。

更に、このh3は、h1より上に表示されてしまう。
(HTMLの文法的に間違っている。)

こういうのは、検索エンジンにとって理解しにくいので、
検索エンジン対策上、好ましくない。

inc/theme-options.php

getHeadTitle()

投稿ページ、カテゴリーページのtitleの内容を変更

投稿ページ(カテゴリー有)
get_the_title()." | ".$category[0]->cat_name." | ".get_bloginfo('name')
題名 | カテゴリー名 | サイト名
get_the_title()
題名
投稿ページ(カテゴリー無)
get_the_title()." | ".get_bloginfo('name')
題名 | サイト名
get_the_title()
題名
カテゴリーページ
single_cat_title('',false)." | ".get_bloginfo('name')
カテゴリー名 | サイト名
single_cat_title('',false)
カテゴリー名

titleは、一般的なホームページでは、
ページの題名 | カテゴリー名 | サイトの名前
という形式が良い、と言われています。

しかし、ブログでは、投稿ページの題名だけで、クリックされ易いようにするのがベスト。

後ろのカテゴリー名、サイトの名前は不要。あると検索エンジン対策上、不利なケースもあります。

biz_vektor_ogp()

トップページのmeta og:descriptionの内容を変更

get_bloginfo('description')
業務が捗る仕組みを創るコンサルタント“となりィ経営システム”が、業務改革・業務効率化に成功する進め方、今までに実践してきた事例に基いた手法をお伝えしています。

meta og:descriptionは、ざっくりいうとfacebookに紹介される際のページの説明

get_bloginfo(‘description’)だと、全てのページの一番上に表示されている「業務が捗る仕組みを創るコンサルタント」

これでは、クリックしてもらえません。
(以下、トップページのmeta descriptionと同文。)

投稿ページのmeta og:titleの内容を変更

get_the_title().' | '.get_bloginfo('name')
投稿ページの題名 | サイト名
get_the_title()
投稿ページの題名

meta og:titleは、ざっくりいうと投稿がfacebookに紹介される際のページの題名
(投稿ページのtitleと同じ理由で変更。)

カテゴリーページのmeta og:urlが間違っている

カテゴリーページのurlではなく、カテゴリー内の投稿ページのurlが出力される。
これでは、facebookでクリックされたら、他のページが表示されてしまいます。

多分、BizVektorのバグ。

  if (is_home() || is_front_page()) {
    $linkUrl = home_url();
  } else if (is_single() || is_page()) {
    $linkUrl = get_permalink();
  } else {
    $linkUrl = get_permalink();
  }
  if (is_home() || is_front_page()) {
    $linkUrl = home_url();
  } else if (is_single() || is_page()) {
    $linkUrl = get_permalink();
  } else if (is_category()) {
    $category = get_the_category();
    if (!empty($category)) {
      $category_name = $category[0]->cat_name;
      $category_id = get_cat_ID($category_name);
      $linkUrl = get_category_link( $category_id );
      $category_description = $category[0]->category_description;
    }
  } else {
    $linkUrl = get_permalink();
  }

カテゴリーページのmeta og:title、og:description


    if (is_category()) {
      if ($category_name) {
        $bizVektorOGP .= '<meta property="og:title" content="'.$category_name.'" />'."n";
      }
      if ($category_description) {
        $bizVektorOGP .= '<meta property="og:description" content="'.$category_description.'" />'."n";
      }
    }

併せて、og:title、og:descriptionも出力するように変更

「BizVektorのOGPタグを出力する」が利かない

if ( isset($options['ogpTagDisplay']) == 'ogp_off' ) {
  $bizVektorOGP = '';
}
if ( isset($options['ogpTagDisplay']) ) {
  if ( $options['ogpTagDisplay'] == 'ogp_off' ) {
    $bizVektorOGP = '';
  }
}

biz_vektor_snsBnrs()

facebookプロフィール用バナーを変更

<a href="<?php echo htmlspecialchars($facebook); ?>" target="_blank">
<img src="<?php echo get_template_directory_uri(); ?>/images/bnr_facebook.png" alt="facebook" />
</a>
facebook←この画像が表示される
<a href="https://www.facebook.com/hiro.tonary" target="_TOP" title="Hiroki  Yamagishi">
<img src="https://badge.facebook.com/badge/100005738291221.119.1136203932.png" style="border: 0px;" />
</a>
←この画像に変更

front_page.php

ここはfunctionではない

トップページ下部に表示される投稿一覧の見出し

  <h2><?php echo esc_html(bizVektorOptions('postLabelName')); ?></h2>
標準では「Blog」。こんなのh2にする意味ない。

表示したくないので、カット

module_loop_post2.php

ここはfunctionではない

トップページやカテゴリーページでの投稿一覧の題名のhタグ

  <h4 class="entryTitle">
  <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
  <?php if ( is_user_logged_in() == TRUE ) : edit_post_link(__('Edit', 'biz-vektor'), '<span class="edit-link edit-item">[ ', ' ]</span>');endif ?>
  </h4>
h1の下に、h2、h3がなくて、h4が投稿の題名。
  <h2 class="entryTitle">
  <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
  <?php if ( is_user_logged_in() == TRUE ) : edit_post_link(__('Edit', 'biz-vektor'), '<span class="edit-link edit-item">[ ', ' ]</span>');endif ?>
  </h2>
投稿の題名をh2に昇格

HTML文法(検索エンジン)対策。

comments.php

(facebookコメントのみ使用したいので、)
ブログのコメントは使わない。
全てコメントアウト

子テーマ style.css

@charset "utf-8";
/*
Theme Name: ★BizVektor子テーマサンプル★
Theme URI: http://bizvektor.com
Template: biz-vektor
Description: 
Tags: 
Version: 0.1.0
*/

body {font-family:"ヒラギノ角ゴ Pro W4","Hiragino Kaku Gothic Pro",'メイリオ',"Osaka","MS Pゴシック","MS PGothic","sans-serif";}
#headerTop {padding-top:0;padding-bottom:0;}
#headerTop #site-description {padding:2px 22px 0 22px;font-size:14px;color:#DDF;background-color:#006;}
#header {padding-top:0;padding-bottom:0;}
#header #site-title {padding-bottom:0;}
#header #site-title a img {max-height:180px;margin-top:0;}

#gMenuInner {border-top:1px solid #339;border-bottom:2px solid #339;background-color:#f9f9ff;}
#topBlog h2 {border-top:2px solid #339;border-bottom:1px solid #CCF;}

#sideTower .localHead	{border-top:2px solid #339;border-bottom:1px solid #CCF;}

#footMenu .innerBox {border-bottom:1px solid #CCF;}

#content ul li,ol li,#content p {font-size:16px;color:#333;letter-spacing:1px;}
#content .entry-content p {font-size:16px;color:#333;letter-spacing:1px;}

.page #content .infoList	{border:none;}
#content .infoList .rssBtn	{margin-top:-8px;margin-bottom:8px;border:none;}
#content .infoList .infoListBox {border:none;padding-top:0;}
#content .infoList .infoListBox div.thumbImage {top:0;}
#content .infoList ul li {border-bottom:1px solid #CCF;}
#content div.pre_title {margin-top:16px;margin-bottom:0;}

h1#pageTit,
#content h1.contentTitle,
#content h1.entryPostTitle {border-top:none;font-size:140%;color:#006;}
#content h2 {border-top:1px solid gray;font-size:130%;margin-bottom:12px;color:#006;}
#content a.button {
	color:#006;
	border:3px outset silver;
	padding:6px;
	line-height:140%;
	font-size:96%;
	margin:0;
	text-align:center;
	text-decoration: none;
	background-color:#f9f9ff;
	margin-bottom:16px;
}
#content a.button:hover,
#content a.button:active {
	color:#C00;
}
#content a#bt.button {
	width:316px;
	float:left;
}
#content a#it.button {
	width:270px;
	float:right;
}
#content h2.entryTitle {font-size:120%;}
#content h2 a {color:#006;}
#content h2 a:hover,
#content h2 a:active {color:#C00;}
#content h3 {border-left:none;border-bottom:1px dotted lavender;margin:0 0 8px 0;padding-left:8px;font-size:110%;color:midnightblue;}
#content h4 {display:inline-block;border-bottom:1px solid lavender;margin:0 0 8px 0;padding-left:8px;font-size:100%;color:midnightblue;}
#content pre {margin-top:0;margin-bottom:0;padding:4px;border:1px solid #CCC;background-color:#EEE;overflow:auto;
}
#content hr {border:0;height:1px;width:60%;
	background-image:-webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image:-moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image:-ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image:-o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
}
#content hr.clear {clear:both;background-image:none;}

子テーマ style_oldie.css

@charset "utf-8";
#header #site-title a img {height:180px;}

h2 {border-top:1px solid gray;font-size:9pt;}

#content hr {
  border: 1px solid silver;
  width: 60%;
}