月別: 2015年10月

wordpress テーマカスタマイズの準備

wordpress テーマカスタマイズの準備

別のマシンでも wordpress のテーマを改造していきたいので
git でテーマを取得します

使用環境は ubuntu 14.04 です
まず ssh で git clone できるようにします

ssh-keygen -t rsa -C メールアドレス

で公開鍵の作成をします

Enter file in which to save the key

とでてくるので、鍵ファイルの名前を入力します

Enter にすると、ファイル名は
id_rsa
となります

今回は github_rsa
としました

Enter passphrase (empty for no passphrase):

でパスワードを設定します

Enter same passphrase again:

でもう一回確認のため入力します

cat github_rsa.pub

でファイルの中身を見れるので、
この値をgithub の ssh key の追加画面で追加します

登録できたら
wordpress のテーマ格納ディレクトリになる themes に移動して git を使います

私の場合、 /var/www/html/wpt/
の下に wordpress を配置したので

cd /var/www/html/wpt/wordpress/wp-content/themes/

で移動します

次に git でテーマを取得します

git clone git@github.com:Snowpooll/shoptheme.git

でテーマを取得

 cd shoptheme/shoplist_theme/

で移動してファイルを編集していきます

まず、テーマ名が test になっているのを修正します

vim style.css

２行目の Theme Name: test
を
Theme Name: ShopList
にします

今回はさらにテーマの変更を反映させます

git add style.css 
git commit -m "テーマ名を test から ShopList へ変更"

で変更内容を commit

git push origin master

でgithub のソースに変更を反映させます

wordpress カテゴリIDの確認

wordpress カテゴリIDの確認

wordpress テーマが未だすべてのカテゴリで
同じ動作をするので、これをカスタマイズします

まずはカテゴリごとに表示できるようにします

これにはカテゴリIDを調べます

ダッシュボードで
投稿 > カテゴリでカテゴリを表示します

今回は試しに ubuntu カテゴリのIDを調べますので
ubuntu をクリックします

wp-c

するとURLにカテゴリIDが表示されます

wp-c2

今回の場合

http://192.168.10.248/wordpress/wp-admin/edit-tags.php?action=edit&taxonomy=category&tag_ID=2&post_type=post

ととても長いですが

&tag_ID=2
の部分が
カテゴリのIDになります

今回なら ID は 2 になります

wordpress 管理画面の https 化

wordpress 管理画面の https 化

インストールした wordpress はhttp 通信なので
安全になるように https にします

まず秘密鍵と 証明書を作ります

cd /var/tmp/

で移動し

openssl ecparam -out private.key -name prime256v1 -genkey

で鍵を作成します

この意味は
ecparam で楕円曲線アルゴリズム使用
-out private.key で鍵ファイル名を private.key

-name prime256v1 で 256bit の ECC鍵指定
-genkey で鍵作成

となります

次にCSRを作成します

 req -new -key private.key -out request.csr

意味は
-key private.key
で秘密鍵を指定しています

-out request.csr はCSRファイル名の指定です

これを実行すると対話形式で必要事項を入力していきます

Country Name (2 letter code) [XX]:

は国コードなので日本ならJP

State or Province Name (full name) []:

は都道府県名を入れます

Locality Name (eg, city) [Default City]:

は市長村名

Organization Name (eg, company) [Default Company Ltd]:

は組織名だけどサイト名でもOK

Organizational Unit Name (eg, section) []:

は組織名だけど、組織じゃないので空Enter

:

はサイト名をいれます

Email Address []:

には管理者のメルアド

A challenge password []:

はパスワード設定だけど省略可能

An optional company name []:

は、他の組織名だけど、これも省略可能

これらを実行すると、ディレクトリに
private.key
request.csr
が作成されます

これらを使い証明書の発行を行います

 openssl x509 -days 3650 -req -signkey private.key < request.csr >server.crt

これを実行すると
SSLサーバ証明書として
server.csr が作成されます

次に、証明書格納フォルダに移動します

cp private.key /etc/pki/tls/private/
cp server.crt /etc/pki/tls/certs/

次にSSL＿MODの設定をします

