Twenty Fourteenテーマ改造 メモ (スクリプト部)

新ブログ用に Twenty Fourteenテーマの改造手順を メモっておきます。

 参考にしたサイトは以下の通りです。ありがとうございます
http://hikikomori-channel.com/twentyforteen_sidemenu/
http://licoco.info/wordpress-twenty-fourteen-width-17.html
https://firegoby.jp/archives/2394
http://iinamotto.com/2014/01/1718.html
http://netaone.com/wp/wordpress-plugin-first/
http://wp-themetank.com/
http://ryus.co.jp/blog/twentyfourteenwidthwide/
http://wpdocs.sourceforge.jp/%E5%AD%90%E3%83%86%E3%83%BC%E3%83%9E

作業手順

1)  デフォルトでインストールされているTwenty Fourteenを使用して自分好みに改造
2)  改造済のテーマをFTPでローカルにダウンロードしWinMeargeで差分ファイル抽出
3)  子テーマ用にディレクトリ作成 twentyfourteen-child ←元のテーマ名に-childを追加
4)  twentyfourteen-childの中にfunction.php と style.cssを入れる
style.cssはダウンロードした改造スタイルシートをそのまま入れる

●function.phpは指示通り新規UTF-8ファイルに下記を追加するのみ

 

 ●style.cssの先頭コメント部分を修正

 この「Template: twentyfourteen」が親テーマの指定になるようで、
オリジナルのTwenty Fourteenテーマには無かったので追加が必要

twentyfourteen-childディレクトリを作りfunction.phpとstyle.cssを入れて、
wordpressのテーマ設定でTwenty Fourteen childを選べばTwenty Fourteenテーマをベースにした子テーマに移行完了

5) Style.css以外の変更点を反映
この時点でstyle.cssが既に改造品に入れ替わっているのでサイトのスタイルは反映されています。
サイトの出力スクリプトの反映は各phpファイルを更新する形でパッチするようで、
どうやら子テーマのディレクトリに同ファイル名で処理を更新したい関数を入れておけば該当の関数が上書きされるようです。

と、言う訳で今回は下記の関数をパッチします。

●function.phpに下記関数を追加

 

●fotter.phpをパッチ

 

●custom-header.phpをタイトル画像の高さを120pxにパッチ

 

●content.phpでパスワード保護と非保護の両立できる記事を出力できるようにパッチ

 

6) 引用部で使用する画像を追加(子テーマで独自に使う画像はココに入れて使う)
twentyfourteen-child\images\ディレクトリを作成しFTPで画像をアップロード
postquote.png

7) 投稿エディタの横幅対策
twentyfourteen-child\css\ディレクトリを作成しFTPで画像をアップロード
editor-style.css

 

とりあえずこんな感じでTwenty Fourteenを自分で使いたいデザイン&機能にカスタマイズできました。
まだまだ不具合が多いですがとりあえず使えています。

残りの残件をまとめて、詳しい方に相談しよう^^;;;

 

スポンサーリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。 本文に全角文字を2文字以上含めて下さい (スパム対策)