Home

Seasonism Season3

サムネイル表示用Wiget

時系列順ではかなりあとの方の更新でしたが、ちょうど今テスト用WPから本家WPに移植作業中なので、作業がてら掲載。

特定のタグがついた記事に投稿された画像を、新着表示するプログラムです。テーマに変更を加えます。
ファンクション名が引用元のままだったり、オプション名が適当だったりしますが、ご愛敬。
なお、表示サンプルは本家をご覧下さい。

プラグイン化の方法がわからないのでテーマに直接書き加えます。
特にfanction.phpは常に読み込まれているのか、エラーを起こすと以降管理画面上で編集作業が不可能になります。必ずあらかじめfanction.phpのバックアップを取り、FFFTPやプロバイダのファイルマネージャーなどのファイルを直接編集(上書き)可能な環境を用意して作業してください。

参考にさせていただいたのはこちら

大半が上記記事の丸写しではありますが、機能自体をWidgetとして追加、オプション変更ができるように変更しました。

細かい変更点

  • ウィジェットとして追加、オプションで表示する件数やタグが変えられます。
  • 2枚以上画像がある記事に対応 (表示件数は単純に画像の「表示枚数」として動作)
  • 画像直リンクに変更 (単純なギャラリーとして機能)
    • lightbox2が入っていると幸せになれます

fanction.phpにwidgetを追加する

以下のコードをfanction.phpの先頭に追加して下さい。

PHP:
  1. <?php
  2. function attachment_ancherlinks3($num=5,$size="thumbnail",$tagslug=""){
  3.     $args = "tag=".$tagslug."&numberposts=".$num;
  4.     $myposts = get_posts($args);
  5.     $imgcnt = 1;
  6.     print "<ul id=\"thumb-post-lists\">";
  7.         for($i=0;$i<$num;$i++){
  8.         if($i>= count($myposts) ) return;
  9.         $attachments = get_children(array('post_parent' => $myposts[$i]->ID, 'post_type' => 'attachment', 'post_mime_type' => 'image', 'orderby' => 'menu_order'));
  10.         if(count($attachments)>= 1){
  11.             for($ii=0;$ii<count($attachments);$ii++){
  12.                 if($num<$imgcnt) return;
  13.                 $attachment = array_shift($attachments);
  14.                 $image = wp_get_attachment_image_src($attachment->ID, 'full');
  15.                 print "<li><a href=\"$image[0]\" title=\"$title\" rel=\"lightbox[1]\">".wp_get_attachment_image($attachment->ID,$size)."</a>";//サムネイル出力
  16.                 print "</li>";
  17.                 $imgcnt++;
  18.             }
  19.         }else{
  20.         }
  21.     }
  22.     print "</ul>";
  23. }
  24. ?>
  25. <?php
  26. register_sidebar_widget(__('Sample','hoge'), 'widget_sample');
  27. register_widget_control( 'Sample', 'sample_control' );
  28.  
  29. function widget_sample($args){
  30.     $options = get_option('mywidget_sample1');
  31.     $title = empty($options) ? __( 'Sample' ,'hoge') : $options;
  32.     $showmax = get_option('mywidget_sample2');
  33.     $max = $showmax;
  34.     $showtag = get_option('mywidget_sample3');
  35.     $tag = $showtag;
  36.     extract($args);
  37.     echo $before_widget;
  38.     echo $before_title . $title . $after_title;
  39.     echo '<p>現在タグスラッグ'.$showtag.'の画像を新着'.$showmax.'件表示しています</p>';
  40.     attachment_ancherlinks3($max,"thumbnail",$tag);
  41.     echo $after_widget;
  42. }
  43. function sample_control(){
  44.     $options = get_option('mywidget_sample1');
  45.     $showmax = get_option('mywidget_sample2');
  46.     $showtag = get_option('mywidget_sample3');
  47.     if (isset($_POST['mywidget_sample1'])) {
  48.         update_option('mywidget_sample1', $_POST['mywidget_sample1']);
  49.     }
  50.     if (isset($_POST['mywidget_sample2'])) {
  51.         update_option('mywidget_sample2', $_POST['mywidget_sample2']);
  52.     }
  53.     if (isset($_POST['mywidget_sample3'])) {
  54.         update_option('mywidget_sample3', $_POST['mywidget_sample3']);
  55.     }
  56. ?>
  57. <p><label for="mywidget_sample"><?php _e( 'Title:','hoge' ) ?>
  58. <input id="mywidget_sample1" name="mywidget_sample1" type="text" value="<?php echo $options; ?>" /></label></p>
  59. <p><label for="mywifet_sample2"><?php _e( 'MaxImage:','hoge' ) ?>
  60. <input id="mywidget_sample2" name="mywidget_sample2" type="text" value="<?php echo $showmax; ?>"
  61. /></label></p>
  62. <p><label for="mywifet_sample3"><?php _e( 'Tag:','hoge' ) ?>
  63. <input id="mywidget_sample3" name="mywidget_sample3" type="text" value="<?php echo $showtag; ?>"
  64. /></label></p>
  65. <input type="hidden" id="sample-submit" name="sample-submit" value="1" />
  66. <?php
  67. }
  68. ?>

