月: 2014年8月

Macbook とimac hoster filezlla 同期

必要
Dropbox
シンボリックリンクメーカーソフト　シンボリックリンカー.サービス　
隠しファイル表示ソフト　ティンカーツール　ファンター等

ホスターの設定フォルダはアプリケーションサポート　ホスターにある
ファイルジラの設定フォルダは　ユーザーネーム直後に隠しである

両者シンボリックリンク作る　そいつを両者　ドロップボックスフォルダに入れる。
自分はサーバーデータ前にアプリケーションサポートフォルダ作っていれた。

OK!

記事一覧の並び替え

参考

http://blog.anekipedia.com/cus/%E8%A8%98%E4%BA%8B%E4%B8%80%E8%A6%A7%E3%82%92%E3%82%BD%E3%83%BC%E3%83%88%EF%BC%88%E4%B8%A6%E3%81%B3%E6%9B%BF%E3%81%88%EF%BC%89%E3%81%99%E3%82%8B.html

http://ateitexe.com/wordpress-archive-sort-popular/

http://takahashifumiki.com/web/programing/1829/

カスタムフィールドのキーを出力できて　リンク先を指定できるプラグイン

Custom Field List

ウィジェッットで使用

きーを選んで通常だと
そのキーの記事が出てくるが
リンクの設定をすると
その先を全て指定できる

デフォルトはなにもはいってない
えらーになるので
指定して保存

S=naninanai と検索なので
サーチエブリシング

もしくは
?s=春日井市&post_type=jirei

なども
&order=ASC
など自分でコード書く

絞り込み　プラグイン

WP Query Search Filter

<?php echo do_shortcode( '[ULWPQSF id=580]' ); ?>

かなりいいんだけど
ページ移管する際
選択項目がすべてリセットされるのが×
正、同じページにて検索結果を表示できる機能があり
その場合は検索項目はのこる。

http://www.hp-shop.co.jp/knowledge/484/
ここにカスタムかいたるが
バージョンアップしてコード違うからわかわん

WP Custom Fields Search


<div class="test_childs">
<?php if(function_exists('wp_custom_fields_search')) 
	wp_custom_fields_search(); ?>

</div>

こいつはタクソノミーが選べない　もしくは　プラグインの　コードのカテゴリーをタクソノミー名に変えて
１つしかできない

アドバンスサーチAdvance WP Query Search Filter

こいつは上記２つの問題点をクリアしている

<?php echo do_shortcode( '[awsqf-form id=582]' ); ?>

使いがってはほぼ
WP Query Search Filterと同じ

クッキーが残る
検索結果のソートも指定か　１個だけ

こいつの短所は
タクソノミーやカテゴリーがオーダー並び替えできない
困る
作る時の順のIDのままか

あと投稿でkeyが未入力のの場合　指定無しなのに　検索されない。
カスタムフィールドの絞り込みを作ると
そのキーの入力がない記事は表示されないっぽい。
全部ニュ力するのがぜんていか？

検索結果にカスタム投稿も含ませる

/ 検索結果から固定ページを除外
function search_filter($query) {
  if (!$query -> is_admin && $query -> is_search) {
    $query -> set('post_type', array('post','asobu','share','seikatsu','iryou','manabu','koukyou','ofuroyado'));
  }
  return $query;
}
add_filter('pre_get_posts', 'search_filter');

function filter_search($query) {
    if ($query->is_search) {
	$query->set('post_type', array('post', 'hogehoge'));
    };
    return $query;
};
add_filter('pre_get_posts', 'filter_search');

こんなコードあったが必要なのかどうか今はいらない？

カスタムポストUIに
検索結果から除外する　ture false があったが
かわったのか？？？
未深検証

検索結果　調整　WP Custom Fields Search

まず問題だったこと
それは
古いコードがファンクションに書いてあったため複雑になった。

/ 検索結果から固定ページを除外
function search_filter($query) {
  if (!$query -> is_admin && $query -> is_search) {
    $query -> set('post_type', array('post','asobu','share','seikatsu','iryou','manabu','koukyou','ofuroyado'));
  }
  return $query;
}
add_filter('pre_get_posts', 'search_filter');

