MENU

運営中のサブブログ

主に私のデスク周りアイテムを紹介しています。
在宅作業の参考になるかもしれません。

マンニメバナー画像

趣味の1つ漫画アニメについて書いています。
鬼滅のレビューはコメント600件以上きました。

カゲオ
サイト管理人
当ブログはWordPressが今より楽しく、便利になるをテーマに分かりやすい解説記事を心がけています。
サブブログ|デスク環境構築サイト運営中⇒見てみる

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

当ページのリンクには広告が含まれています。
Cyberduckの使い方

当記事では、FTPソフトCyberduckについて以下を解説しています。

  • Cyberduckの操作方法
  • WordPress子テーマの使い方
  • 子テーマの自作方法

Cyberduckは、Macユーザーなら一番使いやすいFTPソフトかなぁと思います。

管理人のデスク環境ブログも運営中です

在宅作業の参考になるアイテムがあるかもしれません。
デスク周りのアップデートを検討されている方はぜひ覗いてみてください。

目次

管理人のデスク環境ブログも運営中です

在宅作業の参考になるアイテムがあるかもしれません。
デスク周りのアップデートを検討されている方はぜひ覗いてみてください。

Cyberduckサイバーダックのダウンロード方法

まずは「Cyberduckをダウンロード

上記公式サイトからだと無料でダウンロードできますが、Apple StoreやMicrosoft Storeですと、有料なので注意。

cyberduck2ダウンロード画面

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

WordPress子テーマのダウンロード方法

SWELL子テーマダウンロード方法

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

子テーマの自作方法は、サイバーダックを使うため後ほど解説します。

子テーマのアップロード方法

WordPress新しいテーマ追加方法

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

WordPress新しいテーマのアップロード

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

WordPress新しいテーマのファイルを選択

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

WordPress新しいテーマファイルをインストール

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

WordPress新しいテーマファイルのインストール完了

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

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

もう一度、外観→テーマをクリックし、子テーマが表示されていれば完了です。

Cyberduckサイバーダックの使い方

新規接続方法

Cyberduck新規接続

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

サーバ〜パスワード情報は、当サイトで使用しているレンタルサーバー
であれば、以下のように登録した際のメールに記載されています。
※.サーバー=ホスト名です。

MixHost-FTP接続情報
MixHost-FTP接続情報

エックスサーバー」の方はこちらから確認「XサーバーFTPソフトの設定

ConoHa WING」の方はこちらから確認「ご利用ガイドFTPソフトを設定する

メールを削除してしまった場合、は以下の手順で確認できます。

メールを確認する
MixHostメール履歴
MixHostメール履歴

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

MixHostサーバーアカウントメッセージ
MixHostサーバーアカウントメッセージ

サーバーアカウント設定完了のお知らせの中にFTP接続情報が記載されています。

連続してログインに失敗したときの対処法

cyberduck2ログインエラー

サイバーダックは何度かログインに失敗するとロックがかかります。
一度この状態になると、24時間接続できません
最後のログイン失敗から24時間経過する必要があるため、その前になんどもログイン失敗を繰り返すと永遠にログインできないため注意しましょう。

ファイルやフォルダのダウンロード方法

ログイン後は、以下の手順でフォルダの階層を展開してください。

FTPフォルダ階層

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

Cyberduckファイルダウンロード方法

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

ダウンロードはパソコン内のダウンロードフォルダにコピーされるため、デスクトップからすぐ操作したければ、ドラッグ&ドロップの方法がおすすめです。

ファイルやフォルダのアップロード方法

Cyberduckファイルアップロード方法
Cyberduckアップロードファイル選択

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

必要なファイルやフォルダがあれば、同じように追加しましょう。
※.子テーマにもともとあるファイルは削除しないでください。

接続先をブックマークする方法

一度接続したサーバーはブックマークに登録しておきましょう。
次回はブックマークから選択すれば接続できます。

Cyberduck接続サーバーをブックマークする方法

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

Cyberduck接続フォルダ選択

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

証明書の信頼性検証中にエラーは無視してOK

Cyberduck接続証明書エラー

Cyberduck接続時、上記のような警告が出ましたら、証明書を表示をクリックしてください。

これはどのレンタルサーバーでもFTPソフトでも出てくるものなので心配いりません。
セキュリティのため、新しいまたは更新された証明書は一旦エラーとして吐き出す仕組みになっています。

Cyberduck接続証明書の信頼確認

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

Cyberduck変更許可

パソコンのログインパスワードを入力すれば、しばらく出てこなくなります。

ただレンタルサーバー側が証明書を更新すると、またエラー表示が出ます。
その場合は、もう一度上記手順を行ってください。

カゲオ

これだけ覚えておけば、ファイル操作が必要なカスタマイズも問題ないでしょう

Cyberduckサイバーダックで子テーマを自作する方法

親テーマ側に子テーマの用意がない場合は、自分で用意する必要があります。

子テーマ用フォルダ作成

WordPress子テーマフォルダ作成

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

Cyberduckファイルダウンロード

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

子テーマ用style.css作成

Macテキストエディタツール開く

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

Macであれば、テキストエディットが標準搭載されています。
普通に開いても編集できないため注意。

テキストエディタでstyle.cssファイル編集

中身を全削除して、以下を追加して保存してください。

/*
 Template:親テーマフォルダ名
Theme Name:子テーマフォルダ名
 */

例えば、親テーマが「kagesai」、子テーマが「kagesai-child」だった場合
/*
Template:kagesai
Theme Name:kagesai-child
*/
となります。

子テーマ用functions.php作成

テキストエディタで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にアップロード

Macフォルダ圧縮方法

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

WordPressの子テーマを確認

無事子テーマがアップロードされていれば完了です。

結論:WordPressのMacユーザーならCyberduckサイバーダックがおすすめ

以上、CyberduckとWordPressの子テーマについて解説しました。

まったくカスタムしないのであれば、親テーマだけで構いません。
サイトを自由にイジりたい中級者以上の方は、子テーマとFTPソフトの使い方は覚えておきましょう。

Cyberduckの使い方

この記事が気に入ったら
フォローしてね!

シェアしていただけると励みになります
  • URLをコピーしました!

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

コメントフォーム

※日本語が含まれない内容は投稿できません。

目次