GettingOUT » WordPress http://mori.moripower.jp ロングボーダー社長のブログ Tue, 07 Feb 2012 15:48:21 +0000 ja hourly 1 http://wordpress.org/?v=3.3.1 MoriP Star Rating プラグイン？ http://mori.moripower.jp/eqwip/wordpress/1561.html http://mori.moripower.jp/eqwip/wordpress/1561.html#comments Mon, 26 Dec 2011 16:14:46 +0000 admin http://mori.moripower.jp/?p=1561 コメントに☆でレーティング（評価）をつけるプラグインを探しまくったのですが、なかなか良いものが無く、結局プラグインを自作することになりました。

記事やページに、☆でレーティングを付けるものはあるんですが、コメントに付けるコレは！というプラグインは探しきれませんでした。

このブログでも使えるようにしろよ！って感じかもしれませんが、ゴリゴリ下記のサイト用に作っているので、汎用化されてません・・・。（それはプラグインと言わんだろう。）

ＧＣＳ学生ゲーム投稿サイト

正月中にプラグイン化できるか？

]]> http://mori.moripower.jp/eqwip/wordpress/1561.html/feed 0 WordPressをむりやり復旧 http://mori.moripower.jp/eqwip/wordpress/1532.html http://mori.moripower.jp/eqwip/wordpress/1532.html#comments Tue, 06 Dec 2011 15:41:38 +0000 admin http://mori.moripower.jp/?p=1532 自分のブログサイト（このブログ）で、いろいろ実験をしていたら、Wordpressのテーブル(options)を誤って削除してしまった。

サイトはもちろん、管理画面も表示できず。バックアップ取ってなかったので、真っ青・・・。

別のWordpressサイトから、optionsテーブルをそのまま持ってきてsiteurlをとりあえず直接修正したら管理画面が表示された。

サイトは表示されなかったので、何故？

と思いつつ・・・、管理画面を良く見たらテーマが変だったようで、テーマを管理画面から指定しなおしたら、このブログサイトも無事表示されました。

削除してしまったのがoptionsテーブルで幸いだった。これがpostsテーブルだったらアウトでした。（このサイト結構アクセスあるし）

これに懲りて、WP-DBManagerプラグインを導入しました。
どんな場合もバックアップは必要だね。やっぱり。

]]> http://mori.moripower.jp/eqwip/wordpress/1532.html/feed 0 WordPressの画像等の直リンクを禁止する http://mori.moripower.jp/eqwip/wordpress/1296.html http://mori.moripower.jp/eqwip/wordpress/1296.html#comments Wed, 22 Jun 2011 13:42:50 +0000 admin http://mori.moripower.jp/?p=1296 WordPressで、会員サイトを作る場合、まず必ずログインさせ必ず認証させる必要があります。このあたりは、WordPressに認証をつけるで方法を紹介しています。

しかし、この方法だとWordpressのアップデートをする度に、コードが上書きされてしまいログインしないでコンテンツが見られてしまうという「うっかりミス」が起こることがあります。一番よいのは、themeのテンプレートのヘッダーで、下記のコードを記述するのが良いのですが・・・・

if (is_user_logged_in()){
}
else {
auth_redirect();
};

この難点は、アップロードした画像やPDFファイルが直リンクで見られてしまうことです。ヘッダーでログインリダイレクトを記述するということは、theme以降でログイン制御が走ることになるので、themeフォルダに関連しないものはログインしないで見られてしまうようです。

そこで、themeからリンクされて見ること以外に直リンクで閲覧を禁止する必要が出てきます。具体的には、uploadsフォルダに「.htaccess」を置き、直リンクでの閲覧を禁止するようにします。

サーバによって記載の仕方は2通りあるようです。レンタルサーバにより異なります。

SetEnvIf Referer "^http://mori\.moripower\.jp" ShowOK
order deny,allow
deny from all
allow from env=ShowOK
RewriteEngine On
RewriteCond %{HTTP_REFERER} !^http://mori\.moripower\.jp[NC]
RewriteRule \.(jpg|png|gif|txt|pdf)$ - [F]

