yuu_nkjm blog

[WordPress][JavaScript][jQuery] 見出しを目次にするスクリプト

jQuery Table of Contents Plugin

TOC | jQuery Table of Contents Pluginがなかなか良い感じ．

見出しに番号をつける

<script type="text/javascript">
// h2にナンバリング
jQuery(function() {
    jQuery(".post-entry .chapterize h2").each(function(i) {
         var current = jQuery(this);
         var txt = current.text();
         current.text((i+1)+". " +txt);
     });
});
</script>

見だしを目次にする

h2とh3の入れ子関係の処理はしていない．見出しから目次を自動生成 & クリックで該当位置にスクロール（jQuery使用） | Stack Stack!を参考にカスタマイズした．

<script type="text/javascript">
//TOCの作成
jQuery(function(){
    var elm = jQuery("<ul></ul>");    
    jQuery(".post-entry h2, .post-entry h3").each(function(i) {
      var current = jQuery(this);
      var tagName = current.get()[0].localName;
      if(tagName == "h2"){
          if(current.attr('id') === undefined){
                current.attr("id", "chapter-" + i);
          }
          elm.append("<li><a href=#" + current.attr('id') + ">" + current.text() + "</a></li>");
      } else if(tagName == "h3"){
          if(current.attr('id') === undefined){
             current.attr("id", "subchapter-" + i);
           }
           elm.append("<li style='list-style-type: none;'>　　<a href=#" + current.attr('id') + ">" + current.text() + "</a></li>");
    }
    });    
    jQuery(".table-of-contents").append(elm);
    return false;
});

jQuery-Collapse

jQuery Collapse | webcloudを使うことにした．

目次の項目の折りたたみ

現在表示しているページに関するもの以外は，折りたたむ．jQueryで現在のページの所属しているサブメニューを開いた状態にする。 | webOpixel，jQueryで現在のファイル名を取得する方法 | PHPサンプル実験室を参考にした．

// TOCの折りたたみ
jQuery(function() {
	var url = window.location;	
	jQuery('ul.nav li a[href="'+url+'"]').parent().addClass('active');
	var path = url.href.split('/');
	var file_name = path.pop();
        file_name = file_name.split('#')[0];
        jQuery(".reference a[href*='" + file_name + "']").addClass("selected-menu");
        jQuery(".reference ol ol:has(a[href*='" + file_name + "'])").addClass("active");
});
</script>

activeクラスで表示を切りかえるCSSを用意しておく．

.reference ol ol{
    display: none;
}
.reference ol ol.active {
    display: block;
}

[openSUSE][WordPress] openSUSEにWordPressをインストールする (MySQL版)

以前SQLite版を入れたが，やはり王道に乗っておくのが一番ということで，日本語の通常版(MySQL版)をインストールしてみる．

OpenSUSE 12.2 (64bit)，WordPressのバージョンは3.4.2-jaだった．

公式サイトのチュートリルがしっかりしているので，基本的にはそれを見れば良い．WordPress のはじめ方 - スタートガイド - WordPress Codex 日本語版

インストール手順

1. WordPress | 日本語から最新版のtar.gzのリンクを探し，ダウンロードする．展開し，インストールしたいディレクトリにコピーする．

   cd ~/public_html/
   wget http://ja.wordpress.org/wordpress-3.4.2-ja.tar.gz
   tar zxf wordpress-3.4.2-ja.tar.gz
   cp -a wordpress wordpresslab
   

2. MySQLにデータベース，ユーザアカウントを設定する．

   # rootにもしっかりパスワードはかけておこう．
   mysql -u root -p
    
   # -とか_とか入れるとややこしくなった記憶があるので，読みにくいが我慢．
   # wpを複数入れる際は接頭字が指定できるので，wpdbとかでよかったかも．
   create database wpdbforlab;
   grant all on wpdbforlab.* to 'wpadministrator'@'localhost' identified by '*************';
   exit
    
   # ログイン出来るか確認
   mysql -u wpadministrator -p
   use wpdbforlab
   