なお、表示条件の指定はタグスラッグで行います。なるべく半角英数にしておいたほうがいいかも知れません。

保存すると、ウィジェットの編集画面でSampleというウィジェットが追加できるようになるので、タイトルと表示数、表示するタグスラッグを入力して保存してください。
サイドバーに新着画像の一覧が表示されたはずです。

表示スタイルを変更する

style.cssに以下の行を追加して下さい

CSS:
  1. #sample li {display:inline;}
  2. #sample img {margin:0 5px 0 0;}

これで表示が横並びになります。
リストアイテムのマークがついてしまう場合も、ここで変更して下さい。

サムネイルサイズを変更する

設定のメディアからサムネイルサイズを変更します。この変更はギャラリー機能などに影響しますので注意して下さい。
だいたい横4枚~5枚に表示できるサイズがオススメです。
ちなみに2列になっても大丈夫だと思います。

注意事項

下記のTodoと内容がかぶりますが、現時点で実装出来てないことがありますので、以下の点に注意して下さい。

  • サムネイルサイズが共有されているため、サムネイルを使っている記事に影響する
  • Widgetが複数登録できないので、条件を変えた複数の一覧を作りたい場合は、fanction.phpにWidgetを追加する必要がある
  • 添付されただけの画像は表示されません
    • 他記事から引っ張ってきてるだけの画像が表示されないのは仕様です

Todo (未解決問題)

  • サムネイルサイズを独自で持たせる
  • Widgetを複数追加可能にする
  • プラグインとして独立させる
  • オプションで添付しただけの画像を表示できるようにする
  • タグスラッグ→タグ名に変換したい

おそらくこれ以上自分の技術では不可能なので、わかる方に改変いただくしかないかと思います。(他力本願)

サムネイル表示Todo

  • 任意の場所にサムネイルのリストを表示(基本sidebarだけど、pageにも置ける柔軟性が欲しい)
  • 新着xx件の画像をサムネイル
  • サイズはアスペクト比を変更せず、かつ規定サイズ以内に整形して表示
  • クリックで画像の拡大 (記事に飛ぶ必要はない)
  • リスト化する画像を条件指定
  • リスト用サムネイルサイズを別途用意
    • 本体を解析してthumbnail以外のサイズでもthumbnailと同じ処理をさせるサイズをもうひとつ用意するようにコードを書き換える
  • 添付しただけの画像もサムネイル化

もう90%完成。

判明したこと&Todo

新規投稿の挙動でわかったこと

  • Tabの入力にはFirefoxのアドオンが必要
  • 箇条書き(Alt+Shift+U)中にShift+Enterで
    こうなって、さらにShift+Enter→箇条書きで

    • ここに来る
  • 戻す時はEnter2回。結構便利ね

WPの挙動でわかったこと

  • 『WordPress のアドレス』と『ブログのアドレス』どちらか一方のみをマルチドメインにすると、ログイン情報が保持されない
    • 記事ごとのパスワードが、正しく入力しても許可されなくて大変
    • 『変更をプレビュー』もできないワロタ

デフォルトテーマでわかったこと

  • index.php≠最初に読み込むページ
    • カテゴリーや月別アーカイブはindex.php?
    • パーマリンク先は『単一記事の投稿』(single.php)
  • sidebarが灰色いのは、実は画像だった
  • single.phpはclass="widecolumn"、index.phpはclass="narrowcolumn"
    • single.phpにget_sidebarさせるなら、narrowcolumnで。
    • さらに背景画像も別途読み込ませる必要が。
  • なぜsingle.phpが必要なんだろうか。無駄にしか思えない。
  • 箇条書きの表示がダサい

