Stinger8初心者 幅を広げてみようとしましたが、うまくいかずsimplicityに変更

2017/09/17

Stinger8導入してみて数日後、cssを眺めてみて気付いたのですけど、「Stinger8ってレスポンシブルなんですよね」

「当たり前だろ!今時!」って言われるかもしれませんけど、PCでばかり見ていて大事な事を忘れていました。当然、cssにはモバイル用の設定などもあるわけで、それをPCの画面だと思って変更してしまうと崩れたり、レスポンシブル機能を働かなくさせてしまいかねません。やっかいですけど、確認しながら変更してみようと思います。

記事部分の幅を広げる

PC画面において今のままだと少し横幅が狭い。ほんの少し広げて、しかも記事部分だけBackground-colorを入れてみたい。
とりあえず記事部分の幅だけでも少し広げてみます。レスポンシブルですからこれで表示が崩れてしまう可能性もあるので、一か八かな部分もあります。でも少しPC画面での表示なら大丈夫だと予想してやってみます。

Stinger8は親テーマと子テーマとあります。親テーマだけでも使えるそうなのですけど、カスタマイズなどでテーマのcssを変更する際には親テーマと子テーマをダウンロードして子テーマを有効にして、子テーマを編集、書き加えなどすることによってカスタマイズすることが推奨されているようです。バージョンアップで親テーマが書き換えられた場合に親テーマを編集してあったのがそっくり消えてしまうということを避けられるとのことです。

親テーマにある設定変更は、子テーマで書いてある方が優先されるってことなんでしょうか?その辺は不明ですけど、とりあえず進めてみます。
xserverwordpress22

まずネットワーク管理の親サイトのレベルで子サイトを変更してその変更が全ての子サイトに影響あるのか見てみます。
wordpressmultisite17

最上部のメニュー「参加サイト」→「サイトネットワーク管理」をクリックします。

wordpressmultisite18
サイトネットワーク管理のダッシュボードを開きます。

xserverwordpress23
左側のメニューから「テーマ」をクリックします。

xserverwordpress24
子テーマを見てみます。STINGER8 Childの「編集」をクリックします。

レスポンシブル設定の中のPCエリアの領域が#contentでそのまた中に記事エリアがあって右サイドのウィジェットエリアはPC表示だと固定だということなので、子テーマのPCエリアで#contentをデフォルト1060pxから見た目でわかるくらいに1400pxに書き入れてみましたが、表示は変わりませんでした。レスポンシブルで親テーマ、子テーマの編集方法とか初めてなのですぐに撤退を決めました。初心者が触るテーマじゃないですね。

simplicityに変えてみます

新しいStinger8は情報が少ないのとかなり簡略化してあるとのことで、ちょっとわからないのでテーマをsimplicityに変更してみます。

まだ記事数も少ないですから変更するなら早いほうがいいです。

Simplicity2の親テーマ、子テーマをそれぞれダウンロードしておきます。
wordpresssimplicity01

テーマはzipで圧縮されていますが展開する必要はありません。zipファイルのままアップロードします。

WordPressマルチサイト設定下でのテーマをSimplicity2へ変更していきます。
wordpressmultisite05
マルチサイトの親サイトダッシュボードを開きます。トップメニューの「参加サイト」→「サイトネットワーク管理」か、その右の「ダッシュボード」で、ネットワークの親サイトダッシュボードが表示されます。

xserverwordpress28

 

xserverwordpress30
左側のメニューから「テーマ」をクリックします。

xserverwordpress31

現在使用中の「STINGER8」「STINGER8子テーマ」が有効化されています。
まず、simplicity2、simplicity2子テーマの両方をアップロードします。ZIPファイルのままアップロードします。

xserverwordpress33
「新規追加」ボタンをクリックします。

xserverwordpress34

「テーマをアップロード」ボタンをクリックします。
simplicity2のサイトに”子テーマとともにダウンロードして、双方ともサーバーにアップし、子テーマの方を「有効」にして利用することを強くおすすめします”とあるので親テーマ、子テーマともにアップロードしていきます。順版として親テーマからインストールしていきます。子テーマインストール時に親テーマが先にインストールされているか確認します。

xserverwordpress36
「ファイルを選択」をクリックします。ローカルにダウンロードしておいたsimplicity2のZIPファイルを選択します。

 

xserverwordpress37

xserverwordpress38
「今すぐインストール」をクリックします。

xserverwordpress39

 

次ぎに同じように子テーマもアップロードします。

xserverwordpress40

子テーマは親テーマのインストール確認をします。子テーマがインストールされたらネットワーク有効化をクリックします。

これでインストールは終わりました。親サイトのテーマを変えると子サイトのテーマも一括で管理されて変わるとマルチサイト設定の説明にあるのですが、どうもそれだけだとテーマは変わりません。各サイトのダッシュボードを開いてStinger8からSimplicity2子テーマに変えていってテーマ変更ができました。

xserverwordpress41

各サイトにSimplicity2子テーマが登場していますが、有効となっているのは親サイトで無効にしたStinger8です。

Simplicity2子テーマを有効にしてみると表示が変わりました。
xserverwordpress42
とりあえずSimplicity2を各子サイトで変更して、設定していくことにします。
Simplicity2の説明で子テーマを有効にすると書いてあるので親テーマはインストールだけして、有効にはしていません。Stinger8では親、子テーマともに有効にしてしまいましたが、これがStinger8でカスタマイズ出来なかった原因だったのかもしれませんね。でもいまとなってはとりあえずSimplicity2でいいかな?という感じです。記事のスペースがこちらの方が広くてStinger8で広げようとしていましたが、インストールだけで達成できましたし。

Stinger8を利用していてさほどの設定は行っていないのですが、twenty sixteenテーマからStinger8にしたときに
wp-config.phpに
define(‘WP_DEFAULT_THEME’, ‘stinger8-child’);
と編集したことを思いだしました。
xserverwordpress43

この場合はstinger8-childをsimplicity2-childにするのでしょうけど、子テーマのzipファイル名はsimplicity2-child20161002a.zipとなっています。’simplicity2-child20161002a’と指定するのか悩みどころです。
テーマはzipファイルとしてアップロードするので展開する必要は無いのですが展開してファイルがどうなっているのか見てみました。

xserverwordpress44
xserverwordpress45
simplicity2-child20161002a.zipを展開してみてsimplicity2-child20161002aフォルダにはsimplicity2-childフォルダがありました。
simplicity2-childフォルダ内にテーマのPHPファイルやimageフォルダなどの内容物があったのでsimplicity2-childを指定すればいいのかな?という感じです。

xserverwordpress46
一応変更しておきました。これで正しいのかする必要が無いのかも全く不明です。

WordPressって変更されていくから意外と情報が残りにくいのでしょうか?ネットで探してみても見つかりませんでした。分かっているけど別にブラウザ上で有効化すれば動作はするわけで、wp-config.php編集をする意味は無いのかもしれません。

意味があるのかわからないとはいえ、忘れていたのでブログを残しておくとこういうときに便利です。一々変更残すのは面倒ですけど、後で、どこをどう変更したのか記録が残って確かになります。

Posted by クチコミ探し