FaceBookの使いにくさ・・・何とかシチクレー。
FaceBook、流行ってるんで活用するのはOKなんだけど、正直結構、使いにくい・・・。メニューやリンクが今までのインターフェースと一線を画するぞ的な雰囲気バリバリで、年寄りにはついていけないところがある。
さらに20代・30代と違い、40代はネットでの発言にはかなり気を使う。若者は、普通におしゃべりする感覚で抵抗はないのだろうが、気軽に書き込みすることができない。
早く、ネットの時代終わらないかなー。次の新しいインフラが出てこないかなー。
WordPress プラグイン制作 その３
(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>
<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先は、この関数自身です。
(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>
$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 = "操作を指定して下さい。";
}
}
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ボタンの状態により、更新・追加・削除を行います。
※これまでのコードは、細かいところは省略して書いてますので、そのままでは動作しないです。大体こんな感じということで、理解して下さい。
WordPress プラグイン制作 その２
前回までは、ダッシュボードに管理画面メニューを表示してみました。メニューをクリックすると真っ白でしたが、今回はその中身を作ってみます。
(1) 処理を記述するファイルを作って読み込みます。
function moripower_table_manager() {
include('moripower-table-manager-admin.php');
}
include('moripower-table-manager-admin.php');
}
読み込むファイル（moripower-table-manager-admin.php）には、表示するHTMLを記述します。
<p style="font-size:200p">あ</p>
めっちゃ、でかい「あ」を表示する。これはこれで面白いプラグインかも・・・。
(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);
?>
<?php
global $wpdb;
$table = "test_table";
$results = get_results("SELECT * FROM ". $table, "ARRAY_A");
print_r($results);
?>
・こんな感じで、テーブルの内容が表示されるはず。
・表示されるのは分かったので、もっと表らしく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; ?>
<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; ?>
・こんな感じで表示されるはず。
・class を widefat とするとダッシュボードでよく見る表デザインになるみたい。
・ループさせて行を表示して、id名に $i をつけて判別できるようにしました。javascriptのfield_copyという関数で、formのinputにコピーさせようと思います。
WordPress プラグイン制作 その１
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
*/
?>
/*
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
*/
?>
これだけでプラグインの一覧に、題のみですが表示されます。
(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');
}
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');
}
早速、プラグインを有効化してみましょう！
ダッシュボードのメニューに、表示されたはずです。
管理画面に自分のメニュー項目が表示されて何だかうれしい・・・。
「モリパワー社員管理」をクリックしてみます。当然、まだ何も作ってないので、真っ白！
※次回は、中身を作ってみます。予定としては、データベースにテーブルを作って、それを更新する感じの管理画面です・・・。
久しぶりの感動！ ScreenGrab
いやー、久しぶりに感動したソフトに出会いました。
ScreenGrab FireFox用ですが。
スクリーンショットのソフトで、使い勝手が良くて思わずパソコン触るのが楽しくなります。
（っていうか、これ結構、前からあるみたい・・・。なんか悔しいです。）
他の方には同じ悔しさ味わってほしくないので、早速、ご紹介します。
・FireFoxのアドオン
・ScreenGrabで検索し、インストール
・FireFox再起動で、右下に「ひかえめ」に出てきます。この控え目さがイイ。
・Saveでファイルに保存、Copyでクリップボードに。ウィンドウや範囲を指定して取り込みも可。
・クリップボードにコピーして、WordやPowerPointにも直ぐに貼り付けできる。
・これでマニュアル作りもストレスなく、らくらくに。
・ところで、IEにはないのかな？
救援物資を送ろう
フリークスサーフクラブ様にて、今回の日本太平洋沖地震の被災地に向けて救援物資を集めています。今回は、仙台サーフショップからの求めに応じて『靴』を集めていました。
微々たるものですが協力させて頂きました。
※お蔭様で家の整理もできました。写真の倍以上のぼろ靴が出てきたので捨てることができ、靴箱がスッキリ！
$script_for_layout にスタイルシートCSSを展開する
久しぶりのCakePHPネタです。（CakePHP1.3)
Viewごとに、「適用するCSSスタイル、Javaスクリプトを変えたい！」という時は、レイアウトにある$script_for_layoutを活用する。
（１）例えば、default.ctp に・・・
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<?php echo $this->Html->charset(); ?>
<title><?php echo $title_for_layout ?></title>
<meta http-equiv="content-style-type" content="text/css" />
<?php
//==================================================
// CSS、Script
//==================================================
echo $this->Html->css('style');
echo $scripts_for_layout; ?>
</head>
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<?php echo $this->Html->charset(); ?>
<title><?php echo $title_for_layout ?></title>
<meta http-equiv="content-style-type" content="text/css" />
<?php
//==================================================
// CSS、Script
//==================================================
echo $this->Html->css('style');
echo $scripts_for_layout; ?>
</head>
（２）スタイルを適用したいViewに下記を記述する。
（３）これで、$script_for_layout部分にスタイルが展開される。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<title>タイトル</title>
<meta http-equiv="content-style-type" content="text/css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="pdf.css" media="all"/>
</head>
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<title>タイトル</title>
<meta http-equiv="content-style-type" content="text/css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="pdf.css" media="all"/>
</head>
※$this->html->cssは、第3引数に ‘inline’=>falseを記載すること。
これがないと、定義したViewの部分に展開される。
※CakePHP1.2の場合は、第4引数に記載していたようです。
フェイスブックやってる？
最近、そんなに使っていないにもかかわらずFaceBook経由で、お友達のお誘いが多い・・・。
かなりの勢いで、ユーザ増えてんだろうなー。
全世界の人口をカバーするのも時間の問題か？
いや、マジにそう思う。