テスト
ちなみに、下記の画像はクリックで見れますが、ＵＲＬをブラウザに直接貼り付けては見ることができません。

URL：　http://mori.moripower.jp/wp-content/uploads/2011/06/mp20110622.jpg
ブラウザキャッシュをクリアしてから実験してね。

]]> http://mori.moripower.jp/eqwip/wordpress/1296.html/feed 1 WordPress プラグイン制作　その３ http://mori.moripower.jp/eqwip/wordpress/1253.html http://mori.moripower.jp/eqwip/wordpress/1253.html#comments Wed, 20 Apr 2011 11:04:35 +0000 admin http://mori.moripower.jp/?p=1253 (1) form内に、編集しpostするためのinputタグを作ります。

<form method="post" action="<?php echo str_replace('%7E', '~', $_SERVER['REQUEST_URI']); ?>">
    <ul>
        <li>行番号：<input disabled type="text" id="disp_id" size="3" />
                <input type="hidden" id="id" name="id" /></li>
        <li>氏名：<input type="text" id="name" name="name" /></li>
        <li>年令：<input type="text" id="age" name="age" size="3" /></li>
        <li>社員番号：<input type="text" id="employee_no" name="employee_no" /></li>
    </ul>
    <div>
        <input type="radio" id="edit" value="1" name="radio" />
        <Label for="edit">更新</Label>
           
        <input type="radio" id="add" value="2" name="radio" />
        <Label for="add">追加</Label>
           
        <input type="radio" id="delete" value="3" name="radio" />
        <Label for="delete">削除</Label>
           
        <input type="submit" name="submit" value="実行" />
        <input type="button" value="クリア" onclick="clear_field();" />
    </div>
</form>

・field_copy() javascirtで、form内のinputにそれぞれコピーし適宜変更します。
・ラジオボタンで、更新、追加、削除をつけて、テーブル操作を指定します。
・post先は、この関数自身です。
m20110420-2

(2) postで呼ばれた時の処理を作ります。

<?php
$data = array();
   
//POSTデータの設定
foreach($_POST as $key => $val) {
    if(strcmp($key,'submit') && strcmp($key,'radio')) {
        $data += empty($val) ? array() : array($key=>$val);
    }
}  
//実行ボタンを押した場合
if(!empty($data)) {
    〜実行ボタンを押してデータが渡されたときの処理〜
} ?>
<table>
    〜WordPress プラグイン制作　その２ (3)省略〜
</table>
<form>
    〜上記(1)省略〜
</form>

・postで渡されたデータ（$_POST）を配列にして $dataにまとめます。（submitとradioは除く）
・$dataがある場合は、渡されたデータによりテーブルを更新します。

(3) テーブルを更新します

//実行ボタンを押した場合
if(!empty($data)) {    
    switch($_POST['radio']) {
        case 1: //更新
            $wpdb->update($table, $data, array('id'=>$data['id']));
            $message = "更新しました。";
            break;
        case 2: //追加
            unset($data['id']);
            $wpdb->insert($table, $data);
            $message = "追加しました。";
            break;
        case 3: //削除
            $wpdb->query($wpdb->prepare("DELETE FROM ". $table. " WHERE id = ". $data['id']));
            $message = "削除しました。";
            break;
        default:
            $message = "操作を指定して下さい。";
    }
}

・radioボタンの状態により、更新・追加・削除を行います。

※これまでのコードは、細かいところは省略して書いてますので、そのままでは動作しないです。大体こんな感じということで、理解して下さい。

]]> http://mori.moripower.jp/eqwip/wordpress/1253.html/feed 1 WordPress プラグイン制作　その２ http://mori.moripower.jp/eqwip/wordpress/1212.html http://mori.moripower.jp/eqwip/wordpress/1212.html#comments Tue, 19 Apr 2011 14:30:30 +0000 admin http://mori.moripower.jp/?p=1212 前回までは、ダッシュボードに管理画面メニューを表示してみました。メニューをクリックすると真っ白でしたが、今回はその中身を作ってみます。

