カテゴリー
Synology Theme WordPress

[WordPress] 親テーマを変更せずテーマをカスタマイズ – 子テーマを作り変更したを加える – 手始めは、content.phpの編集 – ID7726 [2020/07/23]

[WordPress] 親テーマを変更せずテーマをカスタマイズ – 子テーマを作り変更したを加える – 手始めは、content.phpの編集 – ID7726 [2020/07/23]
スポンサーリンク
  • by Google Ads ID24747
  • by Google Ads ID:11145
  • by Google Ads ID23293

親テーマと子テーマ

いつまで続くか分からない当サイトの構築ですが、プラグインやphpファイルの変更など、他のblogerさんの記事を参考にさせてもらっていいます。

今回は、WordPressテーマ: Twenty Twentyを親テーマとして子テーマを作りました。

スポンサーリンク
  • Synology DS517 by Amazon ID:22173
  • Synology DS920+ by Amazon ID:22172
  • オムロン BY50S用パック by Amazon ID:22171
  • オムロン BY50S by Amazon ID22170
  • Synology 高機能無線ルーター VPN Plus対応 日本正規代理店アスク サポート対応 保証2年 NT934 RT2600ac by Amazon ID24327
  • エレコム LANケーブル CAT6A 5m 爪折れ防止コネクタ ホワイト LD-GPA/WH5 by Amazon ID24327

テーマの編集

スポンサーリンク
by Rakuten ID:15895

作った子テーマが有効になっていれば、「テーマの編集」画面の右上にある「編集するテーマを選択」にその子テーマのリストが出てきます。図1のように、twentytwenty_child (この名前は、実質的にフォルダ名)があるので、このテーマが有効化していれば、表示されます。以下、図1の説明です。

スポンサーリンク

by Google Ads ID23409

style.cssの編集

表示の体裁を変更する場合は、style.cssのコードの変更、コードの追加が必要です。以下のコードは、当サイトの目次の体裁を定義したものです。

/** 見出し
*/
/* h2
#contentを付けると左端に表示されるのが、幅に従った左端に改善できる
*/

h1,
.heading-size-1 {
	font-size: 3.2rem;
/*	font-weight: 800;
	line-height: 1.138888889;
*/
}

h2 {
	font-weight:600;
	font-size:3.0rem;
	color: #fff;
  background: #2a49a8;
  padding: 15px 30px;
}
h3 {
	font-weight:500;
	font-size:2.8rem;
	/* 見出しの飾り */
  padding: 0.25em 0.5em;
  color: #2a49a8;
  background: transparent;
  border-left: solid 50px #2a49a8;
}
h4 {
	font-weight:500;
	font-size:2.6rem;
/* 見出しの飾り */
	border-bottom: solid 3px black;
	
}
h5 {
	font-weight:500;
	font-size:2.4rem;
/* 見出しの飾り */
	/* border-bottom: solid 3px black; */
	
}

h6 {
	font-weight:500;
	font-size:2.2rem;
/* 見出しの飾り */
	/* border-bottom: solid 3px black; */
	
}

content.phpの編集

表示の構造自体を変更する場合は、content.phpのコードの変更、コードの追加が必要です。

content.phpが、WordPressにおける投稿や固定ページの表示を行っているメインのphpプログラムです。図1の例では、content(org).phpやcontent([番号])が、確認できると思います。

これは、プログラミングに際し、僕が格闘した結果の残骸です。捨てられずに残しています。content(org).phpは、オリジナルファイルです。元に戻す場合は、このファイルをcontent.phpに名前を変更したして置き替えます。

基本的に、子テーマでのこれらの修正は、親テーマの上書きになっているようです。

ファイルの複製や名前の変更は、WordPressからはできません。端末ソフトを使ってサーバーに入り、コマンドにより名前を変更したり、複製したりする必要があります。

