038

2014.01.21

buddypressカスタマイズ手帳5:サイドバーを追加して3カラム構成のテーマにする。

このエントリーをはてなブックマークに追加

 buddypress設置時のデフォルト「bp-default」では2カラム構成になっています。

これを、buddypressカスタマイズ手帳3で作成した子テーマをいじって、

左右にサイドバーをレイアウトした3カラムのデザインに変えてみます。

基本的にはwordpressでサイト構築する時と要領は一緒ですが、

呼び出しコードに、ちょっとした注意点があります。

3カラム

 

 まずは「sidebar-right.php」を新たに作ります。

  基本的に「sidebar.php」からコピペしながらつくるといいと思います。

  ざっくりとこんな感じです。

 

 呼び出したいページ、例えば「index.php」「activity/index.php」

  「groups/index.php」などなど、

  表示させるページに呼び出しコードを記述します。

wordpressでよく使う<?php include(‘sidebar-right.php’); ?>といった呼び出しコードは

buddypress仕様の「activity/index.php」などでは効かないので、

<?php get_sidebar(‘right’); ?>と記述します。

ファイル名が「sidebar-right.php」なら、カッコ内は’right’となります。

※wordpress仕様のページは<?php include(‘sidebar-right.php’); ?>でも大丈夫ですよ。

 

 CSSで、左サイドバーと中央コンテンツをfloat: left。

  右サイドバーをfloat: right;にすれば無事3カラムデザインになります。

まとめ

注意する点としては、もうひとつのサイドバーを呼び出す際に

<?php get_sidebar(‘right’); ?>を頭に入れておくことくらいです。

サイドバーを追加すると、ウィジェットも追加したくなると思います。

それはまた、あらためて別の「buddypressカスタマイズ手帳」で書きたいと思います。

 

 

デモサイト;buddypressのおしゃべりをたのしむソーシャル・ネットワーク[buddy waiwai]

ユーザー登録テストや投稿テストなどの使い勝手をお確かめいただけます。
登録後は、buddyなコミュニティとしてつながりましょ。(^_^)

 

 

  • アーカイブ

このエントリーをはてなブックマークに追加