トップページに SP Page Builder で作った記事を割り当てる

トップページに SP Page Builder で作った記事を割り当てる

Page Builder で作った記事はトップページとして使うことが多いでしょう。他のページを Page Buider で作ってしまうとクライアントが自由に修正することが難しくなるからです。このため、デザインやアニメーション処理などが必要なページは page Builder で作り、その他のページはなるべく通常のHTMLエディタを利用して作成します。

SP Page builder のインストール

 本体の無料版(機能制限あり)

SP Page Builder 5 Lite
https://www.joomshaper.com/joomla-extensions/sp-page-builder-lite-next

日本語ファイル(まだ4のバージョンしか作っていないので未翻訳部分あり)

日本語
https://joomla.jp.net/download/19-sp-page-builder-4.html

SP Page builder でのページ作成

Light版(無料版)で使えるウィジットでも結構色々なことができ十分にトップページを構成するのに適しています。

1.新しいページを作る

 

 screenshot deltaworks.lovestoblog.com 2023.10.20 09 45 52

 screenshot deltaworks.lovestoblog.com 2023.10.20 09 46 31 thumbnail

 2.列の配置

 ウィジットを配置するためにはまず「セクションと呼ばれる」行のエリアを設定する必要があります。こ

 行を追加して中の列も設定します。(後ほど変更も可能)

 screenshot deltaworks.lovestoblog.com 2023.10.20 09 51 05

 screenshot deltaworks.lovestoblog.com 2023.10.20 09 51 31

 screenshot deltaworks.lovestoblog.com 2023.10.20 09 52 57

 3.ウィジットの配置

Light版では限定された状況でいくつかのウィジット飲み使えます。

 

  1. Joomlaモジュール
  2. 仕切り
  3. 空きスペース
  4. お客様の声
  5. アコーディオン
  6. アラート
  7. タブ
  8. テキストブロック
  9. ボタン
  10. 昨日ボックス
  11. アイコン
  12. ビデオ
  13. 画像
  14. カルーセル

上記のような機能が利用可能です。

 screenshot deltaworks.lovestoblog.com 2023.10.20 10 06 27

 4.カールセルの配置

 トップのセクションに「カールセル」と呼ばれるスライドショーを設定してみましょう。

 

screenshot deltaworks.lovestoblog.com 2023.10.20 10 10 26 

 screenshot deltaworks.lovestoblog.com 2023.10.20 10 15 13

 

 

 5.サイトのトップページに設定

サイトのトップページにSPのページを設定するためには、メインメニュー等でHomeに相当するメニューをSPに変更する必要があります。

 

 screenshot deltaworks.lovestoblog.com 2023.10.20 10 19 48

 screenshot deltaworks.lovestoblog.com 2023.10.20 10 21 33

 screenshot deltaworks.lovestoblog.com 2023.10.20 10 22 45