gist:708ccdedf7ce342178c0

Wordpress での設定

日付のフォーマット

設定 -> 一般にある、日付のフォーマットを「カスタム」 Y.m.d へ設定。

PR用カテゴリーの設定

PR(Sponsored)で表示するカテゴリーを pr というslugで設定。

ページの作成

ページを作成し、slugをそれぞれ以下に設定

ウィジェット

Post footer へYARPP をカスタム -> thumbnail で追加

関連記事 (YARPP) 設定内の表示設定では全てチェックをはずしてください。

ソース内変更必要箇所

boxilmagazine.zip を解凍し、以下のファイルを変更する。

トップページ内固定テキスト・リンク

home.php

176〜191行目にある各テキスト、リンクを変更。

各タグへのリンクを以下のように設定。（[slug]を指定カテゴリーのslugへ変更）

<a href="<?php echo bx_catlink('[slug]') ?>">[[カテゴリー]]</a>

テーマのインストール

以上の手順の後、テーマフィル（boxilmagazine.zip）をアップロードしテーマを有効化する。

ソースから修正する場合

ソースからテーマファイル（CSSなど）を修正する場合。ソース一式.zip から以下の手順で行う。

アプリケーション

開発時に以下のアプリケーションを利用します。

Node.js
Gulp
Bower

$ (sudo) npm install -g gulp bower

Sass

$ (sudo) gem install sass

テーマファイルを、開発用 Wordpress サイト内のテーマフォルダ内へ設置する。

/path/to/wordpress/wp-content/theme/[boxilmagazine]

テーマを開発するにあたって利用しているアプリケーションやプラグインのインストールは以下のコマンドで行います。以下、テーマフォルダ内での実行です。

$ npm install && bower install

テーマ開発時にファイルの監視やビルドを行うコマンドです。

$ gulp serve

テーマのビルドを行うコマンドです。

$ gulp

ディレクトリ・ファイル構成

ビルド・パッケージ管理

├── package.json
├── gulpfile.babel.js
├── bower.json

package.json
gulpfile.babel.js

テーマの開発、ビルドを行うための gulp のサブパッケージおよびタスク実行用設定ファイルです。

bower.json

Bootstrapなどのプラグインなどの管理用ファイル

ソースファイル

├── src
│   ├── manifest.json
│   ├── fonts
│   ├── images
│   ├── scripts
│   └── styles
│       └── main.scss
│       ├── _variables.scss
│       ├── _bootstrap.scss
│       ├── bootstrap
│       ├── components
│       └── layouts

manifest.json

gulp で実行する際のビルド設定ファイル

src/*

開発時に利用するJSやCSS（SASS）のソースファイル。新しく作成したテーマ用のイメージやフォントなどもここに入れます。

テーマアセット

├── assets
│   ├── fonts
│   ├── images
│   ├── scripts
│   └── styles

srcフォルダ内にあるJSやCSS、イメージファイルなどを最適化し assets フォルダ内に書き出されます。実際にテーマで利用されるファイルです。

Wordpressテーマ用設定ファイル・ライブラリ

├── functions.php
├── lib
│   ├── ajax.php
│   ├── pr.php
│   └── setup.php

テーマ用の設定や、ajaxなどで利用するライブラリです。

Wordpressテーマファイル

├── style.css
├── screenshot.png

管理画面で表示されるテーマの表示用ファイル。

├── 404.php
├── archive.php
├── category.php
├── home.php
├── index.php
├── page.php
├── single.php

各ページの表示用ファイルです。

├── page-archive.php
├── page-ranking-access.php
├── page-ranking-cloud.php
├── page-ranking-gadget.php

ランキング、アーカイブ表示用のファイルです。 page-[slug].php のようにページのslugに紐づけられます。

├── header.php
├── footer.php
├── searchform.php
├── yarpp-template-thumbnail.php
└── templates
    ├── categories.php
    ├── content-homeheader.php
    ├── content-page.php
    ├── content-single.php
    ├── content.php
    ├── footer.php
    ├── navbar.php
    ├── share-buttons.php
    └── sidebar.php

ページ内のパーシャルファイルです。

テストサイト

boxiladmin
}8X2TDcPgcpj

Wordpress ログイン

boxil
(cYq(CT1*l1dCWdC1Z

Xiangshen-Meng/gist:708ccdedf7ce342178c0