vim /etc/httpd/conf.d/ssl.conf

で設定ファイルを開き
93行めの

SSLProtocol all -SSLv2

を

SSLProtocol -All +TLSv1 +TLSv1.1 +TLSv1.2

に変更

９８行めの

SSLCipherSuite ALL:!ADH:!EXPORT:!SSLv2:RC4+RSA:+HIGH:+MEDIUM:+LOW

を

SSLCipherSuite ECDH+AES256:RSA+AES128:ECDH+AES128:+SHA:+SHA256:!aNULL

に変更

次にSSLサーバー証明書を変更するので
105行めの

SSLCertificateFile /etc/pki/tls/certs/localhost.crt

を

SSLCertificateFile /etc/pki/tls/certs/server.crt

に変更

秘密鍵も変更するので
１１２行めの

SSLCertificateKeyFile /etc/pki/tls/private/localhost.key

を

SSLCertificateKeyFile /etc/pki/tls/private/private.key

に変更して保存

次に wordpress 設定ファイルを編集し
管理画面へのアクセスを
HTTPSで接続を強制します

vim /var/www/html/wp-config.php

でファイルを開き
21行めに

define('FORCE_SSL_LOGIN', true);
define('FORCE_SSL_ADMIN', true);

を追記して保存します

あとは設定反映のため apache を再起動します

次にAWSのセキュリティグループの変更を行います
これをやらないとアクセスできません

AWSコンソールにログインし
EC2 を選択します

ec2

次にセキュリティグループをクリックし
現在使用しているセキュリティグループをクリックします

私の場合だと
aws_security になります

下側に詳細がでるので
インバウンドタブをクリックし、編集をクリックします

https

ルールの追加画面になるので
ルールの追加をクリックし
タイプに HTTPS を選択して保存します

https2

これで準備ができたので
wordpress の
ダッシュボードにアクセスすると警告がでてきます

これは認証局の証明書でないのが原因です

気にせず、危険性を理解した上で接続するには
をクリックし
例外を追加をクリックします

https3

そしてセキュリティ例外を承認をクリックします

https4

これで再度ダッシュボードにすることになりますが
https 接続になります

github リポジトリへファイル追加

github リポジトリへファイル追加

Github にリポジトリを作成し
REAMDME.md の編集と反映までできたので
次に このリポジトリに
wordpress のテーマをアップしてみます

まず git のローカルリポジトリにファイルをコピーします

テーマそのものは以前に作成したので
これをコピーします

cp -rp /media/bdec1869-7820-4557-a76e-a8b130293019/localdev/shoplist_theme/ .

次に git に追加したファイルをインデックスに登録するため
git add を実行します

git add -A

これで、変更と新規作成したファイルをリポジトリに登録します

git add のオプションについては
git add 使い方

Gitコマンドメモ

を参考にさせていただきました

そして最後に メッセージをつけて commit します

git commit -m "wordpress テーマ追加"

そして push をすることで反映させます

ちなみに、push しないと現在のままです
wp-pull

ちなみに ubuntu 側でもリポジトリを
https で設定していたため

git remote set-url origin git@github.com:Snowpooll/shoptheme.git

で ssh 接続にかえます

そして git push することで反映させます

git push origin master

これで、内容が更新され
新しくソースコードが追加されます

wp-pull2

wp-pull3

Githubから pull して最新状態に

Githubから pull して最新状態に

出先であったので、README.md の編集は
MacBookAir から行いました

返ってきたので、今回の編集の続きは
Ubuntu 12.04 で行います

まずは、前回編集したことによりより、
Ubuntu にあるものよりも
Github にあるデータのほうが新しくなっています

なので、Ubuntu 側のデータを最新版に合わせます

最新への更新には端末を起動して
git pull を行います

まず

 cd /media/bdec1869-7820-4557-a76e-a8b130293019/github/shoptheme/

でリポジトリのあるディレクトリに移動します

リポジトリのないディレクトリにで
git pull しても設定ファイルの .git がないため
エラーになります

ちなみに、現在のUbuntu 側のファイルは

# shoptheme
wordpress theme

です

これを最新にするには

git pull origin master

を実行します

