・この機能を使用するにはストアーズプラン以上か...

16
前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで Custom CSS and HTML アプリと Page Management アプリが必要です。 ・この機能を使用するには管理者権限が必要です。

Upload: others

Post on 15-Aug-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

前提条件

・この機能を使用するにはストアーズプラン以上かアプリストアで

 Custom CSS and HTML アプリと Page Management アプリが必要です。

・この機能を使用するには管理者権限が必要です。

Page 2: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

ウェブサイトのページ設定ウェブサイトページの設定ページでは、ウェブサイトの外観、機能を設定できます。

表示するページを決定したり、ページを追加・ページを削除・ページやサブページを

構成したりすることができます。

条件

この機能を使用するには、管理者またはウェブデベロッパーのアクセス権が必要です

あなたのウェブサイトページを設定するには:

1.DecoNetwork Web サイトにログインします。

2.[ 管理 ]> [ Web サイト ] をクリックします。

3. ウェブサイトページを選択します。

Page 3: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

ウェブサイトページ設定では

各ページのバナーの設定や商品の表示設定などができます。

Page 4: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

サイトブランディング設定

サイトブランディング設定ではサイト全体の文字の色や背景などを設定できます

HTML/CSS もこちらで編集することができます。

あなたのウェブサイトページを設定するには:

1.DecoNetwork Web サイトにログインします。

2.[ 管理 ]> [ Web サイト ] をクリックします。

3. サイトブランディングを選択します。

Page 5: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ウェブサイトストア名・ロゴの設定

ウェブサイトにストア名・ロゴを登録することができます。

またタイトルバー・アイコンを登録することができます。

Page 6: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ウェブサイトカラー設定

ウェブサイトカラー設定では、ストアテンプレートで

使用されているカラーを調整できます。

・ウェブサイトカラー

ウェブサイトの色では、ウェブストアで使用されているさまざまな

テキストタイプの色を変更できます。

設定可能なカラータイプは、サイトが使用しているサイトテンプレートによって異なります。

選択されるテンプレートに応じて、それぞれのカラーオプションが設定可能です。

・ウェブサイト背景

ウェブサイト背景では、ウェブストアのバックグラウンドで

使用されるイメージを調整できます。

・テンプレートデフォルトは、テンプレートで設定されている背景を使用します。

・指定カラー背景では、背景として設定するフラットカラーを選択できます。

・画像背景では、背景として使用する画像を選択できます。

画像背景は、「リピート」または「全体カバー」を使用して画面に合わせて

 引き伸ばして設定することができます。

Page 7: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ストアテンプレートストアテンプレートを設定することができます。

数種類のテンプレートがありますので自由にテンプレートを選択できます。

ストアテンプレート>テンプレート変更

サイト全体カラーを選択してテンプレート適用でテンプレート変更

Page 8: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ウェブサイト CSS 管理・編集CSS(カスケードスタイルシート)は、HTML 要素を画面に表示する方法を記述し、

複数の Web ページのレイアウトを編集することができます。

独自のカスタム CSS コードを追加して、Web サイトをデザインすることができます。

カスタマイズされた CSS の使用は、DecoNetwork システムでサポートされています。

必要に応じて CSS を入力して設定することができますが、間違った CSS や HTML、そ

の他のユーザ入力コードの使用による損害については、

DecoNetwork は責任を負いません。

DecoNetwork は、CSS と HTML のコードスニペットを公開しています。

詳細については、サポート Web サイトのスニペットのセクションを参照してください。

https://www.deconetwork.com/support/code-snippets

Page 9: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

CSS(カスケードスタイルシート)を編集する場合は

「CSS 編集を有効にする」にチェックを入れる

編集したい CSS をテキスト領域に入力します。

ここに入力した CSS はサイトのデフォルト CSS に追加されます。

※デフォルト CSS 全体をコピーしてこの領域に貼り付けないでください。

 パフォーマンスに悪影響を及ぼします。

Page 10: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

CSS で使用されている画像などのリソースは、「ファイル /画像の選択」を

クリックしてして、使用するリソースを開きアップロードします。

アップロードするファイルタイプを選択

アップロードするファイルを選択

アップロードするファイルを選択したら

Upload をクリック

新しいフォルダ作成

Page 11: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

モバイルカスタム CSS を編集するには

モバイルカスタム CSS では、モバイルデバイス向けに CSS を設定できます。

メインワークエリアの左側にあるメニューで

[モバイルカスタム CSS] をクリックします。

編集方法はカスタム CSS と同様

このオプションは、DecoNetwork V8 以降で作成されたサイトでは使用できません。

Page 12: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ウェブサイト HTML 管理・編集

HTML は要素を画面に表示する方法を記述し、

複数の Web ページのレイアウトを編集することができます。

独自のカスタム HTML コードを追加して、Web サイトをデザインすることができます。

HTML を編集する場合はカスタムレイアウトで

「デフォルトレイアウトを無効にする」にチェックを入れる

テンプレートのデフォルト HTML を表示するにはデフォルトレイアウトをクリック

テンプレートの HTML 表示のみでこちらは編集ができません

Page 13: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ウェブサイトページオプション設定

ヘッダ表示オプション

ドロップダウンメニュー - 上部のナビゲーションバー項目がマウスのロールオーバー時に

ドロップダウンメニューを表示するかどうかを選択します。

ショッピングカート - すべてのページの見出しにショッピングカートの

表示をオンまたはオフにします。

最近閲覧したアイテム - 最近閲覧したアイテムをすべてのページの

ヘッダーに表示するかどうかを選択します。

通貨セレクタ - 各ページのヘッダに通貨セレクタを

表示するかどうかを選択します。

検索ボックス - すべてのページのヘッダーに

検索ボックスを表示するかどうかを選択します。

ウェブサイトのページオプションは、ウェブサイトの多くの要素の全体的な表示をコントロールします。

これらの要素は、ヘッダー、Body、フッターの表示エリアに分類されます。

各ページごとに個別に編集することなく変更することができます

Page 14: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

パンくずリスト - すべてのページの上部メニューバーの近くにある

パンくずリストナビゲーションをオンまたはオフにします。

コメント - 訪問者がデザインや製品に関するコメントを投稿できるようにするかどうかを選択します。

投票 - 製品やデザインに対する顧客の投票を許可するかどうかを選択します。

電話番号 - すべてのフッターで会社電話番号の表示をオフにします。

Body 表示オプション

フッター表示オプション

Page 15: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ソーシャルサイトのリンク設定

それぞれの SNS リンク先のソーシャルサイトごとにユーザー情報を入力します。

完了したら、[ 保存 ] を押します。

ソーシャルサイトは、Facebook、Twitter、YouTube、Instagram、Pinterest などの

ソーシャルネットワークです。

この機能により、あなたのソーシャルサイトをあなたのウェブサイトにリンクすることができます。

Page 16: ・この機能を使用するにはストアーズプラン以上か …deconetwork.jp/images/landingpages/home/DecoNetwork...前提条件 ・この機能を使用するにはストアーズプラン以上かアプリストアで

・ソーシャルネットワークシェア設定

ソーシャル共有オプションを追加する箇所(ページ)を選択します。

デザインや商品のソーシャル共有を許可 -

それぞれのデザインや商品情報のページに共有リンクが追加されます。

購入した商品のソーシャルシェアを許可 -

チェックアウトページに共有リンクが追加され、顧客は購入したものを共有することができます。