アクセス解析:Google Analyticator

googleのサーバ上でアクセスログの記録や解析をしてくれるGoogle Analytics。

色んな解析プラグインがあるけど、自サイトのサーバ上でアクセス解析をするものは、
負荷がかかるし、ログが増え続けたら困るのでgoogleさんのものを利用したい。

参照:<a href=”http://www.netyasun.com/master/google.analytics.html” target=”_blank”>Google Analytics アクセス解析</a>


すぐに入れよう:AkismetとMultibytePach

まず最初にいれるべきプラグイン ※標準搭載されている

  • Akismet(2.5.7):コメント投稿等のスパムからブログを守る APIキーを入手して設定を更新する
  • WP Multibyte Patch(1.6.4):日本語版WordPressで日本語の処理を修正・強化をする

一応、これもあったので入れておく。

  • Contact Form 7(3.3.2):お問い合わせフォーム用

YouTubeなどの映像を貼りつける:Viper’s Video Quicktags

  1. Viper’s Video Quicktagsダウンロード&有効化
  2. ページ作成画面に動画挿入のクイックタグボタンが追加されるので利用して作成
  3. 【管理画面】-【設定】-【Video Quicktags】で設定条件を変更できる・・・YouTubeの場合、プレイヤーのサイズ、枠の色、動画の再生方法など

WP Download Maneger:ファイルのダウンロード機能

参考文献:http://wp-school.info/plugin-downloadmanager

ダウンロードファイルごとにパスワードを設定することができる

ファイルごとにパスワードをかけずに、ダウンロードファイルを複数並べたページにパスワードをかけたい場合
1.DownloadManagerで作成したページを非表示にすると直接の閲覧できなくなるが参照ページからは閲覧ができる。
※DownloadManagerの保護設定があまいだけかも知れない
※公開したときにしかDMのアイコンが使えないので要注意
2.検索からもファイルを選ぶことはできない
3.downloadページからも非表示のファイルは表示されない

 

見た目が気になるのでカスタマイズをしたい。
CSSファイルをいじる前にフリーのプラグインがあるのでそちらを調査中


Webサイトにパスワードを設定する:Password Protected

Webサイト全体にパスワードを設定するプラグイン。

マルチサイトの場合は、各サイト毎に設定することができる。

  1. ネットワーク管理者のプラグイン新規追加で、【Password Protected】をダウンロード
  2. 各サイトの設定メニューに【Password Protected】が追加されているので、そこでパスワードの設定をする

【特徴】

  • 閲覧にパスワード制限をかけるだけなので、メールアドレスやアカウントが不要でお手軽。
  • ページやカテゴリーごとにアクセス制限をかけることはできない。

~ログイン画面のカスタマイズ~

【FILE】/wp-content/plugin/password-protected/theme/login.php
【画像ファイル】/wp-content/plugin/password-protected/theme/ei.jpg

※サイト別に変更を加えたいときは、各テーマのフォルダにこのファイルを入れる。

new version・・・テーマ別、ロゴの変更と文字の挿入


<center>
<img src="<?php bloginfo('template_url'); ?>/donut.png" width="150px" height="150px">
</center>

<?php /*
<h1><a href="<?php echo esc_url( apply_filters( 'password_protected_login_headerurl', home_url( '/' ) ) ); ?>" title="<?php echo esc_attr( apply_filters( 'password_protected_login_headertitle', get_bloginfo( 'name' ) ) ); ?>">
bloginfo( 'name' );?></a></h1> */ ?>
<h1><?php _e('Doraforma Japan'); ?></h1>
<?php do_action( 'password_protected_login_messages' ); ?>
<?php do_action( 'password_protected_before_login_form' ); ?>

old version・・・全体、画像の変更と文字の挿入


<form name="loginform" id="loginform" action="<?php echo esc_url( home_url( '/' ) ); ?>" method="post">

<p><center>
<?php _e('Sorry !!! <br>こどもの写真なのでパスワードかけてます。<BR>','yoshimi'); ?><br><br>
<img src="<?php echo esc_url( home_url( '/' ) ); ?>/wp-content/plugins/password-protected/theme/ei.jpg" width=130 height=130><br><br>
<label for="password_protected_pass"><?php _e( 'Password', 'password-protected' ) ?><br />
<input type="password" name="password_protected_pwd" id="password_protected_pass" class="input" value="" size="20" tabindex="20" /></label></center>
</p>

<!--
<p class="forgetmenot"><label for="rememberme"><input name="rememberme" type="checkbox" id="rememberme" value="forever" tabindex="90"<?php checked( ! empty( $_POST['rememberme'] ) ); ?> /> <?php esc_attr_e( 'Remember Me', 'password-protected' ); ?></label></p>
-->
<p class="submit">
<input type="submit" name="wp-submit" id="wp-submit" class="button button-primary button-large" value="<?php esc_attr_e( 'Log In', 'password-protected' ); ?>" tabindex="100" />
<input type="hidden" name="testcookie" value="1" />
<input type="hidden" name="password-protected" value="login" />
<input type="hidden" name="redirect_to" value="<?php echo esc_attr( $_REQUEST['redirect_to'] ); ?>" />
</p>
<p><center>
<?php _e('<br><br><br><br>知り合いの方にはパスワードお伝えしますので、<br>是非ご一報下さい。<br><br>そしてご覧下さい。<br><br>by YOSHIMI','yoshimi'); ?></center>

