初期ウィジェット

表示設定画面で、ホームページの表示を「最新の投稿」に設定した場合の表示になります。

トップページウィジェットエリア

テーマインストール時に、初期ウィジェットが自動的に登録されます。
その後、順番を自由に入れ替えたり、任意のウィジェットを追加することも可能です。

初期ウィジェット

一番最初のテーマインストール時に、以下のウィジェットが自動で設定されます。

新着情報(カラムブロック)

manual-waon-top

構成は以下のとおりです。

カラムブロック

ブロック設定

カラム数2(30% / 70%)
モバイルでは縦に並べるOFF(チェックされていない状態)

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

フォント明朝(見出し用)

横並びブロック

ブロック設定

配置左揃え
方向

ブロックスタイル

スタイル

スタイル逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

サイズ

ブロックの間隔0 px

見出しブロック

初期状態では「新着情報」という文言が設定されています。任意の文言に変更できます。
見出しレベルは H2 です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

段落ブロック

「News」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向
サイズS

最新の投稿ブロック

ブロック設定

投稿メタ投稿日を表示
並び順投稿順(最新から)
カテゴリー全投稿が対象に設定されています。
項目数4

※ 注意 ※
商品も一覧に表示されます。インフォメーション記事のみ表示したい場合は、専用カテゴリーを作成して設定してください。

和音の想い(カラムブロック)

manual-waon-top

構成は以下のとおりです。

カラムブロック

ブロック設定

カラム数2(50% / 50%)
モバイルでは縦に並べるON(チェックされた状態)
表示領域(幅)幅広(1350px)

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイル縦並び逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

フォント明朝(見出し用)

サイズ

ブロックの間隔(左右)100px

横並びブロック

ブロック設定

配置右揃え(左右)・上揃え(上下)

ブロックスタイル

スタイル

スタイル逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

サイズ

ブロックの間隔0px

見出しブロック

「和音の想い」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

段落ブロック ①

「About」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向
サイズS

段落ブロック ②

「心に響く和の美しさを日々の暮らしに」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向
サイズL

サイズ

パディング上50px・右40px

段落ブロック ③

「和音のデザインは、ひとつひとつの素材と、日本ならではの美意識を大切にしています。商品は、単なるモノとしての価値を超え、そこに込められた物語や季節の移ろい、作り手の想いを映し出します。使う人の心に静かに響き、長く愛される存在となることを願っています。」という文言が設定されています。任意の文言に変更可能です。

ボタンブロック(リンクグループ)

ブロック設定

配置左揃え
方向
複数行に折り返すON

ボタンブロック(リンク)

ボタンテキスト詳しく見る
リンク先「/」

「編集」をクリックして任意のURLに差し替えることが可能です。

ブロックスタイル

スタイル

スタイルテキスト+矢印

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

サイズ

パディング上50px・右40px

画像ブロック

ノーイメージ画像が設定された状態です。

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロック設定

表示領域(幅)全幅

ギャラリー(横並びブロック)

manual-waon-top

構成は以下のとおりです。

横並びブロック

「全幅」が選択された状態です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

横並びブロック

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスreveal-group

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

縦積みブロック

ブロック設定

配置左揃え
方向
複数行に折り返すON

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

画像ブロック

ノーイメージ画像が設定された状態です。

「置換」をクリックして任意の画像に差し替えることが可能です。

画像ブロック

ノーイメージ画像が設定された状態です。

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

画像ブロック ⑤

ノーイメージ画像が設定された状態です。

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal anim-reveal–slow

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

カテゴリー一覧(グリッドブロック)

カテゴリーとは連動していませんが、画像とテキストをグリッド状に並べ、カテゴリー一覧への誘導エリアとして活用されています。

manual-waon-top

構成は以下のとおりです。

グリッドブロック

「全幅」が選択された状態です。

ブロック設定

カラム数3

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスreveal-group

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

サイズ

ブロックの間隔0px

カバーブロック

合計6つのカバーブロックが挿入されます。

カバーの背景にはノーイメージ画像が設定された状態です。

