This explains how to add your own customization to make it like Live Demo site.

Cutomization STEPS

First of all

The background image of the header is not displayed only first when install sample contents. (Bug?)

Just after installation

Normal style

Style Customization

  1. Click the Gear icon of the editing toolbar.
  2. Gear icon > Desing > Customize Theme > Expand
  3. Select another preset from the Cinnamon.(Example: Blueberry)
  4. After selecting another preset, select again Cinnamon. Click the "Save Changes".
  5. Click the "Entire Site".
  6. System & Settings > Optimization > Clear Cache


Page Types settings

Change setting of Page List Block using for Product Category.

  1. Pages & Themes > Page Types > Product Category > Output
  2. Click the Edit Defaults of Full.
  3. Change the Location of Page List Block from Home to Gâteaux.
  4. Change the same as the Left Sidebar and Right Sidebar.


Live Demo site

Header Navigation settings

Changes to the align text to the right in the custom class of Auto-Nav.

  1. Click Header Navigation area.
  2. Select "Design & Custom Template".
  3. Click the Gear icon and apply "nav-right" Custom Class


Add a banner image in the header

  1. Click Header Extra area.
  2. Add a Image block.
  3. Select an image in the File Manager.
  4. Set the "Image Link" and "Alt. Text".


Set the parallax in the area of the home page.

  1. Click on the "Column 1" of the yellow background in the middle of the home page.
  2. Select "Edit Layout Design".
  3. Click the Gear icon and apply "Parallax" Custom Template.
  4. Select the Background Image in the File Manager.

* Custom Template “Parallax Image” supported to version 5.7.5 or later.








  1. ツールバーのギアアイコンをクリック
  2. ギアアイコン > デザイン > テーマのカスタマイズ > 開く
  3. Cinnamon から他のプリセットを選択(例: Blueberry)
  4. 他のプリセットを選択後、もう一度 Cinnamon を選択して『変更を保存』をクリック
  5. 『サイト全体』をクリック
  6. システムと設定 > 最適化 > キャッシュをクリアしてください



Product Category に使用している『ページリストブロック』の設定を変更

  1. ページとテーマ > ページタイプ > Product Category > 出力 をクリック
  2. 『全幅』の『デフォルトを編集』をクリック
  3. 『ページリストブロック』の『場所』を Home から Gâteaux に変更
  4. 『左サイドバー』、『右サイドバー』も同じように変更してください


Live Demo サイト

Header Navigation の設定


  1. Header Navigation エリアをクリック
  2. 『デザイン&カスタムテンプレート』を選択
  3. 『ギアアイコン』をクリックして、カスタムクラス『nav-right』を適用



  1. Header Extra エリアをクリック
  2. 画像ブロックを追加
  3. ファイルマネージャーで画像を選択
  4. 『画像リンク』と『ALTテキスト』を設定


Home ページ(トップページ)のエリアにパララックスを設定

  1. ホームの中段にある黄色い背景の『列(縦)の1』をクリック
  2. 『レイアウトデザインを編集』を選択
  3. 『ギアアイコン』をクリックし、『カスタムテンプレート』」を『パララックス』に設定
  4. 『背景』の『画像』をファイルマネージャーから選択

※ パララックスに対応したバージョンは、以降です。