EtsyショップをDiviウェブサイトに統合する方法

公開: 2017-08-23

今日のDiviの投稿では、EtsyショップにあるアイテムをDiviのウェブサイトに統合する方法を紹介します。 これはあなたがあなた自身のウェブサイトのために持っている必要性またはあなたがクライアントから受け取った要求である可能性があります。 Etsyアイテムをウェブサイトに追加すると、売り上げを伸ばすことができます。 特にあなたが魅力的なターゲットオーディエンスとかなりの数の訪問者を持っているウェブサイトを所有しているなら。 Etsyショップをウェブサイトに統合することで、ターゲットオーディエンスに簡単にリーチできます。

Etsyショッププラグインを使用してEtsyショップアイテムを追加する方法を示します。これにより、デスクトップに次の結果が表示されます。

Etsyショップ

可能性

誰もがEtsyショップを個人のウェブサイトに追加するのが好きというわけではありません。 一部の人々はむしろ人々がウェブサイトから直接製品を購入することを可能にするeコマースオプションを使用したいと思います。 EtsyショップをWordPressWebサイトに統合しても、実際にWebサイトで購入が行われるわけではありません。 プラグインは、Etsyアイテムを元の形式で表示するのに役立ちます。 実際の購入プロセスでは、関心のある訪問者は、EtsyウェブサイトのEtsyショップにリダイレクトされます。

ただし、Etsyショップとそこにいるオーディエンスとのつながりを維持したい場合は、状況にアプローチする方法が2つあります。

WordPressWebサイトに製品を手動で追加する

プラグインは訪問者をEtsyウェブサイトにリダイレクトするのに役立つだけなので、Etsyアイテムを手動で統合することもできます。 これはより多くの作業のように聞こえますが、いくつかの利点もあります。 たとえば、好きなようにアイテムのスタイルを設定できます。 あなたはおそらくあなたのウェブサイトと同じスタイルでアイテムを作るためのより多くのスペースとスペースを持っているでしょう。 必要なのは、各アイテムへの直接の(できれば一意の)リンクだけです。

Etsy製品を手動で追加することには多くの長所がありますが、いくつかの短所もあります。 これらのアイテムを手動で追加し、スタイルを変更すると、訪問者は、Etsyウェブサイトにリダイレクトされることをすぐには知りません。 したがって、あなたは彼らを驚かせています。

プラグインで製品を追加する

あなたが持っている他の可能性はプラグインを使用することです。 これは通常、最も簡単な方法であり、多くの時間を節約できます。 それに加えて、アイテムのレイアウトは、Etsyのウェブサイトに表示されているものと似ています。 訪問者はアイテムの出所をより簡単に認識できます。 これは、投稿の次の部分でその方法を紹介する可能性です。

この仕事をすることができるプラグインは、EtsyShopプラグインとEtsy360の2つです。EtsyShopプラグインは無料で、Etsy 360が有料であるのに対し、セットアップ方法を説明します。 残念ながら、Etsyアイテムをデスクトップに表示したい場合にのみ、Etsyショッププラグインを使用できます。 プラグインが応答しません。 そのため、レスポンシブソリューションをお探しの場合は、Etsy360をお試しください。

EtsyショップをDiviウェブサイトに統合する方法

私たちのYoutubeチャンネルを購読する

EtsyショップとEtsyショッププラグインの統合を開始する

EtsyショップをDiviウェブサイトに追加するには、事前に1つのことが必要です。 FredericSheedyによって作成された無料のEtsyショッププラグイン。 このプラグインを使用することで、お気に入りのEtsyショップアイテムをウェブサイトに追加するために多くの労力を費やす必要がなくなります。 過去にEtsyはEtsyMiniの可能性を提供していましたが、残念ながら最近このオプションを保留し、Etsyショッププラグインを現在最も有利な可能性にしています。

それ以上の期限なしで; 始めましょう。

Etsyショッププラグインをダウンロードする