cover-block-change-bg-img

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイル全面リンク

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

オーバーレイ黒色(#000)
オーバーレイの不透明度60

見出しブロック

「カテゴリー名」という文言が設定されています。任意の文言に変更可能です。

リンク先「/」

「編集」をクリックして任意のURLに差し替えることが可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

商品一覧(横並びブロック)

manual-waon-top

構成は以下のとおりです。

横並びブロック ①

「全幅」が選択された状態です。

ブロック設定

配置左揃え(左右)・上揃え(上下)
方向

縦積みブロック

ブロック設定

配置中央揃え(左右)・上揃え(上下)
方向

高度な設定

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを使用することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

横並びブロック ②

ブロック設定

配置左揃え(左右)・上揃え(上下)
方向

ブロックスタイル

スタイル

スタイル逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

サイズ

ブロックの間隔0px

見出しブロック

「看板商品」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

段落ブロック

「Products」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

フォント明朝(見出し用)
サイズS
方向

ボタンブロック(リンクグループ)

ブロック設定

配置左揃え
方向
複数行に折り返すON

ボタンブロック(リンク)

ボタンテキスト詳しく見る
リンク先「/」

「編集」をクリックして任意のURLに差し替えることが可能です。

ブロックスタイル

スタイル

スタイル矢印のみ

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

Welcart 商品一覧 ウィジェット

タイトル空白
表示するカテゴリー商品(任意のカテゴリーに変更できます)
表示する投稿数8

贈りもの(カバーブロック)

manual-waon-top

構成は以下のとおりです。

カバーブロック

「全幅」が選択された状態です。

カバーの背景にはノーイメージ画像が設定された状態です。

cover-block-change-bg-img

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロック設定

高度な設定

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを使用することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイルオフセット

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

オーバーレイなし
オーバーレイの不透明度0

カラムブロック

ブロック設定

カラム数2(60px / auto)
モバイルでは縦に並べるOFF

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal anim-reveal–up

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイル縦並び逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

テキスト#000000
背景#ffffff
リンク#000000

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

フォント明朝(見出し用)

サイズ

ブロックの間隔30px(左右)

横並びブロック

ブロック設定

配置左揃え(左右)・上揃え(上下)

ブロックスタイル

スタイル

スタイル逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

サイズ

ブロックの間隔0px

見出しブロック

「贈りもの」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

段落ブロック ①

「Gifts」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向
サイズS

段落ブロック ②

「贈りものは、気持ちを形に変える大切なひととき。悠月堂のお菓子は、ひとつひとつに季節の彩りとやさしさを宿し、贈る人の想いをそっと包み込みます。ご挨拶や慶事、法要など、人生の節目に寄り添い、上質な余韻を届ける贈答菓。心を結ぶ一品として、どうぞお選びください。」という文言が設定されています。任意の文言に変更可能です。

ボタンブロック(リンクグループ)

ブロック設定

配置左揃え
方向
複数行に折り返すON

ボタンブロック(リンク)

ボタンテキスト詳しく見る
リンク先「/」

「編集」をクリックして任意のURLに差し替えることが可能です。

ブロックスタイル

スタイル

スタイルテキスト+矢印

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

用途・シーンで選ぶ(カバーブロック)

カテゴリーとは連動していませんが、画像とテキストをグリッド状に並べ、カテゴリー一覧への誘導エリアとして活用されています。

manual-waon-top

構成は以下のとおりです。

カバーブロック

「全幅」が選択された状態です。

カバーの背景にはノーイメージ画像が設定された状態です。

cover-block-change-bg-img

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロックスタイル

オーバーレイなし
オーバーレイの不透明度0

カラムブロック

「全幅」が選択された状態です。

ブロック設定

カラム数2
モバイルでは縦に並べるOFF

横並びブロック

ブロック設定

配置左揃え(左右)・上揃え(上下)

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイル逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

サイズ

ブロックの間隔0px

見出しブロック ①

「用途・シーンで選ぶ」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

段落ブロック

「Shop by Occasion & Scene」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

フォント明朝(見出し用)
サイズS
方向

見出しブロック(h3) ①

「用途から選ぶ」という文言が設定されています。任意の文言に変更可能です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

グリッドブロック

ブロック設定

カラム数4

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスreveal-group

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイルスワイプ表示

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

カバーブロック

合計4つのカバーブロックが挿入されます。

カバーの背景にはノーイメージ画像が設定された状態です。

cover-block-change-bg-img

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイル全面リンク

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

オーバーレイ黒色(#000)
オーバーレイの不透明度60

見出しブロック

「カテゴリー名」という文言が設定されています。任意の文言に変更可能です。

リンク先「/」

「編集」をクリックして任意のURLに差し替えることが可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

区切りブロック

ブロックスタイル

背景#cccccc

見出しブロック(h3) ②

「シーンから選ぶ」という文言が設定されています。任意の文言に変更可能です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ボタンブロック(リンクグループ)

5つのボタンが挿入されます。

ブロック設定

配置左揃え
方向
複数行に折り返すON

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスreveal-group

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

フォント明朝(見出し用)

ボタンブロック(リンク)

ボタンテキストカテゴリー名
リンク先「/」

「編集」をクリックして任意のURLに差し替えることが可能です。
100%

ブロックスタイル

テキスト#000000
背景#ffffff

枠線と影

枠線の色#000000
枠線のサイズ1px
角丸0px

実店舗のご案内(カラムブロック)

manual-waon-top

構成は以下のとおりです。

カラムブロック

「幅広(最大幅 1350px)」が選択された状態です。

ブロック設定

カラム数2(33.33% / 66.66%)
モバイルでは縦に並べるON

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイル横並び逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

フォント明朝(見出し用)

サイズ

ブロックの間隔0px(上下)

横並びブロック

ブロック設定

配置右揃え(左右)・上揃え(上下)

ブロックスタイル

スタイル

スタイル逆順

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

サイズ

ブロックの間隔0

見出しブロック

「実店舗のご案内」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

方向

段落ブロック ①

「About」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

サイズS
方向

段落ブロック ②

「四季とともに歩む私たちの店日々の暮らしに寄り添う場所」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

タイポグラフィ

「サイズ」以外は、通常表示されていません。「︙(三点リーダー)」をクリックすると設定項目を表示してください。

サイズL
方向

サイズ

パディング50px(上)・40px(右)

段落ブロック ③

「私たちの店舗は、地域に根ざし、四季の移ろいとともに歩んできた空間です。
店内には、世代を越えて愛される定番の商品や、その時々の彩りを映す季節の品々が並びます。ひとつひとつに込められた想いは、訪れる人の心を静かに潤し、やさしい余韻を残します。お近くにお越しの際は、ぜひ足をお運びいただき、その雰囲気とともに商品をお楽しみください。」という文言が設定されています。任意の文言に変更可能です。

ブロックスタイル

サイズ

パディング3.5em(上)

ボタンブロック(リンクグループ)

5つのボタンが挿入されます。

ブロック設定

配置左揃え
方向
複数行に折り返すON

ボタンブロック(リンク)

ボタンテキスト詳しく見る
リンク先「/」

「編集」をクリックして任意のURLに差し替えることが可能です。

ブロックスタイル

スタイル

スタイルテキスト+矢印

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

画像ブロック

manual-waon-top

画像ブロック

ノーイメージ画像が設定された状態です。

「置換」をクリックして任意の画像に差し替えることが可能です。

ブロック設定

高度な設定

通常は折りたたまれた状態です。クリックして展開すると、各種の設定項目が表示されます。

追加 CSS クラスanim-reveal

※ 追加 CSS クラスを指定することで、アニメーションを適用できます。
  詳細は「アニメーション追加」をご参照ください。

ブロックスタイル

スタイル

スタイルトリミング

※ ブロックに専用スタイルを追加しています。
  詳細は「ブロック専用スタイル」をご参照ください。

サイズ

ブロックの間隔0px(下)