すると

remote: Counting objects: 3, done.
remote: Compressing objects: 100% (2/2), done.
remote: Total 3 (delta 0), reused 3 (delta 0), pack-reused 0
Unpacking objects: 100% (3/3), done.
From https://github.com/Snowpooll/shoptheme
 * branch            master     -> FETCH_HEAD
   754dc93..30d9983  master     -> origin/master
Updating 754dc93..30d9983
Fast-forward
 README.md | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

となり設定が反映されます

これで

cat README.md

で中身を確認すると

# shoptheme　
wordpress themeのリポジトリになります

---

## メンバー
* snowpool

## ファイル構成

## リリース方法

というように変更されているのが確認できます

なお、
変更箇所についてはgithub からでも確認できます

Github リポジトリのファイル名の右にある
コミットしたときのメッセージをクリックします

pull

すると、ドットインストールのソースをみたときのように
変更前のソースがピンク色
変更後のソースが水色で表示されているので
変更点をみることができます

pull2

readme の編集

readme の編集

github のreadme は　markdown 形式で記述

これはatom で編集する

http://qiita.com/Qiita/items/c686397e4a0f4f11683d

を参考に

記法は

#がh1などの見出し

*でリスト

―

で水平線

なお、文書との間に半角スペースをいれること

現在のソースは

# shoptheme

wordpress theme

これを編集して保存

内容は

 shoptheme　

wordpress themeのリポジトリになります


---


## メンバー

* snowpool


## ファイル構成


## リリース方法

としてみた

次に状態の確認

cd shoptheme/

でgit リポジトリディレクトリに移動してから

 git status

そうしないと

fatal: Not a git repository (or any of the parent directories): .git

となる

これは設定ファイル関連の .git が存在しないから

実行すると

On branch master

Your branch is up-to-date with 'origin/master'.


Changes not staged for commit:

  (use "git add <file>..." to update what will be committed)

  (use "git checkout -- <file>..." to discard changes in working directory)


modified:   README.md