つまりポストタイプを指定して固定ページを除外してた　多分

これをまず消す。

これで多分ポストタイプ関係無しに検索できるはず

サーチエブリシングを入れる。

これでカスタムフィールドの文字も検索できるはず。

ただし絞り込みプラグインで
ポストタイプを指定する時
and or が指定できない気がする。

サーチページで分岐できれば必要ないが。。

ポストタイプを指定する方法。

–引用—-
●　フィールド１つ目の設定内容
このフィールドでやっている事。
・検索は、カスタム投稿「post-typea」の中から行うようにする
—–
データタイプ：「Post Type」を指定
—–
ウィジェット：「非表示の定数」を指定
Post Typeは、ユーザーが指定するものではないので、このフィールドは表示されません。
比較：同等
—–
ウィジェットの設定：post-typea
—–

●　フィールド２つ目の設定内容
このフィールドでやっている事。
・検索条件は、カスタムフィールドの登録値をプルダウンで表示するようにする。
—–
データタイプ：「カスタムフィールド」を指定
—–
ウィジェット：「ドロップダウン」を指定
指定のカスタムフィールドに登録されている値がドロップダウンとなって表示する
—–
比較：同等
—–

カスタムフィールドテンプレート　管理画面　デザイン

設定の
オプション
テンプレートフォーマットを選択

[cft] and [cftsearch] Shortcode Format
に
そのフォーマーットのコードを入れる

保育園テストコード

<div class="cft_admin_title">預かり年齢</div>
<div class="cft_admin_con">[child_old]</div>

<div class="cft_admin_title">エリア選択（絞込検索用）</div>
<div class="cft_admin_con">[eria_city]</div>

<div class="cft_admin_title">住所（※愛知県から番地まで＝マップ表示のため）</div>
<div class="cft_admin_con">[adress]</div>
<div class="cft_admin_title" style="margin-top:0px;">建物名（あれば）</div>
<div class="cft_admin_con">[adress2]</div>



<div style="float:left;">
<div class="cft_admin_title">平日保育開始時間</div>
<div class="cft_admin_con">[open_time][open_min]</div>
</div>
<div style="float:left;">
<div class="cft_admin_title">平日保育終了時間</div>
<div class="cft_admin_con">[close_time][close_min]</div>

</div style="float:left;">

<div style="clear:both"></div>

<div style="float:left;">

<div class="cft_admin_title">土曜保育開始時間</div>
<div class="cft_admin_con">[open_time_sat][open_min_sat]</div>
</div>
<div style="float:left;">
<div class="cft_admin_title">平日保育終了時間</div>
<div class="cft_admin_con">[close_time_sat][close_min_sat]</div>

</div style="float:left;">

<div style="clear:both"></div>

カスタムアドミン

.cft_admin_title{
	margin-top: 20px;
}
.cft_admin_con{ padding:10px;}
.cft_admin_con input[type="text"]{ width:100%; max-width:500px;}
.cft_admin_disp{}

管理画面の文字置き換え

http://ja.forums.wordpress.org/topic/10592

add_filter('gettext', 'change_post_to_article');
add_filter('gettext_with_context', 'change_post_to_article');
add_filter('ngettext', 'change_post_to_article');
add_filter('ngettext_with_context', 'change_post_to_article');

function change_post_to_article($translated) {
    $translated = str_ireplace(
        'ダッシュボード',
        'スペシャルダッシュボード',
        $translated
    );
    return $translated;
}

投稿数を制限する（カスタムポストタイプ対応）

function posts_limit() {
	global $userdata, $post_type, $wpdb;
	if ( $post_type === 'ポストタイプ' ) {
		$item_count = $wpdb->get_var( "SELECT count(*) FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'ポストタイプ' AND post_author = $userdata->ID" );
		if ( $item_count >= '制限数' ) { wp_die( "エラーメッセージ" ); }
	}
	return;
}
add_action('admin_head-post-new.php', 'posts_limit');

functions.php　未検証

フォーム　セレクト　css プチまとめ

デフォルトのドロップダウンで結構な場合必要ない。