当サイトでは、自宅のSynology NASにWordPressを導入しているので、Synology NASにログインして、DiskStation Managerのもとで、名前の変更、複製をします。その後、WordPressにログインして、「テーマの編集」画面に入れり、該当するするphpファイルのプログラムの内容を修正・追加していきます。

修正した後は、左下にある更新ボタンで修正内容を保存します。その結果は、直ぐにblogに反映されるので、サイトをSafariやChromeで表示して確認します。

このcontent.phpでのコードのミスは、即座に表示を崩していまうことを意味しますが、以下に記述したように元のコードに戻したり、追加したコードを削除して元に戻せば表示も元に戻ります。

スポンサーリンク
by Google Ads ID19417

画面が崩しれたりした場合、「テーマの編集」画面から、Ctrl + zにより元に戻して、更新ボタンを押せば、元に戻ります。

WP テーマ編集
図1. content.phpの編集
content.phpの編集と言っても、使用しているThemeごとに異なります。当サイトでは、WorpPress version 5以降で公式テーマになっているTwenty Twentyを使っています。標準のcontent.phpでは、表示のが味気ないので、coverタイプ (content-cover.php)をcontent.phpに置き換えています。同じTwenty Twentyのcontentではが、コードを確認してみるとだいぶ作りが異なっていました。

functions.phpの編集

オートセーブとリビジョン機能

親テーマでは、標準で有効となっている編集時のオートセーブ機能とリビジョン機能ですが、子テーマの「functions.php」にコードを追加することで、無効化することが可能です。以下のリンクをご参照ください。

macoblogさんより

https://macoblog.com/wp-writing-autosave/

まとめ

親テーマと子テーマの関係性が、まだよくわかっていません。

  • 親テーマと子テーマは、themeフォルダに別フォルダで保管される。
    • 今回の場合、元からあった親テーマである「twentytwenty」と今回作ったフォルダとしての子テーマ「twentytwenty_child」を作りました
  • 編集するfunctions.phpやhead.phpなどのファイルを、親テーマからコピペしておく。
    • 同じ定義のものは、親テーマで定義されるので、小テーマでは削除します。ほとんどが削除されたになります。
  • 親テーマと子テーマの関わりをfunctions.phpに記載とておく。
    • 小テーマが使われるように定義 : 参照
  • 子テーマにない定義、値など
    • 親テーマの定義、値などを小テーマが引き継ぐ
編集情報
ID 7726
2020/01/21 Mr.はりきり
2020/07/23 追記(concent.phpの編集)

以上

スポンサーリンク
  • by Amaozn ID13196
  • by Amazon ID13339
スポンサーリンク
  • 【Amazon.co.jp 限定】HP USBメモリ 128GB USB 3.1 スライド式 金属製 HPFD796L-128 GJP by Amazon - ID 24751
  • 3Dプリンター ダヴィンチ Jr. 1.0(造形サイズ15×15×15cm) - 環境に優しい土に返るPLAフィラメント - ダビンチ Jr. 1.0 XYZプリンティングジャパン by AMAZON ID21513
  • XYZプリンティング3Dプリンター|ダヴィンチ1.0 pro|オートキャリブレーション機能付|オープンフィラメント可|ABS対応|造形サイズ20×20×20cm|レーザー刻印機能拡張可|積層ピッチ0.02mm~|高性能|3F1AWXJP00F - ダビンチ 1.0 Pro - XYZプリンティングジャパン by AMAZON ID21511
  • ABS使用可 造形サイズ175×175×175mm オープンフィラメント可 オートキャリブレーション機能付き レーザー刻印機能拡張可 金属系PLA拡張可 3FJSPXJP00G - ダビンチ Jr.Pro X+ XYZプリンティングジャパン by AMAZON ID21509
  • zedela 5-in-1 USB-Cハブ【3ポート5Gbps by Amazon - ID 24751
スポンサーリンク

用語の解説、関連タグ付き投稿の抽出

customize