Todo

  • 著者名に応じて違うガジェットを表示→出来そう →出来た
  • パーマリンクでも著者名を判別してガジェットを表示→デフォルトで出来るのかあやしい
  • 著者名に応じて別々のタイトルバー→パーマリンクで出来なそう

    • 基本著者別じゃなくなったのでこだわる必要がなくなった。
    • single表示のときだけ、author判別してもいいかも。(ガジェットはわかりにくくなるからそのままで)
  • まず上の3つを試して、出来なければあきらめてマルチユーザー版にする →デフォルト偉すぎ
  • 著者名adminは明示的にリクエストされない限りどこにも表示されないようにする
  • 記事ごとにコメント可能レベルの設定(たぶんプラグイン)
  • 著者のみアイコン表示(たぶんテーマカスタマイズ)
  • 箇条書き表記を一般的なものに
  • アクセス解析
  • 新着記事に投稿者名表示
  • ログイン中のみ表示するメニューを設置
  • 投稿者アーカイブに投稿者名を表示

最初にやったこと(WPコア編)

PDO (SQLite) For Wordpressは一部、コアファイルを変更しないと正常動作しません。
自分はPHPについて何も知らないので、調べて修正した結果、正常に動作したことにすぎませんが、
ここに修正箇所と手順を記載します。

post.phpの編集

ページの追加・編集でこんな表示が出ます (ディレクトリ構成はうちのサイトの場合)

Warning: implode() [function.implode]: Invalid arguments passed in /home/toratama/www/nawo/wp/wp-includes/post.php on line 1980

Warning: Cannot modify header information - headers already sent by (output started at /home/toratama/www/nawo/wp/wp-includes/post.php:1980) in /home/toratama/www/nawo/wp/wp-includes/pluggable.php on line 868

MEMO-LOGさんの記事を参考にして1980行目の

$check_sql = "SELECT post_name FROM $wpdb->posts WHERE post_name = %s AND post_type IN ( '" . implode("', '", esc_sql($hierarchical_post_types)) . "' ) AND ID != %d AND post_parent = %d LIMIT 1";

$hierarchical_post_types_string = implode("', '", $hierarchical_post_types);
$hierarchical_post_types_string = addslashes($hierarchical_post_types_string);
$check_sql = "SELECT post_name FROM $wpdb->posts WHERE post_name = %s AND post_type IN ( '" . $hierarchical_post_types_string . "' ) AND ID != %d AND post_parent = %d LIMIT 1";

に変更すると正常に動作するようになります

comment.phpの編集

コメントを編集しようとするとまたもやエラーが出ます

Warning: array_merge() [function.array-merge]: Argument #1 is not an array in /home/toratama/www/nawo/wp/wp-includes/comment.php on line 1315

Warning: Cannot modify header information - headers already sent by (output started at /home/toratama/www/nawo/wp/wp-includes/comment.php:1315) in /home/toratama/www/nawo/wp/wp-includes/pluggable.php on line 868

MOT:主にプログラム勉強メモ部屋さんの記事を参考にして1315行目付近の

// Merge old and new fields with new fields overwriting old ones.
 $commentarr = array_merge($comment, $commentarr);

// Merge old and new fields with new fields overwriting old ones.
 if(count($comment) > 1)    // @to
 $commentarr = array_merge($comment, $commentarr);

と変更することで正常に動作するようになります

インストールまで

元記事:http://nawokima.blog115.fc2.com/blog-entry-52.html
メモ書きと言っておきながら初心者向け説明であったりなかったり。
こんなかんじでうちのWPはPDO版で稼働しております。

さ○らのレンタルサーバーラ○トでWordPressを動かすまとめ

さ○らのレンタルサーバーラ○トではPHPとMySQLに対応していないため、これを利用しているWordPressは本来動きません。
ただし、PHPは自分でインストールするという抜け道があり、MySQLはSQLiteで代替出来るため、手段を踏めば動くようになります。

0.準備

  • ファイルマネージャーでは5MB以上のファイルがアップロード出来ないため、FFFTP等のアップロードソフト必須。
  • TeraPadなり秀丸なりの、少し高度なテキストエディタ必須。
  • 拡張子表示をオン (FFFTPで拡張子を変更してアップロードできるため必須ではない)