(1) 処理を記述するファイルを作って読み込みます。

function moripower_table_manager() {
include('moripower-table-manager-admin.php');
}

読み込むファイル（moripower-table-manager-admin.php）には、表示するHTMLを記述します。

<p style="font-size:200p">あ</p>

めっちゃ、でかい「あ」を表示する。これはこれで面白いプラグインかも・・・。
m20110419-11

(2) テーブルを作成します
・「あ」ではやっぱり悲しいので、テーブルの内容を表示してみましょう。早速、テーブルを作ります。
・WordPressでWP-phpMyAdminというプラグインを入れるとダッシュボードから直接テーブル操作できるから便利です。下記のようなテーブルを作ってください。
・ちょと CakePHPを意識して、主キーは「id」でauto-incrementで。

field type null etc
id int(11) no unsigned auto-increment

(3) 適当にデータを入れて下さい。次に、テーブルを読み込みます。
・$wpdbオブジェクトを使うと、接続処理とか既にWordPressがやっているので、簡単にデータを持ってこれます。

<h2>モリパワー社員一覧</h2>
<?php
global $wpdb;
$table = "test_table";
$results = get_results("SELECT * FROM ". $table, "ARRAY_A");
print_r($results);
?>

・こんな感じで、テーブルの内容が表示されるはず。

モリパワー社員
Array ( [0] => Array ( [id] => 4 [name] => モリパワー社員あいう
　　　　　　　　 [age] => 50 [employee_no] => 192000 ) )

・表示されるのは分かったので、もっと表らしくtableタグで表示します。

    <table class="widefat">
        <thead>
        <tr>
            <th><?php _e('ID','mtm_poedit'); ?></th>
            <th><?php _e('氏名','mtm_poedit'); ?></th>
            <th><?php _e('年令','mtm_poedit'); ?></th>       
            <th><?php _e('社員番号','mtm_poedit'); ?></th>
            <th><?php _e('操作','mtm_poedit'); ?></th>
        </tr>      
        </thead>
       
        <?php foreach ($results as $i=>$row): ?>
        <tr>
            <td id="<?php echo "id".$i; ?>"><?php echo $row['id']; ?></td>
            <td id="<?php echo "name".$i; ?>"><?php echo $row['name']; ?></td>
            <td id="<?php echo "age".$i; ?>"><?php echo $row['age']; ?></td>       
            <td id="<?php echo "employee_no".$i; ?>"><?php echo $row['employee_no']; ?></td>
            <td><input type="button" value="<?php _e('copy','mtm_poedit');?>" onclick="copy_field(<?php echo $i; ?>)" /></td>
        </tr>      
        <?php endforeach; ?>

・こんな感じで表示されるはず。
m20110420-1
・class を widefat とするとダッシュボードでよく見る表デザインになるみたい。
・ループさせて行を表示して、id名に $i をつけて判別できるようにしました。javascriptのfield_copyという関数で、formのinputにコピーさせようと思います。

＝＞ WordPress プラグイン制作　その３

]]> http://mori.moripower.jp/eqwip/wordpress/1212.html/feed 1 WordPress プラグイン制作　その１ http://mori.moripower.jp/eqwip/wordpress/1174.html http://mori.moripower.jp/eqwip/wordpress/1174.html#comments Tue, 19 Apr 2011 09:40:24 +0000 admin http://mori.moripower.jp/?p=1174 WordPressのプラグイン機能でダッシュボードに管理画面を作成します。第１回目は、ダッシュボードにプラグインの枠を作るところまでです。

(1) プラグインの基本的なフォルダーとファイルを作ります