[WordPress] 自作プラグイン、Twenty Twentyテーマ幅の修正、子テーマのcontent.phpをいじる – ID11199 [2020/03/01]
[WordPress] author-bio の幅設定 – CSS for TwentyTwenty [工事中] – ID10899
[WordPress] 親テーマを変更せずテーマをカスタマイズ – 子テーマを作り変更したを加える – 手始めは、content.phpの編集 – ID7726 [2020/07/23]

NAS

[WordPress] 2020年初心者ガイダンス・WordPressを構築し快適に運用するための必須プラグイン一覧 (2020/03/10現在) – ID10673
[Data Link] NASとは何ですか? by Synology – ID9090
[WordPress] Google AdSense登録の手順 – ID8940-UM [2020/08/24]
[WordPress] アバターを作る方法 – Gravatar – ID8936
Synology NASのセキュリティを強化する方法のリンク – ID8870
[WordPress] 初期設定でblogサイトに作ってしまったサブディレクトリを外す方法 – Google AdSenseには、サブディレクトリは不要 – ID8814

twenty twenty

WordPress

[WordPress] 2020年初心者ガイダンス・WordPressを構築し快適に運用するための必須プラグイン一覧 (2020/03/10現在) – ID10673
Google Adsense導入に必要な手順とセッティング – ID9539
[WordPress] Google AdSense登録の手順 – ID8940-UM [2020/08/24]
[WordPress] アバターを作る方法 – Gravatar – ID8936
[WordPress] 初期設定でblogサイトに作ってしまったサブディレクトリを外す方法 – Google AdSenseには、サブディレクトリは不要 – ID8814
[WordPress] Flex Posts – Widget and Gutenberg Block プラグイン – Gutenberg エディター対応 – ID8804

子テーマ

[WordPress] 親テーマを変更せずテーマをカスタマイズ – 子テーマを作り変更したを加える – 手始めは、content.phpの編集 – ID7726 [2020/07/23]
スポンサーリンク
  • by Google Ads ID:11145
  • by Google Ads ID24747
  • by Google Ads ID23293

Update ID21920

english
今日の英語 – post/after – 後 – ネイティブは結構、postも使う. [2020/11/20]