FTPの接続設定はここを参照。それ以外は特に設定不要。
なお、この段階で理解が追いついていない場合は、素直に無料ブログサービスを利用するといいかも。

1.PHPをインストールする

アライグマ道場の記事→http://mameflag.blog89.fc2.com/blog-entry-324.html
こちらを参考にPHPをインストールします。
元記事はここなのですが、上記の記事の方が分かりやすくかつ安全で、しかも比較的新しいPHPのバージョンの情報なのでおすすめです。

自分はあれこれ試すのがイヤなのでPHP5.2.6で行いましたが、PHP5.2.11でも大丈夫かと思われます。

1.1.telnet.cgiの補足

1.telnet.cgiをブラウザで表示し(http://(アカウント).sakura.ne.jp/telnet.cgi)、
入力欄に以下のコマンドを入力して「/home/(アカウント)/work」へ移動します。
「pwd」のコマンドで、現在いるディレクトリを確認できます。

cd ../work

コマンドプロンプト未経験者には取っつきにくかと思われますが。

「cd」というのはディレクトリ(Windowsで言うフォルダ)を移動するコマンドです。
たとえばC:\Windows\というディレクトリにいたとして、「cd ../」というコマンドを入力するとC:\に移動し、さらに「cd a」と入力するC:\a\に移動します。よってC:\Windows\から「cd ../a」と入力すると、C:\a\に移動するという仕組みです。

telnet.cgiを開いたとき、現在のディレクトリは「/home/(アカウント)/」になっているはずなので、上の記事のように入力すれば確実に「/home/(アカウント)/work」へ移動出来ます。
途中で間違えてしまって、自分がどこのディレクトリにいるかわからなくなったら、「pwd」というコマンドで現在のディレクトリを確認してください。

(中級者向け補足) telnet.cgiは何も改変しなくて大丈夫です。1行目もそのままでOK。(参考)

1.2.インストール時間について補足

サーバーの負荷状況にもよりますが、PHPの解凍や「sh conf.sh」は数秒、「setenv PHP_PEAR_CACHE_DIR /home/(アカウント)/php5/pear/cache;」→「make」のところで5分程度かかりました。

1.3.その他、細かいこと

頻出事項ですが、「.htaccess」というファイルをOS上で作ることが出来ないので、「htaccess.txt」などのファイルで作成し、FFFTPでアップロードするときに「名前を変えてアップロード」して下さい。(ファイル右クリック)

フォルダ構造は間違えやすいので気をつけましょう。作業中は「/home/(アカウント)/www/」ではなく「/home/(アカウント)/」にフォルダを作ることが多いです。デフォルトは「/home/(アカウント)/www/」になっていることが多いので確認して下さい。

なお、重要なのでこちらでも書きますが、作業終了後にtelnet.cgiは必ず消すようにして下さい。

2.PDO (SQLite) For Wordpressをインストールする

整頓中(仮)の記事→http://www.retropc.net/mm/archives/13
こちらを参考に、SQLiteに対応したWordPressをインストールします。

特にさ○らに合わせて設定する必要はないので、

ブラウザから、インストール設定画面を開きます。こんなURLです→http://www.xxxxx.xxx/WordPress/wp-admin/install.php

のところまではそのまま進めてOKですが、

ここで問題が起きて、まず、真っ白な画面が出てきます。こりずにブラウザ更新すると、「ようこそ」の画面が出てくるのですが、WordPressをインストールのボタンを押すとSQLのエラーが表示されます。

…は自分の環境(WindowsXP Firefox3.5.7)では発生しませんでした。(4回中4回)
普通にインストールが完了するので、それ以降の説明に関しては不要です。
たぶんバージョンかなんかの違いで、不具合が改善されたのかも知れません。

ただし記事の一番下で書かれている、WordPressをインストールしたフォルダのアクセス権を755に戻しておくことを忘れないようにして下さい。

3.お疲れ様でした

以上でとりあえずWordPressが動きました。だいたい所要時間15分ぐらいですかね。
記事元の方々に感謝せずにはいられません。

細かい修正は以降の記事に続きます。

Home

カテゴリー
タグクラウド
アーカイブ
RSS トラたま袋の新着
フィード

Return to page top