</form>


Subscribe2:メルマガ配信

インストールして有効化したら以下のメッセージが現れる
Subscribe2 cannot be activated as a network plugin. Please activate it on a site level
マルチサイトだったので各サイトでこのプラグインを有効化すればよい

日本語化する⇒Subscribe2 日本語化ファイルがダウンロードできるサイト
plugin-Subscribe2のフォルダにsubscribe2-ja.moをアップロードする

注意:メルマガ登録画面は管理者ログインの状態だと表示されないので、確認したいときはログアウトをする

参考文献:ファイルのダウンロード機能を追加「WordPress Download Manager」


contactform7をカスタマイズ

コード例

  

    • 送信後のメッセージをカスタマイズする
      自分のテーマ内のスタイルシートからCSSを上書きします。
      入力エラーのダイアログを赤に変更

      .wpcf7 span.wpcf7-not-valid-tip {
      display: block;
      position: static;
      top: 0;
      left: 0;
      border: none;
      color: red;
      }
      

      入力エラーのメッセージのデザインを変更

      .wpcf7 .wpcf7-response-output {
      margin: 10px 0 0;
      padding: 8px 35px 8px 14px;
      text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      }
      .wpcf7 .wpcf7-validation-errors {
      color: #B94A48;
      background-color: #F2DEDE;
      border: 1px solid #EED3D7;
      }
      .wpcf7 .wpcf7-mail-sent-ok {
      color: #3A87AD;
      background-color: #D9EDF7;
      border: 1px solid #BCE8F1;
      }
      

      参考文献:http://hijiriworld.com/web/wp-contactform7-customize/

 

  • PCだと出来るがモバイルだとこれができない
    1.送信ボタンを押してもサンクスページに飛ばず
    http://bizvektor.com/plugins/contactform7/
    Ktai-styleにwp_header();とwp_fotter();を入れる必要がある
    wp_head()でCSSとjQueryを、wp_footer()でフォームを制御するjsを読み込んでいる。
    http://snowadays.jp/2014/03/2660
    http://labs.karappo.net/kwdr/index.php?itemid=3042.確認メールを自動送信したいがスマホや携帯には送信できない
    【解決策】プラグインWP Mail SMTPをインストールする。
    contactform7はsendmailなのでプロバイダ側の迷惑メール機能に引っ掛かり送信エラーになる。
    smtpを利用すれば解決できる。Gメールのアカウントを利用して連携させた。
    ただし利用する際にはセキュリティの保護を無効にする必要あり。
    http://coneta.jp/2579.html
    3.テキストエリアの文字が化ける
    4.機種によって文字化け。ドコモはSJIS

 

コード例


<div class=item>
<span class="must">必須</span> お名前
[text* your-name] 
</div>
<div class=item>
<span class="must">必須</span> メールアドレス
[email* your-email]
</div>
<div class=item>
<span class="must">必須</span> お電話番号
[tel* your-tel /18]
</div>
<div class=item>
<span class="free">任意</span> 会社名
[text your-company] 
</div>
<div class=item>
<span class="free">任意</span> 部署名
[text your-section]
</div>
<div class=item>
<span class="free">任意</span> メッセージ本文
[textarea your-message]
</div>
<div class=item>
[submit "送信"]
</div>

メッセージ本文


差出人: [your-name] <&#91;your-email&#93;>
題名: ホームページからのお問い合わせ

差出人:[your-name]
メールアドレス:[your-email]
お電話番号:[your-tel]
会社名:[your-company]
部署名:[your-section]
お問い合わせ内容:[content]
メッセージ本文:
[your-message]


--
このメールは Scripintelligence Japan (http://www.scripintelligence.jp) のお問い合わせフォームから送信されました

スタイルシート

/***** コンタクトフォーム *****/
.item {
	margin: 30px 10px 50px 30px;
}

.must {
	color: #fff;
	padding: 6px 10px;
	background: #b83166;
	border-radius: 20px;
}

.free {
	color: #fff;
	padding: 6px 10px;
	background: #424242;
	border-radius: 20px;
}

.radio-area {
	width: 70%;
	margin-top: 15px;
	background: white;
	border: 1px solid silver;
}

form p {
	font-weight: 600;
}

input.wpcf7-form-control.wpcf7-text,
textarea.wpcf7-form-control.wpcf7-textarea {
	width: 70%;
	margin-top: 15px;
	border: 1px solid silver;
	border-radius: 3px;
}

textarea.wpcf7-form-control.wpcf7-textarea {
	height: 200px;
}

textarea.wpcf7-form-control.wpcf7-radio {
	height: 200px;
}

input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
	background: rgba(255,255,142,0.46);
}

input.wpcf7-submit {
	width: 70%;
	height: 80px;
	background: #b83166;
	color: #fff;
	font-size: 20px;
	font-weight: 600;
	margin-left: 20px;
}

input[type="submit"], input[type="reset"], input[type="button"], button {
	cursor: pointer;
}

/* エラーメッセージ */
span.wpcf7-not-valid-tip,
.wpcf7-response-output.wpcf7-validation-errors {
	color: red;
	font-weight: 600;
}

/* ここまで */