・プラグインフォルダは、wp-content/plugins/　配下に作ります。
　　　⇒　例えば、moripower-table-manager フォルダとします。
・ここに、phpファイルを作りましょう。
　　　⇒　例えば、moripower-table-manager.php とします。

<?php
/*
    Plugin Name: MoriPower Table Manager
    Plugin URI: http://www.moripower.jp
    Description: Plugin for Database Table CRUD
    Author: Tsukasa Morinaga
    Version: 0.1
    Author URI: http://www.moripower.jp
*/
?>

これだけでプラグインの一覧に、題のみですが表示されます。
m20100419

(2) ダッシュボードのメニューに、項目を表示させまます

先ほどの、moripower-table-manager.php に下記のコードを記述しましょう。
・add_actionの説明は、WordPress プラグイン作成前の基礎知識が理解しやすいです。
・フックの種類を調べるには、WordPress Hooks Database が非常に便利です。
・フックってVBとかAccessのイベントプローシジャみたいなものかな？ まさに引っ掛けるって感じがぴったり！

//　管理パネルにメニュー項目を追加する
add_action('admin_menu', 'moripower_table_manager_addmenu');

//　メニュー項目を追加
function moripower_table_manager_addmenu() {
$name = 'モリパワー社員管理';
add_management_page(__($name), __($name), 10, basename(__FILE__),
             'moripower_table_manager');
}

早速、プラグインを有効化してみましょう！
m20100419-1

ダッシュボードのメニューに、表示されたはずです。

m20100419-2
管理画面に自分のメニュー項目が表示されて何だかうれしい・・・。

「モリパワー社員管理」をクリックしてみます。当然、まだ何も作ってないので、真っ白！
m20100419-3

※次回は、中身を作ってみます。予定としては、データベースにテーブルを作って、それを更新する感じの管理画面です・・・。

＝＞ WordPress プラグイン制作　その２

]]> http://mori.moripower.jp/eqwip/wordpress/1174.html/feed 0 WordPress で動画貼付け YouTube http://mori.moripower.jp/eqwip/wordpress/995.html http://mori.moripower.jp/eqwip/wordpress/995.html#comments Sat, 04 Dec 2010 03:04:48 +0000 admin http://mori.moripower.jp/?p=995 ワードプレスでYoutubeなどタグを直接貼付ける場合、<object>タグ等の強力な除去機能により、うまく貼り付けられないことがあります。こんなとき、Viper’s Video Quicktags を導入することで、動画投稿時のストレスがかなり減ります。

(1) プラグイン導入

・ダッシュボード、プラグインで検索　「Viper’s Video Quictags」

youtube01

・四★

youtube02

・編集の際に、アイコンガ出る

youtube03

(2) Youtube貼付け

・貼り付けたいYouTubeを探して、そのURLをコピー

youtube04

・編集にて、Youtubeボタンをおして、下記の部分に貼付け

youtube05

・Youtubeのショートコードが入力される

youtube06

※動画投稿、楽になりました。
※管理画面から動画サイトも色々選べるようです。 Flash,QuickTime等のタグもOKのよう。

以上です。

]]> http://mori.moripower.jp/eqwip/wordpress/995.html/feed 0 WordPress にツイッター、jtweetsanywhere http://mori.moripower.jp/eqwip/wordpress/961.html http://mori.moripower.jp/eqwip/wordpress/961.html#comments Fri, 05 Nov 2010 08:35:29 +0000 admin http://mori.moripower.jp/?p=961 WordPress内に、twitterを表示するということで、Twitterで提供している@AnywhereサービスをJQueryで表示するプラグインを利用。

１．ダウンロード
jtweetsanywhereからまずは、スクリプトをゲット。

２．twitterにアプリ登録
@Anywhereサービスを利用するには、登録してkeyコードを発行する必要あり。
m2010110501
各項目は、適宜、入力してOK。

自分のアカウントに下記のように登録されるので、「consumer key」を控えておく。
m2010110502

３．jtweetsanywhereの読み込み
Wordpressでは、既に多くのJavaScriptを読み込んでおり、整然とロードする関数(wp_enqueue_script)が用意されている。
(1) functions.php