3. http://wordpress.nkjm.info/~user1/wordpresslab/へアクセスすると，wp-config.phpの作成指示が表示されるので，「設定ファイルを作成する」ボタンをクリック．

   wp-config.php ファイルが見つかりません。開始する前にこのファイルが必要です。
   ヘルプが必要な場合はドキュメンテーションをご覧ください。
   ウェブインタフェース経由で wp-config.php を作成できますが、サーバーによっては動作しないかもしれません。最も安全な方法は、手動でファイルを作成することです。
   「設定ファイルを作成する」
   

4. データベース名: wpdbforlab
   データベースのユーザー名: wpadministrator
   データベースのパスワード: ****
   データベースホスト: localhost
   データベースの接頭辞 (1つのデータベースに複数の WordPress を作動させる場合): お好きにどうぞ．
   

5. ~/public_html/wordpresslab/にapacheが書き込める権限を与えていないので，手動で生成されたPHPコードを~/public_html/wordpresslab/wp-config.phpに書き込む．この時，文字コードをUTF-8，改行コードをLFとする．
6. 「インストール実行」ボタンをクリックする．サイトのタイトル，作成するユーザなどを入力し「WordPressをインストール」ボタンをクリックする．
7. WordpressでFTP接続情報を求められたときのメモ - rubellum's blog

   wp-config.phpに以下を追記．
   define('FS_METHOD', 'direct');
   

   cd ~/public_html
   chmod 707 wordpresslab
   chmod 707 wordpresslab/wp-content
   mkdir wordpresslab/wp-content/upgrade
   mkdir wordpresslab/wp-content/uploads
   chmod 707 wordpresslab/wp-content/upgrade
   chmod 707 wordpresslab/wp-content/uploads
   chmod -R 707 wordpresslab/wp-content/themes
   chmod -R 707 wordpresslab/wp-content/plugins
   

8. 以上で，インストールが完了．http://wordpress.nkjm.info/~user1/wordpresslab/wp-admin/が管理用ページとなる．続いて，プラグインやテーマのインストールをしていく．

インストールした環境の詳細

.htaccessを利用するプラグインがあるので，AllowOverrideする．必要ならOptionsでFollowSymLinksなども追加する．

/etc/apache2/conf.d/wordpress-jp.conf
 
<Directory "/srv/www/htdocs/jp">
        Options FollowSymLinks
        AllowOverride All
        Order allow,deny
        Allow from all
</Directory>

パーマリンクの設定などで，mod_rewriteが必要になる．/etc/sysconfigエディタで，rewriteを追加する．

php-curl(，php-gd)がインストールされてなくてはまったことが何度かあった．

zypper search php|grep "i |"
i | apache2-mod_php5                     | Apache 2.0 向け PHP5 モジュール      
i | php5                                 | PHP5 コアファイル                    
i | php5-bz2                             | PHP5 拡張モジュール                  
i | php5-ctype                           | PHP5 拡張モジュール                  
i | php5-curl                            | PHP5 拡張モジュール                  
i | php5-dom                             | PHP5 拡張モジュール                  
i | php5-gd                              | PHP5 拡張モジュール                  
i | php5-iconv                           | PHP5 拡張モジュール                  
i | php5-json                            | PHP5 拡張モジュール                  
i | php5-mbstring                        | PHP5 拡張モジュール                  
i | php5-mcrypt                          | PHP5 拡張モジュール                  
i | php5-mysql                           | PHP5 拡張モジュール                  
i | php5-pdo                             | PHP5 拡張モジュール                  
i | php5-sqlite                          | PHP5 拡張モジュール                  
i | php5-tokenizer                       | PHP5 拡張モジュール                  
i | php5-xmlreader                       | PHP5 拡張モジュール                  
i | php5-xmlwriter                       | PHP5 拡張モジュール                  
i | php5-zip                             | PHP5 拡張モジュール                  
i | php5-zlib                            | PHP5 拡張モジュール                  
i | phpMyAdmin                           | Administration of MySQL over the web 

