サーバーへのワードプレス導入が無事完了したら
ブログの中身を作り込んでいきます。
ブログ自体はHTMLやCSSを駆使して完全オリジナルで構築することもできますが
勉強するだけでも時間がかかってしまい
サイトらしくするだけでも一苦労...
ですので今回は設定するだけでオシャレなサイトが作れるだけでなく
自由にカスタマイズできてさらにSEO対策もしっかりされている
最強の有料テーマ「AFFINGER5(WING)」を最初から導入していきます。
AFFINGER5(WING)を購入する
AFFINGER5(WING)は有料テーマなので
こちらから購入します。
AFFINGER5(WING)
AFFINGER5はインフォトップで販売されているため
インフォトップでの決済となります。
AFFINGER5(WING)を導入する
AFFINGER5を購入し、データをダウンロードしたら
そのフォルダの中に次の2つのzipファイルがあると思います。
・affinger5.zip
・affinger5-child.zip

他にもいくつかファイルが入っていると思いますが
テーマ本体はこの2つになります。
さっそくテーマをワードプレスにインストールしていきましょう。
テーマの管理画面へ
AFFINGER5のインストールはワードプレスの管理画面から行います。

左メニューの「外観」→「テーマ」を選択するとテーマの管理画面へ遷移できます。
テーマの新規追加
こちらがテーマの管理画面。
デフォルトでは「Twenty Twenty」が適用されているので
ここにAFFINGER5を追加して、差し替えることになります。

ページ上部の「新規追加」を選択。
AFFINGER5のアップロード
テーマの追加画面です。
追加するには検索して選ぶ方法と、アップロードする方法の2つがありますが
AFFINGER5は有料テーマのため検索しても出てきません。
よって、購入時にダウンロードした本体テーマを
ワードプレスにアップロードしていきます。

ページ上部の「テーマのアップロード」を選択。
すると、ファイルが選択できるようになります。

「ファイルの選択」を選択。

「affinger5.zip」→「affinger5-child.zip」の順で
インストールしましょう。

インストールに成功すると上のような画面になります。
テーマの有効化
インストールが完了したらテーマの管理画面を確認してみましょう。

インストールした2つのテーマが追加されています。
しかし、まだ追加しただけでサイトに反映されていないので
有効化していきます。

テーマにカーソルを合わせるとメニューが出てくるので
「WING-AFFINGER5 Child」の方を有効化します。

上の画面のように「有効」と表示されたらOK。
ポイント
【親テーマと子テーマ】
ワードプレスのテーマには、今回のように親と子の2つのテーマがある場合のあります。
1つのテーマだと、もしもアップデートがされた場合に上書きする形でアップロードすることで
それまでに行ったカスタマイズが消えてしまいます。
アップデートするたびにカスタマイズし直していると非常に手間がかかってしまうため
カスタマイズは子テーマにして、アップデートされた親テーマだけを更新していくことによって
カスタマイズを維持することができます。
サイトを確認
AFFINGER5が有効化され、サイトに反映されました。
早速サイトを確認してみましょう。

最初とは雰囲気が変わりました。
まだシンプルですが、ここからカスタマイズしていくことになります。
次のステップ(AFFINGER5カスタマイズ)へ
テーマの反映までできたので
次はよりサイトらしく見た目をカスタマイズしていきます。
AFFINGER5は自由度が高いだけに
慣れればこれ以上ないほど便利ですが
最初はどこから手をつければいいか分からず
なかなか進まないということもあります。
しかしここまでのように手順に沿って進めれば
きちんと作れるように案内するのでご安心ください。
次の記事を参考に進めていきましょう。
-
【ワードプレスブログ開設】AFFINGER5(WING)でオシャレなトップページを作り上げる
ワードプレスのテーマとして 幅広いカスタマイズ性と圧倒的なSEO対策がされた AFFINGER5(WING)を導入したことは 今後にとって大きなプラスになるはずです。 しか ...
続きを見る