フォントサイズを変えたりブラウザの初期設定を変える場合
セレクトの
バックグラウンドや
ボーダーなどを変えるとスタイルが効く
CSS3のappearance　noneと同じ？

問題はfirefoxの矢印がすごくださいやつになってしまうこと

この問題を解消するだけの為に
customSelect.jsを使う

<!--セレクトデザイン-->
<script src='/js/jquery.customSelect.js'></script>
 <script>
$(document).ready(function(){
	$('.searchform-input-wrapper select').customSelect();

});
</script>
/*ドロップダウンPC*//*＋クラス　カスタムセレクトjs用*/

.searchform-param select/*,.customSelect*/{
	border: 1px solid #ccc;
	padding: 5px;
	font-size: 13px;
	background: #fff;
	background-image: -webkit-linear-gradient(top, #ffffff 0%, #dfe0d9 100%);
	background-image: -moz-linear-gradient(top, #ffffff 0%, #dfe0d9 100%);
	background-image: linear-gradient(top, #ffffff 0%, #dfe0d9 100%);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;



 /* Webkit 
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#eee),
        to(#fff)
        );
     
/* Firefox 
    background: -moz-linear-gradient(
        top,
        #eee,
        #fff
        );
     
/* IE 
    filter:progid:DXImageTransform.Microsoft.gradient
        (startColorstr=#ffeeeeee,endColorstr=#ffffffff);
    zoom: 1;
}

*/



}

/*カスタムセレクトjs用
.searchform-input-wrapper{
	position: relative;
}

.customSelect:after{
	display: block;
	position: absolute;
	top: 5px;
	right: 10px;
	content: "▼";
	font-size: 12px;
	color: #999
	}

*/

コメントアウトした部分で

ドロップダウン矢印はアフターで実行

正
ドロップダウンのセレクトに
レラティブをかけると
ドロップダウンできないから
その外にレラティブして
アフターをアブソリュートする。

チェックボックスcss ＆　:after説明

input[type="checkbox"] {
    border: 1px solid #aaaaaa;
    vertical-align: -8px;
    -webkit-appearance: none;
    position: relative;
    margin-right: 5px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-sizing: border-box;
    width: 26px;
    height: 26px;
    /*Other Browser*/
    background: #e2e2e2;
    /*For Old WebKit*/
    background: -webkit-gradient(
        linear, left top, left bottom,
        color-stop(0.00, #ffffff),
        color-stop(1.00, #e2e2e2)
    );
    /*For Modern Browser*/
    background: linear-gradient(
        to bottom,
        #ffffff 0%,
        #e2e2e2 100%
    );
}

input[type="checkbox"]:checked {
    /*Other Browser*/
    background: #99cc00;
    /*For Old WebKit*/
    background: -webkit-gradient(
        linear, left top, left bottom,
        color-stop(0.00, #99cc00),
        color-stop(1.00, #87b400)
    );
    /*For Modern Browser*/
    background: linear-gradient(
        to bottom,
        #99cc00 0%,
        #87b400 100%
    );
    border: 1px solid #336600;
}

input[type="checkbox"]:checked:before {
    position: absolute;
    left: 1px;
    top: 16px;
    display: block;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .5);
    content: "";
    width: 10px;
    height: 4px;
    background: #ffffff;
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin: right center;
}

input[type="checkbox"]:checked:after {
    display: block;
    position: absolute;
    left: 9px;
    top: 16px;
    content: "";
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .5);
    width: 16px;
    height: 4px;
    background: #ffffff;
    -webkit-transform: rotate(-53deg);
    -webkit-transform-origin: left center;
}
li {
  list-style: none;
}
li.sample1:before {
  content: "※";
  color: red;
}
li.sample2:after {
  content: "NEW";
  color: red;
  font-size: 80%;
  padding: 2px 5px;
  margin-left: 5px;
  border: solid 1px #ff0000;
}
<ul>
  <li>サンプル1</li>
  <li class="sample1">サンプル2</li>
  <li class="sample2">サンプル3</li>
</ul>

リスト１
※リスト２
リスト３new

contentプロパティが空の場合でも必ず記述して下さい。
contentプロパティは必要条件で、記述がないと動作しないので注意が必要です。

http://www.hp-stylelink.com/news/2013/11/20131113.php
参考

ie8に対する見解

オフィシャルがスクロールjsできなかった。ie8対応と書いてあるから
ワードプレス関連の相性か？不明

対応策
ie８以下のみに読み込ますもの
それ以外に読み込ます物をわける

ie８以下のみに読み込ますもの

<!--[if lt IE 9]> 
<script src="/js/html5shiv-printshiv.min.js"></script>
<script type="text/javascript" src="/js/selectivizr.js"></script>
<script>
//スムーズスクロール
jQuery(function(){
   // #で始まるアンカーをクリックした場合に処理
   jQuery('a[href^=#]').click(function() {
	  // スクロールの速度
	  var speed = 400; // ミリ秒
	  // アンカーの値取得
	  var href= jQuery(this).attr("href");
	  // 移動先を取得
	  var target = jQuery(href == "#" || href == "" ? 'html' : href);
	  // 移動先を数値で取得
	  var position = target.offset().top;
	  // スムーススクロール
	  jQuery('body,html').animate({scrollTop:position}, speed, 'swing');
	  return false;
   });
});
</script>
<style type="text/css">
#go1,#go2,#go3,#go4,#go5,#go6,#go7{
	margin-top: -160px;
	padding-top: 160px;
}
</style>
<![endif]-->

それ以外

<!--[if (gte IE 9)|!(IE)]><!-->
<script type="text/javascript" src="/js/jquery.multirollover.js"></script>

<script>
	$(document).ready(function() {
		$('#head_rogo a').multirollover({
			crossfade	: true,
			suffix		: '_on',
			duration	: 300,

		});
	});
</script>

<script type="text/javascript" src="/js/jquery.page-scroller-309.js"></script>
<!--<![endif]-->

今回は8以下は
スクロールを

<script>
//スムーズスクロール
jQuery(function(){
   // #で始まるアンカーをクリックした場合に処理
   jQuery('a[href^=#]').click(function() {
	  // スクロールの速度
	  var speed = 400; // ミリ秒
	  // アンカーの値取得
	  var href= jQuery(this).attr("href");
	  // 移動先を取得
	  var target = jQuery(href == "#" || href == "" ? 'html' : href);
	  // 移動先を数値で取得
	  var position = target.offset().top;
	  // スムーススクロール
	  jQuery('body,html').animate({scrollTop:position}, speed, 'swing');
	  return false;
   });
});
</script>

で対応し
アンカーをあえて空DIVを入れて
パディングとマイナスマージンで対応

こういう調整は空DIVの有用性ってあるねって思ったし！

結局ie8のセレクタは使用できなかった。

<script src="/js/html5shiv-printshiv.min.js"></script>
<script type="text/javascript" src="/js/selectivizr.js"></script>

こいつをいれる

しかし
デザイン的なcssのずれなどは治った。

どうしても何番目かを指定したい場合は
http://tasudesign.com/web-desing/nth-child/
http://www.gravity-works.jp/gravica/web/003862.html
これで対応してみよう。

:nth-of-type cssセレクタ　おさらい

:nth-of-typeの使い方

.blog_box_all

section

div

.class titel

a

テキスト

/a
/div
/section
/div

のループだとすれば

2番目タイトルのカラーを変えたい場合

.blog_box_all section:nth-of-type(2) .blog_titel a {

		color: #F90!important;

}

こうすっべ

偶数を変えたい場合

.blog_box_all section:nth-of-type(2n) .blog_titel a {

		color: #F90!important;

}

奇数

.blog_box_all section:nth-of-type(2n+1) .blog_titel a {

		color: #F90!important;

}

(n)　･･･　n番目の要素に適用

(odd)　･･･　奇数番目の要素に適用
(2n+1)　･･･　奇数番目の要素に適用

(even)　･･･　偶数番目の要素に適用
(2n)　･･･　偶数番目の要素に適用

(3n)　･･･　3,6,9,12…番目の要素に適用
(3n+1)　･･･　1からはじめて＋3ずつの番の要素,4,7,10…番目の要素に適用

自動ペナルティで検索圏外にぶっ飛んだサイトが回復してきました！【Googleペナルティを解除する方法】

http://afi-vison.com/%E8%87%AA%E5%8B%95%E3%83%9A%E3%83%8A%E3%83%AB%E3%83%86%E3%82%A3%E3%81%A7%E6%A4%9C%E7%B4%A2%E5%9C%8F%E5%A4%96%E3%81%AB%E3%81%B6%E3%81%A3%E9%A3%9B%E3%82%93%E3%81%A0%E3%82%B5%E3%82%A4%E3%83%88%E3%81%8C-1276.html

とはいえ、明らかにペナルティを受けた変動だったので問題箇所を改善できればまた戻ってくると思い、色々と試行錯誤をしてみました。

2014年４月収入報告でも書きましたが以下が考えられました。

strongタグの多様
薄い記事（500文字前後）の放置
構造化エラー
不自然な被リンク
画像にアフィエイトリンク
内部リンクの不足
１．strongタグの多様について
WordPressは「Ctrl+B」で太字になりますが、これは強調を意味しており、乱用するとスパム扱いされる可能性があります。マナさんの「strongタグとリンクの使い方を最適化し、SIRIUSシリウスSEO力アップ」の記事で解説されています。太字を使いたい時は「b」タグかCSSでを使ったほうがいいようです。strongだらけだったので100記事あるブログをひたすら修正しました。しかし、回復はしてきませんでした。

２．薄い記事の放置
外注さんとは800文字前後で記事を書いてもらっていましたが、最低でも500文字はほしいと言っていたところ、ある納品のときほとんどが500文字ちょっと超えたくらいの記事が20記事ほど上がってきていました。

「次からは800文字以上でお願いします。」ということで了承してもらったのですが、この500文字の記事もまあいいかという気持ちで全てアップさせていました。この記事自体検索ではあまりヒットせず、アクセスもなかったのでサイトの価値を下げていたのかもしれません。これが原因かなと思い、500文字の記事は削除し、1000文字以上の記事を入れるようにしましたが・・・回復はしませんでした。

ちなみにブログの文字数は1200文字以上はほしいところです。詳しくは「Google AdSenseで稼ぐコツ・方法２　ブログ記事の文字数は何文字以上にすべきか」を参考にしてください。

３．構造化エラー
ウェブマスターツールに登録すると構造化エラーが出ていました。「WordPressユーザー要注意！〜構造化データのエラーでアクセス激減？」の記事を参照ください。

よくわからないのですが、どうも使っているテーマ「stinger」ではよく発生するエラーのようです。このエラーは上記サイトを参考に修正しました。現在も発生していますが、徐々に減少していっています。ですが、これもペナルティの原因ではないようです。

４．不自然な被リンク
通常不自然なリンクでペナルティを受ける場合はウェブマスターツールで警告が来るようです。私のブログは警告が来ていなかったので関係はないと思います。実際、このサイトからリンクを送っていたのと、無料ブログから数本送っていただけでしたので問題ないと思います。ですが、念のため無料ブログからのリンクは削除し、このサイトからも「no follow」を付けました。

５．画像にアフィリエイトリンク
よくアクセスのある記事は歯に関する記事でしたのでここに電動歯ブラシや歯磨き粉のアフィリエイトリンクを張りました。見栄えをよくするためにASPで用意されているバナーではなく、実際の画像をコピーしてきてそこにアフィリエイトリンクを張りました。（リンクを改ざんする行為で場合によってはASPからペナルティを受けるので今後は控えますが）これがちょっと広告感出しすぎだったかなと思い、画像リンクを削除しました。ですが、効果はありませんでした。

６．内部リンクの不足
とにかく直帰率の多いブログでした。というのも1記事1テーマ完結の記事内容が多かったため他の記事を見る必要がなかったようです。「SEOの内部対策の教科書 |SEO初心者がまずすべき内部対策とは」でも紹介していますが、記事に内部リンクを増やすことがSEOにとって有効のようです。直帰率を下げることになりますし、ユーザーにとても有益です。

内部対策SEOを勉強したい方はこの本がおすすめです。内部リンクがなかったからといってペナルティにはなりませんが、今後も改善させていきたいと思います。

とまあ、以上を試してみましたが、いっこうアクセスが回復することはありませんでした。1ヶ月程度で回復するかと思っていましたが、甘かったですね。ほぼ諦めて次のサイトの作成に時間を充てることにしました。ですが、時々気になって何かしら修正したりしていました。そんなある日、ウェブマスターツールで「重複データ」のエラーが多く出ていることに気づきました。

重複データ

何故こんなに重複していたのかといいますと、パーマリンクの変更が原因だと思います。外観テーマ「stinger」を使う前に別のテーマを使っており、投稿の日本語タイトルをURLにしていました。しかし「stinger」では日本語のURLを受け付けず自動で数字に変換してしまうため記事のURLが変わってしまっていたようです。Googleでは変更前の日本語のURLがキャッシュされており、変更後の英数字のURLが重複データであると認識し、エラーになっていたようです。

重複データもアクセスにはほぼ影響がないという話でしたが、治せるものは治そうと思い、修正しました。具体的にはリダイレクションをして、変更前の日本語URLから変更後の英数字URLへ飛ばすようにしました。WordPressのリダイレクションのプラグインでは「Redirection」が有名ですが、なぜか私のサーバーではうまく機能せず、諦めかけていたのですが、「Simple 301 Redirects」というプラグインがあり、試してみるとうまくいきました。

手動で100記事をコツコツ直し、経過を待ちました。

すぐには反映されなかったのですが、ある日ウェブマスターツールをのぞいてみると重複データがなくなっており、「おお！遂に改善された」と思いました。数日後、アクセスを見てみると、少し回復。いつもはbingからしかアクセスがないのですがこの日はyahooやGoogleからもアクセスがありました。

そして遂に・・・・・・

ブログ回復

回復！！いや・・・ちょっとやけど！！

タイトルで検索してもちゃんと出てきますし、自分の中ではかなり回復したと思っています。4月から回復まで約3ヶ月かかりましたね。もとのアクセスに戻るまではもう少しかかりそうですが、記事を増やしたりなどして今後も大事に育てたいと思います。

そもそもなぜアクセスが増えていったのか

なかには役立つ記事ももちろんありましたが、500文字の記事等もあり、正直なぜアクセスが増えていったのかよくわかっていませんでした。

記事を量産したから増えたのか？そんな単純にアクセスが増えるのであれば誰も苦労しませんし、薄い大量の記事があふれているスパムサイトがもっと反映しているはずです。

実は自然な被リンクをもらえていたからだと思います。

SEOチェキのリンクチェックでは全く被リンクゼロだったのですが、ウェブマスターツールの「サイトへのリンク」を見ると、無料ブログ、内部リンクも含めて被リンクを見ることができます。

被リンク

見てみると、自分でやった無料ブログやはてぶの他にもリンクがされています。リンクを辿ってみると主に「まとめブログ」系（例えば脚ダイエット特集とか）からのリンクが張られていました。うれしいことですね。1記事1テーマなのでそのテーマをまとめているニッチなサイトには引っかかりやすい内容だったのかもしれません。1記事1テーマだとリンクをもらいやすいかもしれませんね。

被リンクをもらうとサイトの価値が上がり、アクセスは増えますが、一方で500文字程度の薄い記事もあるのでペナルティを受けたのかもしれません。でもその場合も警告メールが来ると思いますが。とはいえ、今後も被リンクをもらい、アクセスを増やしていきたいですね。

自動ペナルティを解除する方法　まとめ

タイミングとしては重複データを改善させたことによる回復でしたが、実際のところどれが原因であったかははっきりしていません。とにかくできることは何でもしてみるのが良いでしょう。

自動ペナルティを受けたら以下の項目をチェックしてみてください。

strongタグは多用していないか
薄い記事（500文字前後）は残っていないか
構造化エラーは起きていないか
不自然な被リンクはしていないか
画像にアフィエイトリンクはしていないか
内部リンクの不足はないか
重複データエラーは出ていないか
以上、アクセスがもとに戻るまで回復したらまた追記したいと思います。

では、少しでもお役に立てれば幸いです。