【wordpress】buddypressでの子テーマの作リ方
先日BuddyPressのインストール方法をお伝えしましたが、インストールしたままテーマを変えていなければ普通のブログと見た目が変わらない感じになっていると思います。
やはりそれではSNSとしては味気ないので、今回はSNSっぽくデザイン(テーマ)を変えてみます。
そこで必要になるのが「子テーマ」です。
WordPressではテーマをカスタマイズできるのですが、登録されているテーマを直接カスタマイズしてしまうと、その後のアップデート等に対応できなくなってしまいます。
カスタマイズする際はまず既存のテーマから「子テーマ」を作り、その子テーマをカスタマイズしていくようなやり方が望ましいのです。
それでは早速子テーマを作ってみましょう。
1.BuddyPressのテーマを設置する
BuddyPressを入れたらテーマが反映されると思ってたら、テーマは反映されないです。
反映させるには、ちょっと手を加える必要があります。
まずサーバーにBuddyPressを配置したパスの中の
/wp-content/plugins/buddypress/bp-themes/
を見てください。
ここに設置している「bp-default」がBuddyPressのデフォルトテーマになります。
これをそのまま/wp-content/themes/にアップロードしましょう。
取りあえずBuddyPressのテーマをデフォルトで使うのであれば、これでOKです。
デフォルトテーマを有効化しましょう。
よっしゃ、さっそくこれをカスタマイズ・・・といきたいところですが、上記の理由からカスタマイズは別テーマで行います。
デフォルトテーマをカスタマイズすると、テーマがアップデートしたりメンテナンスされたりした際に、対象外になってしまいます。
それを避けるために子テーマをつくるのです。
2.ディレクトリを作る
デフォルトテーマとは別に、子テーマ用のディレクトリを用意します。
名前は何でもいいですが、分かりやすいものがいいでしょう。ここでは「buddy-child」としています。
ディレクトリの設置場所は
/wp-contents/themes/です。
パーミッションは他のテーマのディレクトリと同じ「755」です。
3.スタイルシート(CSS)を作る
ディレクトリを作ったら、その中に「style.css」というファイルを作ります。
内容は以下のように記述します。
/* Theme Name: buddy-child Template: bp-default */
この「Template」が重要です。ここで記述されたテーマ名が子テーマにとっての「親テーマ」になります。
つまり、親テーマを引き継ぐことになります。
4.テーマを有効化する
CSSができたらいったんWPの管理画面からテーマを確認してみてください。
今作ったCSSのテーマ名が反映されて「buddy-child」が追加されていると思います。
早速「有効化」しましょう。
5.親テーマのCSSを読み込む
ここまでできてフロント画面を見てみると、あれ?と思うこととなります。
CSSが効いておらず、プレーンなHTMLとして表示されています。
これは、上記2.で作ったCSSが効いているため起こることです。
あわてずに親テーマをインポートしましょう。
/* Theme Name: Child Template: bp-default */ @import url('../bp-default/style.css');
ここまでできればカスタマイズ準備完了です。
カスタマイズしたい部分に手を入れていきましょう。
!注意!
1.アップデートによる上書き
この方法は、親テーマがアップデートされると子テーマにもアップデートが反映される方法です。
もし親テーマのアップデートの影響を受けないようにする場合は、普通のテーマと同じように記述してください。
簡単な方法は、bp-default のディレクトリごとコピーして別名で保存する方法です。
2.function.php のカスタマイズ
上記の方法で子テーマを作った場合、function.php を編集する際に注意が必要です。
具体的に言うと子テーマのfunction.phpには同名でオーバーライド(上書き)できず、親テーマの追加という形で読み込まれる、ということです。
function.phpの内容を編集したい場合は、親テーマのfunction.phpを直接編集する必要があります。
親テーマのアップデートがあった場合など、編集した内容が失われてしまうので、注意が必要です。(バックアップ等をとっておきましょう。)
Google AD
関連記事
-
-
さくらインターネットでPEARを使ってみる
以前、自分が持っている書籍を管理するアプリ「ブックマネージャー」を作ってアップしてたのですが
-
-
【wordpress:プラグイン】会員制サイトを作るのでBuddyPressをインストールしてみた
今ちょっと温めてるアイデアがあって、それを実現させるために会員制サイトを作ろうと思います。
-
-
【いまさら?】楽天でんわ+IIJmio+SIMフリーiphone【試してみた】
先日MVNOしてIIJmioにしたとエントリーしました。 これまではdocomoを使ってい
-
-
秋葉原で自分の暗黒史ノートを電子化(PDF)してみた
暑い暑いと言ってたら、東京が梅雨入りしました。 去年より5日早いそうです。 関東甲信
-
-
年末なので2013年を振り返ってみる
クリスマスとか忘年会とか大晦日とか正月とか、この時期ゆっくりしてられないですよね。 それな
-
-
eclipseのリソース名を変更する
ちょっとキョドったのでエントリー。 1. eclipse > エクスプローラー から名前を変更
-
-
紛糾!システム構築の巻
システム作る時って、会社の縮図だと思う。いろいろな立場の人の思惑や損得が入り混じり、考えが違うために
-
-
facebookのビジョンはセマンティックか – ライフログとopen graph
facebookが開発者カンファレンス(f8)でアップデートを発表した。 「また何か機能付
-
-
ホームページ(笑)を作ればモノが売れるという幻想(笑)
まだこんな考えもってる人がいたのかwww もう「ほーむぺーじ」って言うのもやめて欲
-
-
【アフィリエイト】WordPressプラグイン「AmazonJS」をインストールしてみました
ずん飯尾という芸人さんがいます。 中でも「現実逃避シリーズ」がプチブレイクしていて、現実離
Comment
[…] 【wordpress】buddypressでの子テーマの作リ方 | world is wonderful always […]