第4講/ワードプレステーマの導入
第4講/ワードプレステーマの導入
今回のワークは、ワードプレスの、
- テーマによるデザインの変化の体感
- テーマの導入方法
- 自分が使うテーマを決めて導入する
これら3つを完了で、ワーク終了です。
★ワーク7
☑ 作業時間の目安は20分です。
☑ ワードプレスの管理画面からテーマの設定を変更します。
ワードプレスのテーマとは、Webサイト全体のデザインを決めるテンプレート(ひな型)のことで、HTMLやCSSなどの知識がなくてもノーコードで簡単にサイト作成ができるテンプレートです。
☑ ダッシュボード内の「外観」→「テーマ」を選択して
☑ ここに表示されたものが、いまあなたのワードプレス内にあるテーマの一覧です。
第2講でのエックスサーバーとの契約の際、無料のCocoonを選んでいるはずなので、
左上にCocoonが表示され「有効」となっていると思いますが、
これは現在、テーマとして「Cocoon」が有効になっている状態を示しています。
※テーマ一覧の中に、Cocoonが表示されていない人は下記リンクをクリックして、Cocoonを導入しておいてください。
本講座では、ワードプレスのテーマとしてCocoonを使って解説していきますので、必ずCocoonは導入しておいてください。
それでは実際に、テーマ「Cocoon」の場合のデザインを確認してみましょう。
先ずは前準備として、ブログタイトルを変更します。
☑ ダッシュボード内の「外観」→「カスタマイズ」を選択
☑ 左側のサイドメニューから「サイト基本情報」を選択
☑ 以下の手順で「公開」をクリック
- サイトのタイトル→「テストブログ」と記入
- キャッチフレーズ→「これはテストです」と記入
- 「公開」ボタンをクリック
☑ 「×」ボタンで閉じてダッシュボード画面に戻ります。
☑ ダッシュボード内の「投稿」→「投稿一覧」を選択して
☑ 「Hello world」というタイトルをクリックします。
※ブロックエディターのガイド画面が表示された場合は「×」を押していったん閉じます。
☑ 右上の「プレビューアイコン」をクリックして、
☑ 「新しいタブでプレビュー」を選択。
☑ ここで表示された画面が「Cocoon」テーマでの表示デザインです。
今度は、「Cocoon」以外のテーマでの表示デザインを確認してみましょう。
☑ ダッシュボード内の「外観」→「テーマ」を選択して
☑ ワードプレス内にデフォルトでインストールされているテーマ「Twenty Twenty-Four」を有効化して、
☑ ダッシュボード内の「投稿」→「投稿一覧」を選択して
☑ 「Hello world」というタイトルをクリックして、
☑ 右上の「プレビューアイコン」をクリックして、
☑ 「新しいタブでプレビュー」を選択。
☑ ここで表示された画面が「Twenty Twenty-Four」テーマでの表示デザインです。
☑ 色々なテーマを有効化してみて、表示デザインの違いを確認できたところで、ワーク7は完了です。
★ワーク8
☑ 作業時間の目安は15分です。
☑ ワードプレスの管理画面から、新しいテーマの導入方法を体験します。
ここではワードプレスの無料テーマ「Lightning」の導入方法について体験していきます。
☑ 無料テーマ「Lightning」のサイト https://lightning.vektor-inc.co.jp/pricing/ にアクセスして、真ん中あたりに表示されている「無料版」のところから「Lightningをダウンロード」をクリック。
☑ 表示されたページから「ダウンロード」をクリックしてダウンロード開始。
☑ ダウンロードされたZipファイルは後ほど使うので、保管しておく。
☑ 次に、ダッシュボード内の「外観」→「テーマ」を選択して
☑ 上の方に表示されている「新しいテーマを追加」をクリックして、
☑ 「テーマのアップロード」をクリックして、
☑ 先ほどダウンロードしたLightningのZipファイルを選択して、「今すぐインストール」をクリック。
☑ インストールの完了を確認して、「テーマページへ移動」をクリック。
☑ テーマページに「Lightning」が追加されていることを確認。
☑ これでワーク8は完了です。
以上で第4講のワークは全て終了です。
お疲れ様でした。
それではまた第5講でお会いしましょう!
※純粋な不明点に関する質問やお問い合わせであればお答えできますが、コンサル的な内容までは(別料金が発生するので)お答えできない場合があることを、ご了承ください。