-
2021.02.01 -
2021.04.30
【Loopsパーツ】「スライド」の設定・活用方法
この記事では、「スライド」の設定方法に加えて、使用時のポイントについても詳しくお話ししていきます。ぜひ編集時にお役立てください。
「スライド」とは?
「スライド」とは、画像の赤枠部分のことです。複数の写真が切り替わって表示されます。(任意で小見出しやテキストの追加が可能)
「スライド」はファーストビューでよく使用される機能です。サイトに動きが生まれるため、ユーザーの目を引き付けます。
「コンテンツの見せ方を工夫したい」、「印象に残るサイトをつくりたい」という場合には、ぜひ「スライド」の活用を検討してみてください。
「スライド」の設定方法
-
- 左サイドバーのページ管理を選択
-
まずは、納品の際にお渡しさせていただいた管理画面URLにアクセスいただき、管理画面にログインしてください。
管理画面にログインできたら、左のサイドバーから「ページ管理」をクリックしましょう。
「ページ管理」をクリックしていただくと、左の画像のような「固定ページ一覧」が表示されます。
-
- 編集したい固定ページを選択
-
ページ一覧から、編集したい固定ページの部分にカーソルを合わせて、「ページのタイトル」もしくは「編集」の部分をクリックしてください。
※今回は会社情報ページを選択していますが、そのほかのページでも同様の操作を行ってくださいませ。
クリックしていただくと、固定ページ編集画面が表示されます。
-
- セクションを追加
-
固定ページ編集画面をコンテンツ項目までスクロールして、「セクションを追加」をクリックしましょう。
※「スライド」を含むLoopsパーツは、セクション内のパーツです。そのためセクション追加は必須となります。
「セクションを追加」をクリックしていただくと、セクションの編集画面が表示されます。
参考サイト:『「セクション」とは?具体的な運用方法と作成方法』
-
- パーツを追加
-
表示されたセクション編集画面を下にスクロールしていただいて、「パーツを追加」ボタンをクリックしましょう。
-
- 「スライド」を選択
-
「パーツを追加」ボタンをクリックしていただくと、パーツ選択画面が表示されます。
パーツ選択画面の中から、「スライド」を選択してください。
-
- 画像を追加
-
ここからは、スライドの詳細を設定していきます。
まずは「画像を追加する」をクリックしましょう。クリックしたのちに開かれる、「メディアライブラリ」から追加が行えます。
※メディアライブラリに設定したい画像がない場合は、「Uplode files」項目からのアップロードが必要です。アップロード方法に関しては、下記記事をご参照ください。
参考記事1:『ページ内に画像を設置する方法』(ステップ2以降をご参照ください)
参考記事2:『画像がアップロードできない場合の対処法』
-
- 小見出しの追加(任意)
-
画像を追加したら、「小見出しを追加」をクリックして小見出しを追加しましょう。
ユーザーが読んでみたくなる、キャッチコピーのような小見出しを設定してみてください。
※小見出しを追加しない方は、このステップは不要です。
-
- 小見出しの入力(任意)
-
「小見出しを追加」ボタンをクリックしていただくと、小見出しの入力欄が表示されます。
入力欄に小見出しを入力しましょう。小見出しを中央寄せにしたい方は、「センタリングする」の項目を「はい」にします。
小見出しのつけ方に悩んだ際は、次のステップで記載するテキストの要約として設定してみましょう。
ユーザーが一目で内容を理解できます。
※小見出しを追加していない方は、このステップは不要です。
-
- テキストの追加(任意)
-
小見出しを入力したのちに、「テキストを追加」をクリックしましょう。テキストの入力項目が表示されます。
※テキストを追加しない方は、このステップは不要です。
-
- テキストの入力(任意)
-
入力欄にテキストを設定しましょう。
※よりアレンジを加えたい場合は、その他機能からフォントサイズ・テキスト色の変更、リンク・画像の挿入などが行えます。
その他機能に関しては、下記記事で解説しております。編集時にお役立てください。
参考記事:『【まとめ】投稿機能(ブログ)の操作マニュアル一覧』(文字装飾の活用方法に関するマニュアル一覧の記事をご参照ください。)
※テキストを追加していない方は、このステップは不要です。
-
- スライドを追加
-
最初のスライドが編集できたら、右下の「スライドを追加」をクリックしましょう。新しいスライドが追加されます。
編集方法はひとつ目と同様です。必要な分のスライドを追加・編集していきましょう。
-
- 表示の確認&ページの公開
-
一通りの入力が終わったら、「プレビュー」から表示を確認してみましょう。
表示に問題がなければ、「更新」をクリックして、スライドの設定は完了です。
お疲れ様でした。
※スライド以外も編集したい方は、そのほかの部分の編集が終わったのちに「更新」をクリックしてください。