ブログの更新と今後のHPのお話

Pocket

告知関係

ここ数日でBlogのほうを色々変更しました。すぐに分かる目立って大きな変更はロゴの変更でしょうか。実は何作品か前からCDのロゴは変わっていたのですがHP作業のほうが全く手付かずだったのであまり存在感はありませんでしたが、ようやくHPでも正式に変更になりました。古いものは自作だったのですが新しい物はヨコヤマ先生に依頼して作ってもらいました。やっぱりロゴデザインは専門家がいいですね。ありがとうございました。

cropped-ik_new_icon.png

あとは右側のサイドバーの機能を今時っぽい感じの機能に変更とかテーマを新しいVerに更新とか細かい変更は色々とやっています。ですがこれはまだ始まりでしかありません。本家HPのトップにも書いていますが旧ホームページ機能はこれから全てWordPressに移行してしまい、いままであったディスコグラフィー等もWordPressをメインにしたいです。(古い作品は作りなおさず旧ページヘのリンクにしますけれども)

とにかく旧HPは古くなってしまいました。たとえばトップに自前のFlashメニュー↓を使用していて設立当時としては先進的だったのですが、現在となってはスマホからのアクセスも悪くなりました。

base_wp3

トップの中身もhtmlをアップするだけで自動で表示されるようにしてありますがいちいちFTP使わないといけなかったりタグ打ちしないとダメ等、メンテナンスの面倒さや更新の手間、自作PHPなので致命的なセキュリティ問題とか内部デザインの古さがもう限界に来ています。ですのでもうディスコグラフィーを除いてすべて表舞台から撤退してもらいます。実は大分前からほとんどの機能をこちらのWordPressへ統合する形に持っていきたいと思っていましたが、ここに来てようやくオーディオが少し落ち着いてこっちに気力を回せるようになったので現在作業中です。

そのうちトップページもメインHPらしくリニューアルして、現状のBlogだけではなくて専用ページで作られたトップページとしたいです。あとはディスコグラフィーの見出しページ追加や通販サイト作ったり、オーディオ関係ページとの親和性を上げたりと、このへんはどこまで出来るかわかりませんが検討中です。

あとGoogleのアドセンスが追加されてて邪魔かと思うのですが、しばらく内容をチェックしてみてダメそうなら消すと思います。最初に考えていたイメージと違うので。こちらとしては大したページじゃないしめったに更新しないですからアフィリエイトとか本格的にやるつもりはないです。たとえばおすすめ品の紹介など無理のない内容だったらやってもいいかなって程度です。

更新で苦労したこと、備忘録

ここからはWordPress関係の話を書きたいと思います。結構ソースいじったりしないと思ったような機能を実現できず、しかも以前作業してから相当時間が立っていて殆どサイドバー追加の方法を忘れてしまっていて無駄に苦労したのでメモです。

サイドバーを追加する方法

調べてみたところWordpressではテーマにサイドバーがあったとして、それを自由に増やしたりするのは簡単には出来ないようです。色々融通が効くように見えて意外とこういうところはまだまだなのだと思うところです。

例えばうちの場合だとメインのBlogとオーディオ関係ページではニーズも客層も全然違うのでどうしても別のサイドバーを使いたいというニーズがありました。そこで以前のテーマでもソースを弄って無理やり追加していたのですが、新しいVerにしたらソースの構造が大幅に変わってしまっていて変更に結構苦労しましたので、将来のために変更した内容を記録しておきたいと思います。

まず使っているテーマは BASE WPっていうものです。Verは1.3.4のフリー版です。他のテーマではぜんぜん違う構造になっていて参考になるのわかりませんがこちらで行った方法は次のとおりです。

1.幾つかのファイルの中身を書き換えします

\themes\base-wp\core-framework\func\function-widget.php

<?php
/*-----------------------------------------------
 * Footer widgets
 -----------------------------------------------*/
