【動画付き】WordPressおすすめ有料テーマ『STORK(ストーク)』の導入~初期設定の全て解説
ここでは、WordPressテーマ『STORK(ストーク)』の導入の方法を1から丁寧に動画解説付きで解説したいと思います。
テーマとは、WordPressサイトの見た目(外観)を決めるためのテンプレートのようなものです。
ストークの良さは、新しいスマホビュー時代を作るWordPressテーマ『STORK(ストーク)』でモバイルファーストを極めたれ!という記事でとことん語っていますので参考にしてみてください。
では、手順1から一緒に始めましょう!
手順1)公式サイトでテーマを購入する
WordPressのテーマには有料のもの、無料のものがありますが、今回紹介しているSTORKというテーマは有料(¥10,800円【税込み】)です。まずは、購入しない事には扱えません。
という事で、以下のボタンから公式サイトにいって購入するまでを動画で解説しました。一緒に見ながら作業をしてみてください。
https://youtu.be/lE41wpT9REk
手順2)購入したテーマをWordpressサイトにインストールして使えるようにする
手順1で、jstork.zipという本体テーマと、jstork_custom.zipという子テーマの2つがダウンロードできたと思います。
それでは、次にこの2つをあなたのWordPressサイトに導入していきたいと思います。
以下の動画を見ながら実際にやってみましょう。
テーマのインストールは、
『外観』>『新規追加』>『テーマのアップロード』でできます。
本テーマ(jstork.zip)を先に、続いて子テーマ(jstork_custom.zip)の順でインストールをしてください。
子テーマをインストールして有効化することで、本テーマがバージョンアップした時も、今まで変更した色のカスタマイズなどが消えることなくうまく引き継がれます。そのため、子テーマを有効化しておきます。
子テーマが無いと、本テーマがバージョンアップした時に、今まで頑張ってカスタマイズした色などがすべて初期状態にもどってしまうので、カスタマイズをやり直さないといけなくなるのです。
では、インストールができたら次の手順にいきましょう!
手順3)パーマリンクの設定をする
パーマリンクとは、1記事1記事に割り当てられた独自のURLの事を言います。
このパーマリンクは、基本的には「あなたのブログのドメイン/●●●●●」というように設定されています。
前半部分は、必ずあなたのブログのドメインになっています。
設定は簡単なので、動画を見ながら真似してみて下さい。
https://www.youtube.com/watch?v=tr7ZwBO_DRo
手順4)外観をカスタマイズしよう!(サイト名・サイトアイコン編)
ここでは、自分のブログ名と、ブログサイトのキャッチコピー(補足説明)、サイトアイコンの設定方法を解説しています。
手順5)外観をカスタマイズしよう!(サイトカラー編)
このワードプレステーマ「STORK」では、プログラミングができなくても、簡単に色のカスタマイズができます。
今回は、そんな色のカスタマイズの方法を解説しています。
手順6)外観をカスタマイズしよう!(サイトロゴ編)
自分のブログタイトルの部分は、文字で設定されていたと思いますが、ここを『画像』に変更することもできます。
ロゴ画像をあらかじめ作っておけば、より一層オリジナルサイト感がでます。ここではその変更方法を動画で解説しています。
手順7)外観をカスタマイズしよう!(グローバル設定編)
グローバル設定と聞いてもピンと来ないかもしれません。
ここでは、サイトの上部に「お知らせ」を付ける方法やトップページのレイアウトの変更方法を解説しています。
手順8)外観をカスタマイズしよう!(トップページ設定編)
ここでは、トップページの上部にドン!とでてくるヘッダー画像とその上に載る文字+ボタンを設定していきます。
以下の動画を見ながら一緒に設定してみましょう!
ちなみにヘッダー画像の推奨のサイズは以下のサイズです。
PC版
2400×1400px
スマートフォン版
900×900px
※ただし、ある程度横長で切り取られてしまうので、ヘッダーに載せている文字などが切れてしまう場合もあります。
その場合は、何度か設置して文字の位置をずらずなどして調整してみてください。
手順9)外観をカスタマイズしよう!(投稿・固定ページ設定編)
ここでは、投稿・固定ページのレイアウトの設定やSNSボタンの表示をどうするか?という設定ができます。
詳しくは動画を見ながら一緒にやってみましょう。
手順10)Googleアナリティクスのアクセス解析コードを設置しよう!
ここでは、Googleアナリティクスのアクセス解析コードの設置方法を解説します。
引き続きコンテンツ制作中