Cyberduckの使い方|WordPressの子テーマを分かりやすく解説

当記事では、FTPソフトCyberduckについて以下を解説しています。
- Cyberduckの操作方法
- WordPress子テーマの使い方
- 子テーマの自作方法
Cyberduckは、Macユーザーなら一番使いやすいFTPソフトかなぁと思います。
Cyberduckのダウンロード方法
まずは「Cyberduckをダウンロード」

ダウンロードしたら、インストールして起動しておきましょう。
※.ログイン手順は後ほど解説。
続いてWordPressの子テーマをダウンロードします。
WordPress子テーマのダウンロード方法

最近の有料テーマであれば、だいたい購入画面に子テーマファイルも用意してくれています。
上記は当サイトテーマSWELLの場合です。
zipファイルをダウンロード後、解凍はせず、ファイル名も変更しないでください。
子テーマのアップロード方法

管理画面の外観→テーマをクリック
新しいテーマを追加をクリック

テーマのアップロードをクリック

先ほどダウンロードした子テーマをドラッグ&ドロップ
もしくはファイルを選択から開くをクリックしてください。

今すぐインストールをクリック

テーマのインストール完了を確認

もう一度、外観→テーマをクリックし、子テーマが表示されていれば完了です。
Cyberduckの使い方
新規接続方法

新規接続をクリック
FTP-SSLを選択
サーバ、ユーザー名、パスワードを入力
接続をクリック

「エックスサーバー」の方はこちらから確認「XサーバーFTPソフトの設定」
「ConoHa WING」の方はこちらから確認「ご利用ガイドFTPソフトを設定する」
メールを削除してしまった場合、mixhost
は以下の手順で確認できます。
メールを確認する

cPanelにログインしていただき、メール履歴をクリック。

サーバーアカウント設定完了のお知らせの中にFTP接続情報が記載されています。
連続してログインに失敗したときの対処法

サイバーダックは何度かログインに失敗するとロックがかかります。
一度この状態になると、24時間接続できません。
最後のログイン失敗から24時間経過する必要があるため、その前になんどもログイン失敗を繰り返すと永遠にログインできないため注意しましょう。
ファイルやフォルダのダウンロード方法
ログイン後は、以下の手順でフォルダの階層を展開してください。

①public_html
②ドメイン名のフォルダ
③wp-content
④themes
⑤親テーマと子テーマフォルダを確認

あとは親テーマを展開し、必要なファイルをダウンロードしましょう。
ダウンロード方法は、①デスクトップなどにドラッグ&ドロップでも、②右クリックメニューからダウンロードを選択でも可能です。
ファイルやフォルダのアップロード方法


一旦親テーマの展開は閉じておきましょう。
アップロードもダウンロードと同じ方法で可能ですが、マウス操作だと入れる階層を間違える場合もあるため、右クリックでアップロード操作をすることを推奨します。
これで子テーマにheader.phpファイルが追加されました。
接続先をブックマークする方法
一度接続したサーバーはブックマークに登録しておきましょう。
次回はブックマークから選択すれば接続できます。

①ブックマークアイコンをクリック
②+ボタンをクリック
③接続したサーバーが表示されたらクリック

フォルダ選択から/public_htmlをクリックすると、すべてのファイルが表示されます。
先ほどのファイル操作を参考に操作してください。
※対象テーマへの接続履歴もありますので、そちらを選択してもOKです。
証明書の信頼性検証中にエラーは無視してOK

Cyberduck接続時、上記のような警告が出ましたら、証明書を表示をクリックしてください。
これはどのレンタルサーバーでもFTPソフトでも出てくるものなので心配いりません。
セキュリティのため、新しいまたは更新された証明書は一旦エラーとして吐き出す仕組みになっています。

①にチェック
②続けるをクリック

パソコンのログインパスワードを入力すれば、しばらく出てこなくなります。
カゲオこれだけ覚えておけば、ファイル操作が必要なカスタマイズも問題ないでしょう
Cyberduckで子テーマを自作する方法
親テーマ側に子テーマの用意がない場合は、自分で用意する必要があります。
子テーマ用フォルダ作成


デスクトップで右クリック→新規フォルダをクリック
フォルダ名は「親テーマ名-child」などわかりやすいものにしておきましょう。
※.child部分は日本語でも構いません。


ファイルメニューの①親テーマから②functions.php、③style.cssを探して、作成した子テーマフォルダにドラッグ&ドロップでダウンロードします。
子テーマ用style.css作成


「style.css」ファイルの上で右クリック
①このアプリケーションで開くから②エディタツールを選択


中身を全削除して、以下を追加して保存してください。
/*
Template:親テーマフォルダ名
Theme Name:子テーマフォルダ名
*/例えば、親テーマが「kagesai」、子テーマが「kagesai-child」だった場合
/*
Template:kagesai
Theme Name:kagesai-child
*/
となります。
子テーマ用functions.php作成


style.cssと同じくエディタツールで開きます。
中身を全削除して、以下を貼り付けて保存してください。
<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style')
);
}
?>これで子テーマフォルダの完成です。
続いて、WordPressのテーマフォルダにアップロードしましょう。
子テーマをWordPressにアップロード


子テーマフォルダの上で右クリック
圧縮してzip形式にします。
やり方は、先ほどの子テーマアップロード方法を参考にしてください。


無事子テーマがアップロードされていれば完了です。
結論:WordPressのMacユーザーならCyberduckがおすすめ
以上、CyberduckとWordPressの子テーマについて解説しました。
まったくカスタムしないのであれば、親テーマだけで構いません。
サイトを自由にイジりたい中級者以上の方は、子テーマとFTPソフトの使い方は覚えておきましょう。


記事への質問等はこちらからどうぞ