あなたが取る必要がある最初のステップはプラグインをダウンロードすることです。 次のリンクをクリックすると、プラグインをダウンロードできます。

Etsyショップ

プラグインをあなたのウェブサイトにアップロードする

プラグインをダウンロードしたら、 WordPressダッシュボード>プラグイン>新規追加>に移動し、プラグインをWebサイトにアップロードしてアップロードできます。 プラグインもアクティブ化してください。

EtsyショップのAPIキーを入手する

プラグインをダウンロードしたら、次のステップは、EtsyショップのAPIキーを取得することです。 そのようなAPIがすでに利用可能である可能性がありますが、それがない場合は、すぐに入手する方法を説明します。

Etsyアカウント用の新しいアプリを作成する

Etsyショッププラグインをダウンロードして設定に移動すると、Etsy APIキーフィールドのすぐ下に、新しいEtsyアプリを作成する場所を示すリンクが表示されます。 そのリンクをクリックしてください。 etsyショップ

新しいアプリの作成を開始したら、下の画像に示すように、作成しているアプリに関する詳細を入力する必要があります。

EtsyショップEtsyショップ

必要な情報をすべて入力すると、アプリが作成されます。 下の画像では、アプリの作成後にAPIキーがどこにあるかを確認できます。

APIキーをプラグインにコピーします

次に行う必要があるのは、プラグイン設定に戻ってAPIキーを入力することです。

新しいウィンドウでショップを開くようにしてください

また、プラグイン設定を使用している間は、すべてのリンクを新しいウィンドウで開くことをお勧めします。 そうすれば、訪問者を別のページに送るだけでなく、両方のページにとどめることができます。

DiviBuilder内のテキストモジュールにショートコードを追加する

あなたがする必要がある次のことはあなたのウェブサイトにショートコードを統合することです。 アイテムを表示するページの新しいテキストモジュールに追加することで、これを簡単に行うことができます。

アイテムを追加するページを開き、テキストモジュールを全幅の行に追加します。 次に、行の設定を開き、行のカスタム幅を「680px」に変更します。

Etsyショップ

次に、[コンテンツ]タブの[コンテンツ]ボックスにショートコードを追加します。 変更を加えない場合、ショートコードは次のようになります。

[etsy-shop shop_name="*your-etsy-shop-name*" section_id="*your-etsy-shop-setion-id*"]

Etsyショップ

ここで、* your-etsy-shop-name *と* your-etsy-shop-section-id *を独自のものに置き換えます。 これを行うには、あなたのショップ(またはEtsy製品を表示したい他のショップ)に行き、左側のセクションを選択します。

それが完了すると、URLにEtsyショップ名とセクションIDが表示されます。

Etsyショップ

モバイルで無効にする

残念ながら、Etsyショッププラグインはデスクトップ上でのみ適切に機能します。 応答性が低いため、デスクトップのみで売り上げを伸ばすのに役立つ無料のソリューションを探している場合は、これが最適です。 ない場合は、Etsyの360が何であるかを見たいかもしれません、あなたが手動で披露したい要素を追加することができます。

結果

これら2つをコピーして、ショートコードに配置するだけです。 設定を保存した後、あなたがプレビューをクリックすると、あなたのEtsyのアイテムは、デスクトップのウェブサイトに表示されます-あなたは、以下の結果を与えます:

Etsyショップ

最終的な考え

この投稿では、Etsyショップをウェブサイトに追加する方法を紹介しました。 Etsyショッププラグインをインストールするプロセスについて説明しました。 プラグインを使ってEtsyアイテムを追加し、訪問者をEsty Webサイトにリダイレクトさせることを好む人もいれば、eコマースWebサイトを選ぶ人もいます。 あなたが最初の可能性を探していたなら、この投稿はあなたを助けるでしょう。 質問や提案がある場合は、下のコメントセクションにコメントを残してください!

大きなお知らせ、役立つヒント、Diviの景品を見逃さないように、必ずメールマガジンとYouTubeチャンネルを購読してください。