post/after 後という意味ですが、名刺/前置詞の違いもあります 1. post-tax loss of $3 million2. $3 million after tax loss訳 : 3ミリオンドル(は税金ロ […]

anime, LIFE
[アニメ]「ビィンランド・サガ」を題材にして – ユトランド/デンマーク/バイキングを知る – ID13609

目次1 バイキングについて、アニメで学ぶ2 ビィンランド・サガ2.1 登場人物名と歴史上の人物名 バイキングについて、アニメで学ぶ アニメ「ヴィンランド・サガ」は、HNKで放送されたらしいですが、僕は、Amazon Pr […]

BIOLOGICS, culture, equipment-culture, production
[Bio-Equip] WAVE 25 Rocker – GE – ID11509

目次1 WAVE 25 Rocker2 関連 WAVE 25 Rocker ReadyToProcess WAVE 25 Rocker – GE Healthcare https://www.gelifesc […]

plugin, Synology, WordPress
[WordPress] 自宅NASに設置のWordPressのプラグイン更新を出先から行う場合に、毎回出てくるパスワード入力を省略する設定 – ID89

出先から自宅NASのWordPressのプラグインを更新する 自宅に設置したDS918+にWordPressを立ち上げています。既にWordPressにログインしていても、WordPressのプラグイン更新には,デフォル […]

analysis, BIOLOGICS
[Bio-Edu] 進化するPCR – droplet digital PCRまで – 原理を解説する ID19081 [2020/07/16]

PCR Polymerase chained reaction デジタルPCRとは。そして更に、ドロップレットPCRの原理は、シンプルで美しい。 ~20,000ウェルの微細なナノウェルにDNA分子をランダムに分配する 0 […]

スポンサーリンク
by Google Ads ID19417
AAV, BIOLOGICS, CMO, gene-therapy
気になる企業 – Molecular Medicine ;MolMed – ID12516 [2020/11/09]

目次1 MolMed1.1 サービス2 AGCが買収 MolMed イタリア ウイルス・ベクターを用いた遺伝子治療薬製造のCDMO サービス MolMed独自のテクノロジーを持っている。 MolMedは、ベクター製造用の […]

更新された投稿の最新順

スポンサーリンク
  • by Amazon ID19245
  • by Amazon ID13211
スポンサーリンク

スポンサーリンク
  • by Google Ads ID23293
  • by Google Ads ID24747
  • by Google Ads ID:11145

最新記事(WordPress, ID:14681)

security, WordPress
[WordPress] AMP対応化で、使用しているその他のプラグインによるエラーが出ないようにするために – プラグイン別 [2020/11/16] ID24858

はじめに 投稿/ページを公開/更新した際に、AMPの検証/再検証が行われます。その結果として、「makeupエラー」や「スクリプトエラー」などが生じることがあります。これらのエラーは、なるべく出なくすることが良いと考えま […]

plugin, Synology, WordPress
[WordPress] 高速化プラグイン「AMP」と定期的に全てのページの静的キャッシュ作成プラグイン「WP Super Cache」で再構成した- ID22640 [2020/11/15]

目次1 はじめに2 ページのAMP化のみでもレスポンス改善は十分高い3 キャッシュプラグインを追加する4 プラグインは専用機能がいい4.1 WP Super Cacheの設定のほんとのところ4.1.1 WP Super […]

security, WordPress
[WP] WordPress – ログイン/アクセス制限に関する設定 – ID24132 [2020/10/09]工事中

目次1 はじめに2 設定ファイル・設定される方のファイル/フォルダ?3 allow?, deny? はじめに WordPressのセキュリティ設定を考えます。WordPressには、各種のファイルがあります。基本的な設定 […]

plugin, Synology, WordPress
[WordPress] 「AMP」まとめ – ID22520 [2020/09/13]

AMPの記事まとめ AMPページに対応すべく奮闘しています。当サイトで記事にしたAMP関連と情報リンクをまとめました。 AMP: a well-lit path to optimizing for Google’s pa […]

mail, plugin, Synology, WordPress
[WordPress] Synology (新)NASに立ち上げたWordPressから外へメールを飛ばす – WP Mail SMTP by WPFormsプラグインとGMail APIの設定 – ID22422 [2020/09/13]

目次1 はじめに2 準備3 プラグインのインストール4 API プロジェクトの作成4.1 OAuthクライアント IDの作成 はじめに レンタルサーバーでWordPressの運用と違い、Synology NASにWord […]

plugin, Synology, Theme, WordPress
[WordPress] このサイトの表示に関係する使用している「テーマ」と「プラグイン」のリスト – ID22353 [2020/09/11]※

目次1 はじめに2 システム構成3 プラグイン・リスト はじめに 現在、見られているこのサイトの表示に関わるWordPressテーマ、およびプラグインのリストを公開します。これからWordPressでサイトの構築をされる […]

スポンサーリンク
by Google Ads ID19417
Page: 1 2 23
スポンサーリンク

スポンサーリンク
  • by Google Ads ID23293
  • by Google Ads ID24747
  • by Google Ads ID:11145

最新記事(Synology, ID:14676)

plugin, Synology, WordPress
[WordPress] 高速化プラグイン「AMP」と定期的に全てのページの静的キャッシュ作成プラグイン「WP Super Cache」で再構成した- ID22640 [2020/11/15]

目次1 はじめに2 ページのAMP化のみでもレスポンス改善は十分高い3 キャッシュプラグインを追加する4 プラグインは専用機能がいい4.1 WP Super Cacheの設定のほんとのところ4.1.1 WP Super […]

Synology
[Synology] 以前からeo光なのに速度が遅く感じられていた(100Mbps) – A6のネットケーブルで改善(300~500Mpbs) [2020/10/19]

目次1 eo光の速度の測定2 コースごとの測定3 ケーブル交換前の速度4 ケーブル交換後の速度5 その他のコースで測定6 使用したケーブル eo光の速度の測定 もう数年以来、ネットの速度が遅いなぁ~と思っていたが、ありま […]

Synology
[Synology – Plex] Plex Serverに繋がらなくなったときの対処法 – ID24032 [2020/10/04]

目次1 はじめに2 課題3 対処方法4 Plexの管理画面でできること5 まとめ はじめに Plexは、自宅のサーバーにあるメディア(音楽、動画)をインターネット経由でもストリーム配信できるメディア・サーバーです。 DS […]

plugin, Synology, WordPress
[WordPress] 「AMP」まとめ – ID22520 [2020/09/13]

AMPの記事まとめ AMPページに対応すべく奮闘しています。当サイトで記事にしたAMP関連と情報リンクをまとめました。 AMP: a well-lit path to optimizing for Google’s pa […]

スポンサーリンク
by Google Ads ID19417
mail, plugin, Synology, WordPress
[WordPress] Synology (新)NASに立ち上げたWordPressから外へメールを飛ばす – WP Mail SMTP by WPFormsプラグインとGMail APIの設定 – ID22422 [2020/09/13]

目次1 はじめに2 準備3 プラグインのインストール4 API プロジェクトの作成4.1 OAuthクライアント IDの作成 はじめに レンタルサーバーでWordPressの運用と違い、Synology NASにWord […]

plugin, Synology, Theme, WordPress
[WordPress] このサイトの表示に関係する使用している「テーマ」と「プラグイン」のリスト – ID22353 [2020/09/11]※

目次1 はじめに2 システム構成3 プラグイン・リスト はじめに 現在、見られているこのサイトの表示に関わるWordPressテーマ、およびプラグインのリストを公開します。これからWordPressでサイトの構築をされる […]

Page: 1 2 20
スポンサーリンク

スポンサーリンク
  • by Google Ads ID24747
  • by Google Ads ID23293
  • by Google Ads ID:11145

その他記事(ALL-RANDOM, ID:16786)

plugin, Synology, WordPress
[Synology] NAS – WordPressからサイト外にメールを送信する – ID4235 [2020/09/13]

この記事は、少し古いです。代わりに以下の記事をご覧ください。この記事は、参考資料として「Appendix」を保存するために、このまま維持することにしました。 代わりの記事では、2020/09の時点において、Synolog […]

HEALTH
成長ホルモン量が減少した中高年に協和発酵キリンのアルギニンEXを試す,2019/05〜2019/11、量を減らして継続し2020/3に終了 – ID141

目次1 成長ホルモン2 アルギニン 成長ホルモン 色々と体調を改善したくてサプリメントを試します。年齢とともに成長ホルモン濃度は低下していくことが分かっています。ヒトの成長期(~30歳)を過ぎると年々減少していくのがこの […]

test
Ultimate Member テストページ ID24691

目次1 以下は、登録していな一般の方でも見えるページの領域(publish)です。2 以下は、Registrationしていなと見えない領域です。 以下は、登録していな一般の方でも見えるページの領域(publish)です […]

スポンサーリンク
by Google Ads ID19417
BIOLOGICS, CMO, company, COMPANY-FAVOR, Sartorius, single-use
気になる企業 – Sartorius stedim biotech & cellca – ID6309

目次1 Sartorius stedim biotech2 バイオリアクター製品3 フィルター製品4 生産株構築サービス Sartorius stedim biotech バイオリアクター製品 培養条件の開発から商用製造 […]

Page: 1 2 145
スポンサーリンク

スポンサーリンク
by Google Ads ID:11143(2)

- 以下のツールに敬意を示します -
Support to AMP (Accelerated Mobile Pages) by official AMP plugin for WordPress, and compatible powered by
Post viewing : Flex Posts - Widget and Gutenberg Block