$jtweets = get_bloginfo('home') . "/wp-content/themes/bp-moripower/js/jquery.jtweetsanywhere-1.2.0.js";
wp_enqueue_script('jquery.jtweetsanywhere', $jtweets, array('jquery'), "1.2.0");

(2) header.php
・jtweetsanywhereで用意されているcssを読み込み
・上記２で登録したconsumer keyをkeyコードに記載

&lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?php get_bloginfo('home'); ?&gt;/wp-content/themes/bp-moripower/js/jquery.jtweetsanywhere-1.2.0.css" /&gt;
&lt;script type="text/javascript" src="http://platform.twitter.com/anywhere.js?id=keyコード&v=1"&gt;&lt;/script&gt;

(3) JavaScript
・表示パターンは色々有り。

&lt;script type="text/javascript"&gt;
jQuery(document).ready(function(){
    jQuery('#jTweetsAnywhereSample1').jTweetsAnywhere({
        username: ['user1', 'user2'],
        count: 5,
        showTweetFeed: {
            paging: { mode: 'prev-next' }
        }
    });
});
&lt;/script&gt;

以上です。

]]> http://mori.moripower.jp/eqwip/wordpress/961.html/feed 0 WordPress3.0 BuddyPress Capability Manager http://mori.moripower.jp/eqwip/wordpress/895.html http://mori.moripower.jp/eqwip/wordpress/895.html#comments Wed, 11 Aug 2010 07:16:10 +0000 admin http://mori.moripower.jp/?p=895 WordPress3.0 にBuddyPressを導入し複数サイトタイプに変え、そこにCapabilityManagerプラグインを入れてみました。

①　まずは、検索する。

m2010080901

m2010080902

②　ダウンロードしてインストール、その後、「ネットワークで有効化」をクリック。

m2010080903

③　ユーザのメニューに「Capabilities」が表示される。

m2010080904

④　該当の権限グループを選ぶ。

別の権限グループを作る際は、一旦、元になる権限グループを表示させ、それをコピーすると良い。
「Copy New Row」

m2010080905

⑤　必要な権限をチェックしたり、外したりして調整する。

ちなみに、private、publish、othersというキーワードがあるが、それぞれ非公開、公開、他ユーザが所有という意味だと思う。特にOthesは、うまく使うと「ユーザごとに、記事・ページを分散管理できる」と思われる。

m2010080906

 

以上です。

]]> http://mori.moripower.jp/eqwip/wordpress/895.html/feed 0 TinyMCE Advance のスタイル設定 http://mori.moripower.jp/eqwip/wordpress/877.html http://mori.moripower.jp/eqwip/wordpress/877.html#comments Tue, 10 Aug 2010 16:03:47 +0000 admin http://mori.moripower.jp/?p=877 TinyMCEは便利なんですが、下記のスタイル・ドロップダウンリストボックスに追加でCSSクラスを追加できると、もっと便利になるはず。

m20100811-1

マニュアルでは、wp-content/plugins/tinymce-advanced/css　の「tadv-mce.css」にクラスを追加すると、スタイル・ドロップダウンに、指定したクラスが出てくると書かれてます。

しかし、FireFox系ではＯＫですが、IE系では出たり出なかったり・・・・。

このドロップダウンに表示されているのは、TinyMCEのテーマCSSにあるクラス「.～～」だけのようで、「div.～～」のように指定したクラスや「p」など普通のタグは設定されない。

とりあえず、TinyMCEのテーマCSS　に手を入れる。　↓
wp-includes/js/tinymce/themes/advanced/skins/wp_theme　の「content.css」を修正する。
これで、IEもキチント表示され、スタイル・ドロップダウンに表示される順番も変えられる。

m20100811-2
「alignclear」　を追加してみた。

以上です。

]]> http://mori.moripower.jp/eqwip/wordpress/877.html/feed 1