zypper search apache|grep "i |"
i | ant-apache-bcel                  | Ant 向け apache bcel タスクオプション                    
i | ant-apache-bsf                   | Ant 向け apache bsf タスクオプション                     
i | ant-apache-log4j                 | Ant 向け apache log4j タスクオプション                   
i | ant-apache-oro                   | Ant 向け apache oro タスクオプション                     
i | ant-apache-regexp                | Ant 向け apache regexp タスクオプション                  
i | ant-apache-resolver              | Ant 向け apache resolver タスクオプション                
i | apache-commons-daemon            | Commons Daemon - Java デーモンの制御                     
i | apache-commons-logging           | Apache Commons Logging パッケージ                        
i | apache2                          | Apache Web サーババージョン 2.2                          
i | apache2-devel                    | Apache 2.2 ヘッダファイル                                
i | apache2-doc                      | 追加パッケージのドキュメンテーションです。               
i | apache2-example-pages            | Apache 2 Web サーバ向けサンプルページ                    
i | apache2-mod_perl                 | Apache 向け内蔵 Perl                                     
i | apache2-mod_php5                 | Apache 2.0 向け PHP5 モジュール                          
i | apache2-mod_python               | Apache 2 Web サーバ向け Python モジュール                
i | apache2-prefork                  | Apache 2 "prework" MPM (マルチプロセッシングモジュール)  
i | apache2-utils                    | Apache 2 ユーティリティ                                  

zypper search mysql|grep "i |"
i | libmysqlclient18                     | MySQL コミュニティサーバ向け共有ライブラリ                
i | libqt4-sql-mysql                     | Qt 4 MySQL support                                        
i | libreoffice-base-drivers-mysql       | LibreOffice 向け MySQL データベースドライバ               
i | mysql-community-server               | MySQL コミュニティサーバのサーバ部分                      
i | mysql-community-server-client        | MySQL コミュニティサーバ向けクライアント                  
i | mysql-community-server-errormessages | MySQL コミュニティサーバの開発用ヘッダファイルとライブラリ
i | php5-mysql                           | PHP5 拡張モジュール                                       

/etc/sysconfig エディタ
Network/WWW/Apache2/
APACHE_MODULES="actions alias auth_basic authn_file authz_host authz_groupfile authz_default authz_user autoindex cgi dir env expires include log_config mime negotiation setenvif ssl userdir php5 reqtimeout  mod_proxy mod_proxy_ajp rewrite"

[Linux][openSUSE][lsof] ポートやファイルの利用状況を調べる(ファイルをオープンしているプロセスを調べる)

lsof

ポートの利用状況を調べたい時，ファイルをどのプロセスがオープンしているのかを調べたい時などは，lsofコマンドを使う．

• そのポートは既に誰かがバインディングしてるから使えへんで！
• 外付けHDD上のファイルを誰かがオープンしているから，umountできへんで！

とか怒られたときに有用．

あるポートを使用しているプロセスを表示

lsof -i:80,8080
COMMAND   PID USER   FD   TYPE  DEVICE SIZE/OFF NODE NAME
java      2655 tomcat   48u  IPv4 2185755      0t0  TCP *:http-alt (LISTEN)
httpd2-pr 9079   root    3u  IPv4 2731119      0t0  TCP *:http (LISTEN)

あるプロセスが使用しているファイルを表示

lsof -c tomcat
COMMAND    PID   USER   FD   TYPE             DEVICE SIZE/OFF     NODE NAME
tomcat-sy 2633 tomcat  cwd    DIR              252,0     4096        2 /

あるユーザが使用しているファイルを表示

lsof -u root|lv
COMMAND     PID USER   FD      TYPE             DEVICE SIZE/OFF       NODE NAME
systemd       1 root  cwd       DIR              252,0     4096          2 /
systemd       1 root  rtd       DIR              252,0     4096          2 /

あるファイルを使用しているプロセスを表示

lsof /mnt/exthdd
COMMAND   PID USER   FD   TYPE DEVICE SIZE/OFF NODE NAME
bash    30959 root  cwd    DIR   8,49     4096    2 /mnt/exthdd
lsof    30988 root  cwd    DIR   8,49     4096    2 /mnt/exthdd
lsof    30989 root  cwd    DIR   8,49     4096    2 /mnt/exthdd