no changes added to commit (use "git add" and/or "git commit -a”)

となる

ちなみに source Tree を使っていると

dotinstall みたいに差分がわかる

ちなみに git には３段階あり

作業中の　作業ディレクトリ

確認中の　ステージングエリア

出荷前の　git ディレクトリ

となっている

とりあえず編集したら

これを確認のためのステージングエリアにする

これは

git add filepattern

ってあるけど

実際には

git add ファイル名のこと

なので

git add README.md

となる

これで git status で確認すると

On branch master

Your branch is up-to-date with 'origin/master'.


Changes to be committed:

  (use "git reset HEAD <file>..." to unstage)


modified:   README.md

となれば成功

source tree でも indexにステージしたファイルに変わっているのが

わかる

ここまでできたらファイル内容の変更を反映する

commit を実行する

git commit -m "README.md に内容を追記"

ここまでは ok

次に 

git push origin master

を押すと

なぜかユーザ名とパスワードを聞かれ

エラーになる

原因を調べた結果


[Git] GitHub: SSH鍵認証しているはずなのにパスワードを求められるを解決する方法

によれば

最初にコピーした url が https での url だっただめ

これを修正するために

ssh のほうをコピーして

git remote set-url origin git@github.com:Snowpooll/shoptheme.git

を実行し

git push origin master

を実行したら成功した

ファイルを編集したら

add

commit

push

と覚えておくといいかも

SourceTreeでclone

SourceTreeでclone

まずgithub でリポジトリのclonr 用のurlコピー

sourcetree でファイル> 新規 > 新規/クローンを作成

を選択

リポジトリの追加方法を聞かれるので

clone from url

を選択

ってあるけど日本語化されているので

url からクローンを選択

ソースurl には clone したいリポジトリのurl をいれる

保存先のパスは自動で入力される

これでclone され

ディレクトリに README が作成される

これで次にREADME を編集する

これは

Markdown 形式で行う

macで github

macで github

SourceTree を起動して

次に端末起動

ls -al ~/.ssh/

で鍵確認

ssh-keygen -t rsa -C snowpoollovely@gmail.com

で鍵作成

このとき鍵のパスワードを入れます

次に github へログイン

画面右上の＋の横からSettings を選択

次に

SSH Keys をクリックし

ADD SSH Keys

をクリックし

title には mac

key には鍵をコピーする

コピーの仕方は

公開鍵の内容をクリップボードへコピーすればOK

pbcopy < ~/.ssh/id_rsa.pub

でクリップボードにコピーできるので

貼り付け

あとはadd key をクリックすれば成功

次に、端末から登録できたかテストする

端末から

ssh -T git@github.com

を実行し

yes

を入力したら

作成した　ssh key のパスワードを入力を

求められるので

これを入力して

Hi Snowpooll! You've successfully authenticated, but GitHub does not provide shell access.

とでれば成功

github へ端末から clone

github へ端末から clone

Windows Mac の場合は
GUIで操作するツールが多いけど

Ubuntu の場合はあまり見つからないし
ネット回線も遅いので端末からの操作にします

まず最初に 作業用のディレクトリを作成し
移動します

mkdir github
cd github

次に github のリポジトリを clone します

このときに作成したリポジトリの画面で
URL を調べておきます

ちなみに、URLの横のアイコンをクリックすると
簡単にコピーできるので便利です

clone

URLがわかったら git コマンドで clone します

git clone https://github.com/Snowpooll/shoptheme.git

これで
clone ができました

作業ディレクトリの中には
shoptheme
というフォルダができていて
中身は
README.md
が入っています

clone2

しかし、実際には .git というフォルダに
隠しファイルが多々入っていて
git でバージョン管理するための情報が
このディレクトリにはかくされています

 ls -la shoptheme/.git/

というように ls コマンドに -a オプションをつけ
確認すると、以下のようにたくさんのファイルが確認できます

合計 52
drwxrwxr-x 8 snowpool snowpool 4096 10月 11 08:47 .
drwxrwxr-x 3 snowpool snowpool 4096 10月 11 08:47 ..
-rw-rw-r-- 1 snowpool snowpool   23 10月 11 08:47 HEAD
drwxrwxr-x 2 snowpool snowpool 4096 10月 11 08:47 branches
-rw-rw-r-- 1 snowpool snowpool  267 10月 11 08:47 config
-rw-rw-r-- 1 snowpool snowpool   73 10月 11 08:47 description
drwxrwxr-x 2 snowpool snowpool 4096 10月 11 08:47 hooks
-rw-rw-r-- 1 snowpool snowpool  104 10月 11 08:47 index
drwxrwxr-x 2 snowpool snowpool 4096 10月 11 08:47 info
drwxrwxr-x 3 snowpool snowpool 4096 10月 11 08:47 logs
drwxrwxr-x 7 snowpool snowpool 4096 10月 11 08:47 objects
-rw-rw-r-- 1 snowpool snowpool  107 10月 11 08:47 packed-refs
drwxrwxr-x 5 snowpool snowpool 4096 10月 11 08:47 refs

lsコマンドの詳細については
【 ls 】 ファイルやディレクトリの情報を表示する

を参考に

github にリポジトリ追加

github にリポジトリ追加

Ubuntu 12.04 で gitHub利用

でgithub の登録

そして
GitHub についてと SSH key の設定

で設定をしたので

今回は github でリポジトリを作成します

まず
https://github.com/
から Sign in します

gihub

画面右上の＋アイコンをクリックし
New repository
をクリックします

repo2

すると repository 作成画面になるので
Repository name
には　リポジトリ名
今回は shoptheme　とします

Description (optional)
にはリポジトリについての説明
今回は wordpress theme とします

種類は publc と Private がありますが
公開するなら Public
非公開なら Private を選択します
ちなみに Private モードは有料になります

料金については
Plans and pricing

を参考に

私の場合は、公開で使う予定なので
Private にします

そして
Initialize this repository with a README
にチェックをいれて
Readme を作成します

repo3

最後に Create Repository
をクリックすると
リポジトリが作成されます

repo4

なお、大規模組織で使う場合や
完全に社外に非公開
という場合には Github Enterprise があります

こちらはさすがに使う予定がないのですが
機会があれば使ってみようと思います