SourceTreeとBitbucketを使ってWordPressテーマをバージョン管理

できるコーダーはバージョン管理をしよう

WordPressでサイトを制作するとき、他の人と共同で制作したり、別の端末で作業したりするとき、ファイルを共有できたら快適ですよね。
また、一度修正したのに、「前の方が良かった」と言われて、ファイルを元に戻しさなきゃならないってとき、SourceTreeやBitbucktを使ってバージョン管理すると便利です。
これはそんな管理ツールの環境構築のメモです。

そもそもバージョン管理ってなんだ？という人はこちらをご参照ください。
WEB制作にもつかえるバージョン管理ツール

はじめに

ここではWindowsローカル環境で、Wordpressを以下のように構築（xampp利用の場合）したとします。
/xampp/htdocs/[サイト名]/wp-content/themes/[テーマ名]/

SourceTreeをインストール

以下からダウンロードして、インストールしてください。
SourceTree公式

Bitbucketのアカウント作成

以下のページでアカウントを作成しておいてください。
BitBucket公式

SourceTreeを設定する

１．SourceTreeを起動して「新規/クローンを作成する」

２．「リポジトリを作成」タブを選ぶ。

リポジトリタイプ「Git」にして、保存先のパスは構築したwordpressのテーマフォルダを選択。

リポジトリをブックマークは任意で。デフォルトのままで構いません。

「作成」を押せば、バージョン管理の始まりです。これだけ。簡単です。

Bitbucketと連携

「他の人と共同で制作したい」という場合、SourceTreeで管理しているものをBitBucketで共有できます。
まずはBitbucketへログインしましょう。

１．「チーム」の作成、または「チーム」を選ぶ

チームを作成、または既にチームがある場合は共同作業したいチームを選びます。

２．リポジトリの作成

利用したいリポジトリがない場合は「作成」->「リポジトリの作成」
アクセスレベルは一般公開したくない場合は「非公開リポジトリ」で、リポジトリタイプは「Git」を選んで「リポジトリの作成」を押します。

３．SourceTreeからソースを手に入れる

Bitbucketは用意できましたが、このままでは共有するファイルがありません。
どうせならSourceTreeで管理しているファイルをそのまま使いたいですよね。

SourceTreeを起動して、連携したいリポジトリを開いて、メニューから「リポジトリ」->「リモートを追加」を選択します。

「リモート」タブを選んで、「追加」を選択してください。

リモートの詳細設定を入力します。
・リモート名 – 任意（分かりやすいように「Bitbucket」としておきます）。
・URL/パス – bitbucketのリポジトリURL　http://bitbucket.org/[ユーザー名またはチーム名]/[リポジトリ名]
・ホストタイプ – Bitbucket
・ユーザー名 – Bitbucketのリポジトリを作ったユーザー名またはチーム名

これで、BitbucketとSourceTreeが連携できました。

SourceTreeからBitbucketへファイルをプッシュしてみる

管理したいファイルにチェックを入れて、メッセージを入力。なんのために修正したのか他の人が見て分かりやすい文言を入れてください。
「変更をすぐプッシュする」にチェックをれて、「コミット」を押します。

Bitbucketへアクセスしてみると、プッシュしたファイルが登録されているはずです。

ちなみにプッシュはコミットと同時でなくても、メニューから別々に行うこともできます。

まとめ

Bitbucketを他のチームメンバーと共有すれば、自分のローカル環境で作成したSourceTree上のファイルを他の人たちも参照することができます。
また、プッシュとは逆に「プル」をすれば、Bitbucket上のファイルをSourceTreeの方へ引っ張ってくることもできます。
バージョン管理というと、プログラマーが使うようなイメージでWEBデザイナーには敷居が高い気がしますが、クラウドソーシングなど外部との共同開発や引継ぎをしなくてはならないとき、こうしたツールが使えるとスムーズではないでしょうか。

バージョン管理（Git）やSourceTree、Bitbucketの使い方についてもう少し詳しく知りたい方は、この書籍が非プログラマーの人にも分かりやすくておススメです。

Tweet