2014.03.22前回までの記事でWordPressをカスタマイズするには子テーマを最初に作っておく事が重要という記事を書いてきました。おさらいしておくと、テーマが更新する度にカスタマイズしたファイル達は全部初期化されるので、親テーマをコピーした子テーマを作成して更新しても初期化されないようにしておくという事でした。⇒WordPressのテーマ選びと子テーマの重要性ただ、テーマを構成する全てのファイルをコピーする必要はなく、修正するファイルだけコピーしておけばOK。それ以外は親テーマのファイルを読み込むのでカスタマイズしたり、修正したりするファイルだけをコピーして子テーマに追加していきます。今回は実際にどのように子テーマを作るのかという部分を解説していきます。WordPressをカスタマイズする時に色々なphpファイルをコピーしていきますので、この手順はしっかりと覚えてしまいましょう。それから最後に重要な注意事項もありますので、必ず最後まで記事を読んで下さいね。今回はロリポップ版での解説ですが、ロリポップではなくエックスサーバーを利用している場合にはこちらの記事を参考に子テーマを作成して下さい。⇒エックスサーバーで子テーマを作成する方法Amazonや楽天のアフィリエイトは「もしもアフィリエイト経由」がおすすめの理由Amazonや楽天のアフィリエイトは認知度も高いので初心者におすすめのアフィリエイトです。先に子テーマを作る流れを大まかに説明しておきますね。このブログを読んでくれている方のほとんどがロリポップサーバーを使っていると思いますので、ロリポップの場合の手順になります。ロリポップ側で新しいフォルダを作成。twelve)のファイルをコピー。ロリポップで作成したフォルダにコピーしたファイルを貼り付け。いう流れが大まかな流れになります。基本的にはWordPressの中に「themes(テーマ)」というフォルダがあり、インストールされているテーマがそのフォルダの中に入っています。その中に新しくテーマを作成していく流れになります。実際にやってみるとすぐに理解できますよ。今回は2つのファイルをコピーしてみましょう。2つかというときちんと理由がありますのでそれも説明していきます。Twelve」をインストールします。別のテーマでも構いません。※すでにインストール済みならそのまま次に進んで下さい。WordPressの管理画面から「外観」⇒「テーマ」⇒「新しいテーマを追加」をクリック。Twelve」と入力して検索してインストールしておきます。インストールできたら一度「有効化」しておきます。これでテーマ(親テーマ)が有効化されますので、有効化できたらWordPressの外観⇒「テーマの編集」と進みます。Name)」を確認しておいて下さい。Twelve」になってますね。Name)は後で使うのでメモ帳などに貼り付けておきましょう。実際に子テーマを作ってみよう最初にコピーするのは「style.css」というファイルです。これから子テーマを作り有効化する訳ですが最初に必要なのがこの「style.css」になります。スタイルシートというやつです。スタイルシートはテキスト文字の大きさやフォント、各部分の装飾をするためのファイルです。それではまずロリポップへ移動しログインしてユーザー専用ページへ移動しておいて下さい。ロリポップユーザー専用ページに移動できたら「サーバーの管理・設定」から「ロリポップFTP」をクリック。ここに最初独自ドメインを設定した時に作った自分のサイトのフォルダがありますのでこれをクリック。そのフォルダの中身一覧が表示されますので、「wp-content」というのをフォルダをクリックします。これはWordPressの中身という意味です。「wp-content」のフォルダの中かから「themes(テーマ)」というフォルダをクリックします。「themes(テーマ)」というフォルダの中に今現在WordPressにインストールされている「テーマ」の一覧が表示されていると思います。この「themes(テーマ)」の中にここに新しく「子テーマ」のフォルダを作って行きます。この「themes(テーマ)」というフォルダの画面で「新規フォルダ作成」というボタンをクリック。新規フォルダ名は何でもいいですが、子テーマなので、「Child」と名づけています。フォルダ名を決めたら「保存」をクリックします。すると「themes(テーマ)」というフォルダの中に今作成した「Child」というフォルダが表示されているはずですので、これをクリックします。今作ったフォルダにはまだ中身はありません。ここの中に今度は「ファイル」を作成して行きます。フォルダ名が「Child(私の場合)」になっている事を確認して今度は「新規ファイルを作成」をクリック。「フォルダ」ではなくて、「ファイル」を作成です。新規ファイル名に「style.css」と入力します。これは深く考えずにこのまま記入。その下の部分にファイルの内容を記入する部分があります。この内容の部分に普通は親テーマのファイル(今回は「style.css」)をそのままコピぺして保存します。この「style.css」に関しては別の記入で簡単に作成する事ができます。Twelveのテーマを利用する場合はこんな感じです。url(‘../●●●●/style.css’);」の●●の部分にも親テーマのテーマ名を入れます。合計2箇所確認して下さい。※テーマ名の部分などスペースなどを入れないで全部小文字(半角英数字)。Twelveの場合は上記のコードをこのままコピペして内容の部分に貼り付けて「保存」して下さい。これはテーマ名と親テーマの名前、それから@の部分がtwentytwelveの「style.css」をインポートして下さいという意味です。これで保存をしてとりあえず1つ目のファイルは完了です。url」の部分の上の空白の1行に「半角のスペース」が入っていてこれを削除しないと上手く行かなかった。いうコメントも頂きました(kurina様ありがとうございます!)。上手く反映されない場合にはその点もチェックしてみて下さい。子テーマを有効化してみるここまでで新しく「Child」という子テーマを作成しましたので、これを有効化して行きます。今度はWordPressの管理画面から「外観」⇒「テーマ」と進んで下さい。すると先ほど作った「Child」というテーマがありますので、「有効化」をクリック。するとこの子テーマが有効化されます。これで子テーマの有効化は完了。有効化できたら自分のブログを表示させて確認します。twlve」のテーマと同じように表示されるはずです。子テーマが反映されていない場合には2つの項目をチェックして下さい。「Ctrl」と「F5」を一緒に押してリロードしてからブログの表示を確認する子テーマに作成した「style.css」の親テーマのテーマ名の記述ミスがないか確認するここまでで「子テーマ」つまり、親テーマのコピーを作った訳ですが、カスタマイズする時はこの子テーマの方に書き込んでいきます。子テーマには今「style.css」しか作っていませんが、他の部分は親テーマから読み込んでますので心配はいりませんし、前回説明したように子テーマに色々書き込んでいくと子テーマの方が優先されますので、親テーマの更新で初期状態になるという事もありません。スタイルシートに関しては下に書いた(後から書いた)ものが優先的に反映されます。変更したい部分だけを子テーマのスタイルシートにどんどん追加していくだけで変更が反映されます(スタイルシートの場合だけ)。今親テーマをインポートするコードを書いて「style.css」を作ったのですが、このインポートは「style.css」の場合ですので、別のファイルをコピーする時には内容をそのままコピペします。練習の意味でもう一つコピーしてみましょう。補足しておくと、前回の記事で書いたようにWordPressのテーマは沢山のphpファイルでできています。カスタマイズしたいファイルだけ子テーマに追加しておき、コピーしたファイルの方をカスタマイズします。コメント欄のカスタマイズをしたい場合は「comments.php」というファイルを親テーマからコピペして子テーマに追加し、コピーした子テーマの「comments.php」をカスタマイズする訳です。別のファイルもコピーしてみる先にロリポップの準備をしておきます。先ほど同様に「ロリポップFTP」⇒「自分のフォルダ」⇒「wp-content」⇒「themes(テーマ)」⇒「Child」と進みます。この「Child」に「新規ファイルを追加」します。これから新しく親テーマの「single.php」というファイルをコピーしますので、ファイル名にはこの「single.php」と入力しておきます。ここまで準備できたらこのファイルの内容に親テーマの「single.php」を追加します。別ウィンドウもしくは別タブでWordPressの管理画面を開き、「外観」⇒「テーマの編集」をクリックして下さい。twelve)を選び、「選択」をクリック。(single.php)」というのクリック。twelve」の(single.php)というファイルの中身が表示されていると思います。この中身をすべてそのままコピーします。後は先ほどのロリポップで準備しておいたsingle.phpのファイルの中身にペーストして「保存する」をクリックすれば完了です。最後に子テーマに反映されているか確かめてみます。WordPressの管理画面から「外観」⇒「テーマの編集」と進みます。画面の右側の「編集するテーマを選択」で「Child」を選び「選択」をクリックすると最初に作った「style.css」と今作った「single.php」が表示されていればOKです。このコピーして追加する方法が子テーマの基本になります。子テーマの作成の仕方も理解できたでしょうか?このようにカスタマイズしたい部分のファイルだけをコピーして子テーマに追加しながらカスタマイズしていく事になります。※親テーマの全部のファイルを子テーマに追加する必要はありません。子テーマに無いファイルは親テーマのファイルを読んでくれるので、変更する予定のファイルだけを子テーマにコピーしていけばOKです。(functions.php)」というファイルです。この「functions.php」だけはコピーしてはいけません。いうのもこれと同じファイルを作ってしまうとサイトが表示されません。このファイルだけは同じ内容があると上手く機能しませんので、「functions.php」のファイルを子テーマに追加したい時には内容を白紙状態で作っておきます。親テーマの「functions.php」と同じ記述があると機能しないので、追加したい内容だけ記述する事になります。このファイルだけはどうしてもという時意外は触らないのがいいでしょう。それではいよいよカスタマイズ本編へ行きます。返信ありがとうございます。これは記事にも書いてますが、子テーマ名はchildにしてます。Nameを確認してください。親テーマをインポートするための記述に親テーマ名を書く部分があります。AMご返信ありがとうございます。PMてつ様コメントありがとうございます。テーマは違っても手順は同じです。Seventeen用に変更してください。PMお世話になります。返信ありがとうございます。前回と同じ事になるのですが、原因はfunctions.phpかと思われますので、子テーマのfunctions.phpファイルを削除してもらえますか?(親テーマではなくて子テーマのfunctions.phpです)ログインしなくてもサーバーのFTPからfunctions.phpファイルの削除ができます。それで試した過程を具体的に教えて下さい。サーバーらからFTPでどのファイルをどのように削除してどのように確認されたのか?できるだけ具体的に書いてもらえると助かります。AMしげぞう様ご返信いただきありがとうございます。最悪です!(◎_◎;)エラー表示のページで公開しているとログインできなくなりました。さっきから何度も、ログインしているのですがワードプレスのログイン画面になりません。永久にログインできないのでしょうか?本当に何と言っていいやら......。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールアドレスサイト上に表示された文字を入力してください。【図解】Amazonプライム会員の友達紹介のやり方と手順。友達紹介キャンペーンは無料の会員登録でも報酬発生!Googleアドセンスの始め方。初心者でも迷わないWordPressの始め方や使い方まとめ!【初心者向け】CocoonでWordPressを始めるなら最低限やっておきたい設定13項目WordPressテーマ「Cocoon」を使うなら最低限入れておきたいプラグイン12選+1【図解】Cocoonのダウンロードとインストールの手順。Wing簡単移行を使ってサーバー移転する方法と注意点まとめ【保存版】エックスサーバーのWordPress簡単移行機能の使い方と注意点まとめ【保存版】ロリポップの簡単引っ越し機能の使い方と注意点まとめ。返信ありがとうございます。シンプリシティだったんですね。質問1.試す記事は実際に投稿済みのものが良いです。下書きのものだと試せないと思います。早々にご連絡を頂きまして、ありがとうございました。スラッグの変更を試してみたのですが、うまくいきませんでした。コメントありがとうございます。サイトもサボっておりまして、すっかり情報も古くなってきてます、すみません。ご無沙汰しております。2年以上も(2017年7月頃)前ですが、こちらの記事にコメントを入れさせていただきました、ねこ吉と申します。その節は大変お世話になりました。しげぞう...【図解】シーサーブログからWordPressにリダイレクトして引越しする方法pyon2019.08.06わかりやすいです。XServerで悩んでいました。検索トップタイトルとURLをコピーしました。