function boxed_wp_widgets_init() {
    register_sidebar( array(
        'name'          => __( 'Sidebar', 'base-wp' ),
        'id'            => 'sidebar-main',
        'description'   => __( 'The main widget area', 'base-wp' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget'  => '</aside>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ) );

//ここが追加する部分
    register_sidebar( array(
        'name'          => __( 'Sidebar sub1', 'base-wp' ),
        'id'            => 'sidebar-sub1',
        'description'   => __( 'The sub widget area 1', 'base-wp' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget'  => '</aside>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ) );
    register_sidebar( array(
        'name'          => __( 'Sidebar sub2', 'base-wp' ),
        'id'            => 'sidebar-sub2',
        'description'   => __( 'The sub widget area 2', 'base-wp' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget'  => '</aside>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ) );
    register_sidebar( array(
        'name'          => __( 'Sidebar sub3', 'base-wp' ),
        'id'            => 'sidebar-sub3',
        'description'   => __( 'The sub widget area 3', 'base-wp' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget'  => '</aside>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ) );
//ここまで

\themes\base-wp\core-framework\func\function-action.php

/*-----------------------------------------------
# CONTENT GRID
 -----------------------------------------------*/
//main grid
function igthemes_grid_before() {
    
   if (!is_singular() || 
       is_singular() && !is_page()) { 
       $col="col8"; 
   }
   if (is_page_template('page-fullwidth.php')) { 
       $col="col12"; 
   }
   if (is_page_template('page-sidebar-left.php')) { 
       $col="col8 pull-right";
   }
   //ここが追加する部分
   if (is_page_template('page-sub1.php') ||
   is_page_template('page-sub2.php') ||
   is_page_template('page-sub3.php')) { 
       $col="col8"; 
   }
   //ここまで
   if (is_page() && !is_page_template()) { 
       $col="col8";
   }//end normal layout
   if (class_exists( 'WooCommerce')) { 
        if (is_woocommerce()) { 
            $colshop="col8"; 
        }
   }//end ecommerce layout
   if (class_exists( 'WooCommerce') && is_woocommerce()) { 
        echo "<div class='".$colshop."'>";
   } else { 
        echo "<div class='".$col."'>";
   }//end div
}
add_action( 'igthemes_before_site_content' , 'igthemes_grid_before' );

function igthemes_grid_after() {
        echo "</div>";
}
add_action( 'igthemes_after_site_content' , 'igthemes_grid_after' );

//sidebar grid
function igthemes_sidebar_grid_before() { 
   if (!is_singular() || 
       is_singular() && !is_page()) { 
       $col="col4"; 
   }
   if (is_page_template('page-sidebar-left.php')) { 
       $col="col4 pull-left";
   }   
   //ここが追加する部分
   if (is_page_template('page-sub1.php') ||
   is_page_template('page-sub2.php') ||
   is_page_template('page-sub3.php')) { 
       $col="col4"; 
   }
   //ここまで
   if (is_page() && !is_page_template('')) { 
       $col="col4";
   }//end normal layout
   if (class_exists( 'WooCommerce')) { 
        if (is_woocommerce()) { 
            $colshop="col4"; 
        }
   }//end ecommerce layout
   if (class_exists( 'WooCommerce') && is_woocommerce()) { 
        echo "<div class='".$colshop."'>";
   } else { 
        echo "<div class='".$col."'>";
   }//end div
}
add_action( 'igthemes_before_sidebar' , 'igthemes_sidebar_grid_before' );

function igthemes_sidebar_grid_after() { 
     echo "</div>";
 }
add_action( 'igthemes_after_sidebar' , 'igthemes_sidebar_grid_after' );

/*-----------------------------------------------
# SIDEBAR
 -----------------------------------------------*/
function igthemes_get_sidebar() {
?>
    <?php 
    if (class_exists( 'WooCommerce') && is_woocommerce() ||
        class_exists( 'WooCommerce') && is_cart() && !is_page_template('page-fullwidth.php') ||
        class_exists( 'WooCommerce') && is_checkout() && !is_page_template('page-fullwidth.php')) { 
            get_sidebar('shop'); 
    } elseif ( is_page() && !is_page_template('page-fullwidth.php') ||
            is_singular() && !is_singular( 'product' ) && !is_page())  {
            
            //ここが追加する部分
            if ( is_page_template('page-sub1.php')) {
            get_sidebar('sub1');
            } elseif ( is_page_template('page-sub2.php')) {
            get_sidebar('sub2');
            } elseif ( is_page_template('page-sub3.php')) {
            get_sidebar('sub3');
            } else
            //ここまで
            get_sidebar();
    } 

    if  (!is_singular()) {
        if (class_exists( 'WooCommerce') && !is_woocommerce()) {
            get_sidebar(); 
        }  elseif (!class_exists( 'WooCommerce')) {
            get_sidebar();
        }
    }

?>
<?php }
add_action( 'igthemes_after_site_content' , 'igthemes_get_sidebar' );

2.ファイルをいくつか追加する

base_wp1

page-sub1~3.phpsidebar-sub1~3.phpが追加したファイルです。中身はpage-sub1~3.phpはpage.phpと全く同じ、sidebar-sub1~3.phpはsidebar.phpのなかの’sidebar-main’と定義されている部分を、上のプログラムの変更と合わせて’sidebar-sub1’、’sidebar-sub2’、’sidebar-sub3’、などに変更すればOKです。

たしかこれだけでサイドバーが追加できたと思います。一度追加してしまえばあとは下記のようにウィジェット画面からサイドバーの中身を変更することが出来るようになります。そして固定ページを作るときにどれか選択すればOKです。

base_wp2

Subscribe
Notify of
guest

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

1 Comment
Inline Feedbacks
View all comments
larjis
5 years ago

RT @_yohine: ブログの更新と今後のHPのお話: 告知関係
ここ数日でBlogのほうを色々変更しました。すぐに分かる目立って大きな変更はロゴの変更でしょうか。実は何作品か前からCDのロゴは変わっていたの… https://t.co/vGbA2VyTrJ