月別: 2012年7月

wordpress のインストール

facebook アプリと wordpress の連携を行うときのメモ
参考書籍は
10日でおぼえるFacebookアプリ開発入門教室 (10日でおぼえるシリーズ)

開発環境は ubuntu 11.10 64bit
に
web server として apache などをいれているため
XAMPPではないのですが、ほぼ同じです
まず、すでに自分の環境には wordpress がインストールされているため
別のディレクトリに wordpress を新規に配置します
現在は
/var/www/wordpress
となっているので
今回はクリッピングアプリ作成ということで
mkdir /var/www/cliping/wordpress
となるようにします
なぜ、今回新しくするかというと
使うデータベースが異なるからです
最初に、
mkdir /var/www/cliping
でディレクトリを作成し
すでにダウンロードしてある wordpress の圧縮ファイル
wordpress-3.3.1-ja.zip
をコピーします
cp ダウンロード/wordpress-3.3.1-ja.zip /var/www/cliping/
unzip wordpress-3.3.1-ja.zip
で圧縮ファイルを解凍
cd wordpress/
でディレクトリ移動して
cp wp-config-sample.php wp-config.php
で設定ファイルを作成します
あとは、
vim wp-config.php
でファイルを開いて
24 define(‘DB_NAME’, ‘database_name_here’);
25
26 /** MySQL データベースのユーザー名 */
27 define(‘DB_USER’, ‘username_here’);
28
29 /** MySQL データベースのパスワード */
30 define(‘DB_PASSWORD’, ‘password_here’);
31
32 /** MySQL のホスト名 */
33 define(‘DB_HOST’, ‘localhost’);
の部分を編集します
ちなみに、数字が最初についているのは
vim エディタで :set number
を実行し、行数を表示しているためです
もし、書籍通りに変更するなら
24 define(‘DB_NAME’, ’10daysfbapp_chapter06′);
25
26 /** MySQL データベースのユーザー名 */
27 define(‘DB_USER’, ‘root’);
28
29 /** MySQL データベースのパスワード */
30 define(‘DB_PASSWORD’, ”);
31
32 /** MySQL のホスト名 */
33 define(‘DB_HOST’, ‘localhost’);
となります
私の場合、すでにroot パスワードを設定済みなので、
” ではなく、ここにパスワードがはいります
ちなみに、 wordpress と同様に有名なのが Movable type
wordpress はCMS（Content Management Sytem)
として有名で
PHPで動作し、DBから動的に記事を生成するのが違いです

JavaScriptでよく使われるもの　その2

計算、数値処理関連メソッド
toFixed()
小数値n桁に揃える
parseInt()
整数化する
日付関連オブジェクト
Date
日付オブジェクト
日付関連メソッド
getFullYear()
西暦4桁で年を返す
getMonth()
月を返す
getDate()
日付を返す
getTime()
1970年1/1からのミリ秒を返す
文字列、正規表現メソッド
substr()
指定位置から、指定文字数を抜き出す
indexOf()
指定文字があるか調べる
match()
正規表現にマッチしたものを返す
replace()
正規表現にマッチしたものを置き換えする
画像関連オブジェクト
Image
画像オブジェクト
画像関連プロパティ
src
画像のurl
onload
画像の読み込み完了時のイベントハンドラ
width
幅
height
高さ
その他のメソッド
alert()
アラートダイアログの表示
setInterval()
定期的処理を行う
別名インターバルタイマー
clearInterval()
インターバルタイマーの停止
つまり定期的処理を停止する

JavaScriptでよく使われるもの

JavaScriptでよく使われるものをまとめました
Java script のDOM関連
getElementById()
特定のIDの要素を抽出
querySelectorAll()
セレクターにマッチする要素を抽出
getAttribute()
要素の属性を読み込む
appendChild()
子ノードとして追加
次にDOM関連プロパティ
innerHTML
HTMLを出力
innerText, textContent
テキストのままを出力
続いて、イベント関連メソッド
addEventListener()
イベントリスナーを追加
preventDefault()
browserのデフォルト動作を禁止する
CSS関連プロパティ
opacity
不透明度
backgroundColor
背景色
position
位置の指定方法
width
横幅
height
高さ
left
左の座標
top
上の座標

CSSプロパティの値を取得

CSSプロパティの値を取得
cssメソッドでプロパティ名たけ
指定すると
対応する値が取り出しできます
例えば、class=”js” のliタグの
背景色）黄色にして
cssメソッドで値を取り出しすると
プロパティの値を取得表示できます
以下はソースの断片
$(function(){
$(‘li.js’).css(‘background-color’,’yellow’);
window.alert(“jsクラスの背景色は”+$(‘li.js’).css(‘background-color’,’yellow’));
});
これてダイアログには
jsクラスの背景色はrgb(255,255,0)
となります
ただし、注意点として
$()が複数の要素に合致した場合でも
最初に条件が一致したところしか反映されません
これはsedコマンドやvimエディタの
置き換え機能とにています
これは、CSSメソッドだけじゃなく
取得関連メソッドに当てはまります

状態でアクセスする要素の絞り込み

チェック済み
アニメーション実行中
など
要素の状態による絞り込みもできます
以下はその一例
:enabled
フォーム要素が利用可能な状態
:disabled
フォーム要素が利用不可能名状態
:checked
ラジオボタンやチェックボックスが
チェック状態になっている
:selected
選択ボックスで選択状態になっている
:hidden
要素が非表示状態
:visibled
要素が表示状態
:animated
要素がアニメーション中
例えば、チェック状態にある
ラジオボタンの背景色を黄色にするなら
$(function(){
$(‘label:has(:checked)’).css(‘background-color’,’yellow’);
});

属性の値による絞り込みについて

属性の値による絞り込みについて
[attr]は特定の属性を、もつ要素たけとりだす
例として
aタグのtarget要素があるのを設定したいなら
$(‘a[target]’).css(‘background-color’,yellow’);
で
aタグのうち
targetがついているところだけ
背景色か黄色になる
もうちょっと絞り込みするなら
=
と
!=
を使うといい
target=”_brank”
のところだけにしたいなら
$(‘a[target=”_brank”]”).css(‘background-color’,yellow’);
にして、
逆に
target=”_brank”以外にしたいなら
$(‘a[target != “_brank”]’).css(‘background-color’,yellow’);
とする
これらを扱うとき
Linuxでよく使う正規表現みたいなのもつかえる
^=
なら~で始まる
$=
なら~で終わる
*=
なら~を含むすべて
もし、aタグのリンク先がjpで終わるのを対象にするなら
$(‘a[href $= “.jp/”]’).css(‘border’,’solid 1px blue’);
というようにする
もちろん、複数指定も可能
$(‘a[href ^=”http://”][target]’).css(‘border’,’solid 1px blue’);
として
http://で始まり
_targetを含むものを対象にできる
あと、覚えておくと便利なのが
見出しになる
h1やh2タグだけを対象にする方法
これは
:header を使えば簡単に指定できます
もし、見出しの背景色を変えるなら
$(‘:header’).css(‘background-color’,yellow’);
というようにします