How to Create a Sales Page in WordPress

WordPressでセールスページを作成する方法(コーディング不要)

Looking for a quick and easy way to create a sales page in WordPress?

Creating a sales page is the best way to showcase your products and services to potential customers and make them want to buy. But what if you’ve never designed a web page before? What if you have no coding experience and you don’t know how to add custom functionality to your pages?

Fortunately, there’s an easy way to create a sales page in WordPress. In this article, we’re going to help you launch a sales page in less than 15 minutes.

準備はいいですか?始めましょう。

What’s a Sales Page and Why Should You Care?

A sales page is a fully customizable web page that’s focused on selling a product or a service to your website visitors. Unlike a social media site or a marketplace like Amazon or Etsy, your sales page focuses on a single product or service to sell at a time. Even better, it doesn’t showcase all your competitors in the same web page!

Every sales page is designed to convince and convert website visitors into paying customers. Depending on how much time you have, your business model, and how much money you’re expecting to make from your subscribers, you could:

その他多数!

ただし、開始する前に、ランディングページの非常に明確で具体的な目標を設定することを忘れないでください。多くのことができるからといって、すべてを1つのページで行う必要はありません。多くの場合、訪問者にクリックするものが多すぎると、何もクリックしなくなります。

What do All Successful Sales Pages Have?

Now that you know what a sales landing page in WordPress does and why you should build one, it’s time to create a blueprint for your landing page. If you check out any successful landing pages, you’ll notice that they all have some very basic common elements:

  • ヘッドライン:ヘッドラインは、人々の注意を引き、もっと知りたいと思わせる場所です。
  • Description: Just below the headline, you should have a description of what your viewers should expect from the rest of the page. This is a great place to convince readers to buy your product as well.
  • Latest episodes: Once people know what to expect from your brand, give them a taste of your show by listing your latest episodes. We recommend showcasing 3-5 episodes at most.
  • Buy button: Follow up with a purchase button so that your visitors can directly add your product to cart. This is known as the call to action (CTA) button. It’s how you nudge your visitors to take action on your page. Depending on your goal for the landing page, your CTA will vary.
  • Social proof: A great way to give your readers a strong reason to subscribe is by offering social proof. Social proof simply tells your visitor that there are other people who are already taking the same action as you want them to take.
  • Newsletter optin: Once you hit your visitors with the core offer, you can also ask them to become email subscribers. You can also ask them to become push notification subscribers using a click to subscribe button. It’s always best if you offer something valuable in exchange.
  • Social sharing buttons: The more people talk about you on social media, the better chances you have of skyrocketing your subscribers. So, put up social sharing buttons on your landing page to encourage people to share it on social media.

Here’s a sneak peek at the WordPress sales page we’ll be creating in our tutorial.

Create a sales page in WordPress

Remember, these are only the most basic parts of any successful landing page. For your page, you can add a lot of other sections and create custom offers to increase your conversions.

How to Create a Sales Page in WordPress

Now that you know what to create, it’s time to launch your sales page in WordPress. We highly recommend using SeedProd to create your landing pages.

SeedProd 来るページ

SeedProd is the best WordPress landing page builder. It’s perfect for businesses, bloggers, and website owners looking to build high-converting landing pages without any development skills.

With SeedPreed, you get pre-built templates for high-converting landing pages that you can publish instantly. This includes templates for:

そして、さらに多くの機能があります!

ステップ#1:SeedProdのインストールと有効化

まず、SeedProd Proプラグインを入手して有効化します。方法がわからない場合は、WordPressプラグインのインストール方法に関するこの記事をご覧ください。次に、WordPressダッシュボードのSeedProd » Settingsに移動して、Proバージョンを有効化します。

SeedProd ライセンスキーを入力

次に、SeedProdのランディングページダッシュボードの概要を確認するために、SeedProd » Pagesに移動します。ここで、SeedProdを使用して作成できるさまざまな種類のランディングページを確認できます。

SeedProdランディングページの種類

Keep in mind that these are all special pages with pre-built functionality and design templates. For a sales landing page, you don’t want to use ANY of these special landing pages. Instead, you’re going to create a custom landing page.

さらに下にスクロールして、新しいランディングページを追加ボタンをクリックして開始してください。

SeedProd Add New Landing Page

Step #2: Create a New Sales Landing Page

新しいランディングページを追加ボタンをクリックすると、SeedProdのランディングページテンプレートライブラリが表示されます。これらは、完全にレスポンシブな、専門的にデザインされたランディングページテンプレートです。

SeedProd Landing Page Template Library

Next, you can select one of these templates to help you get started. Remember, the template is just a starting point. you can customize everything about the page later on. For now, find a template that you think will fit. When the templates page opens, you can click Sales to filter the list:

Find a sales page template in WordPress

For this guide, we’ll select the Masterclass Sales Page. Go ahead and click on it now.

Select a Sales Page Template in WordPress

Net, we’re going to customize the landing page.

ステップ #3: ランディングページのデザインをカスタマイズする

SeedProdのビジュアルビルダーを使用すると、ドラッグアンドドロップのコンテンツブロックを使用してランディングページをカスタマイズできます。

Customize a sales page in WordPress

You can create a fully customized header for your landing page in a matter of minutes. You can even add custom elements to convince and convert your traffic. For instance, you can create a video module and embed a YouTube video to convince your visitors to buy your product or service.

webinar landing page builder video

It’s also super easy to add a section with a brief description of your product or service . Head over to the Sections tab in the visual builder and under the Hero section, you’ll find several pre-built templates that you can import with a single click.

Create a Hero Section for Your Landing Page

Go ahead and select one that you like.

Don’t worry about the colors or the content. You can edit all of it. What you should look for is a layout that goes well with your template.

You can customize the hero section the same way we did earlier by choosing a different image and changing the headline and description. While you’re at it, add a call-to-action button that nudges visitors to buy from you.

次に、セクションタブから、お客様の声の見出しを選択し、好きなデザインを選びます。そして、あっという間に、ランディングページにお客様の声セクションができます。

Add Testimonials to Landing Page

とても簡単です!

Step #4: Add a Click to Subscribe Button to Your Sales Page

プッシュ通知購読者を収集するために、クリックして購読ボタンを追加することもできます。プッシュ通知は、リピートトラフィックを増やし、エンゲージメントを高め、公式グッズがあれば販売するためにも役立ちます。

SeedProdでは、サイドバーからカスタムHTMLモジュールをドラッグアンドドロップするだけです。

最初の折り目のメールサインアップフォームのすぐ下に、購読ボタンを配置しました。

Sales Page Subscription Button

しかし、ボタンは好きな場所に挿入できます。

For this part, you need some experience with HTML and CSS. Or, you can copy this code and paste it into your Custom HTML block:

<button onclick="subscribeOnClickButton()" style="border: none; padding-left: 5%; padding-right:5%; text-align: center; display: inline-block; color: blue;">Get Updates via Push Notifications</button>

That’s a standard button in HTML with very little styling. The only fancy bit is the onclick function in the code. It basically means that your visitors can click on the button to subscribe to something. Now, we need to give the button some extra code to allow your visitors to subscribe to push notifications.

PushEngageのホームページにアクセスし、開始するボタンをクリックします。

PushEngage

次に、PushEngage を試すために無料プランを選択するか、ビジネスの成長に真剣に取り組んでいる場合は有料プランを選択します。有料プランには、より多くのキャンペーンオプションと、さらに大きな購読者リストを構築する機能が付属しています。

あなたのPushEngageダッシュボードで、サイト設定 »サイト詳細に移動し、セットアップ手順を表示するにはここをクリックボタンをクリックします。「任意のサイト」の下に、インストールコードが表示されます。

PushEngage どのサイトにもインストールコード

警告:ダッシュボードから取得したコードをコピーする必要があります。コードはPushEngageユーザーごとに固有です。画像内のコードをコピーしてプッシュ通知購読者を収集することはできません。

PushEngage ダッシュボードでコードを取得したら、このスニペットをコードに追加します。

<script> window._peq = window._peq || [];</script> <script>
function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
if(res.statuscode==1)
{
// Code to return response
console.log(res);
}
}]);
}
</script>

最終的なコードは次のようになります。

<script src="https://clientcdn.pushengage.com/core/02a6e92667ae2279fcba8932356c1d93.js" async></script>
<script> window._peq = window._peq || [];</script> <script>
function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
if(res.statuscode==1)
{
// Code to return response
console.log(res);
}
}]);
}
</script>

You’ll want to add this code to the HTML block in your landing page after the code for the button. It should look something like this:

HTML Code for Push Subscription Button

Feel free to customize the styles for the button any way you please. When you’re done customizing your sales page, go ahead and hit the Save button.

Step #5: Configure Your Page Settings

After you’re done designing your sales page, click the Connect tab at the top of your page builder, and select your email marketing provider to collect leads on your site.

SeedProdでEメールマーケティングを統合する

次に、画面上部にある「ページ設定」タブをクリックします。

SeedProdポッドキャストランディングページの設定を編集する

Here, you can add an SEO plugin and a Google Analytics plugin to your sales page. You can even set up custom tracking codes such as a Facebook Pixel or a Pinterest pixel to track ad performance.

Step #6: Publish Your Sales Page in WordPress

Now let’s go ahead and publish your design. To do this, click the dropdown arrow next to the save button and click Publish.

Publish Webinar Landing Page WordPress

You can then click the See Live Page button to see how it looks.

Create a sales page in WordPress

Congratulations! You just published your very first sales page.

What to do After You Build a Sales Page

Now that your sales page is live, it’s time to work on your traffic, engagement, and sales. You should try using push notifications on your site. Push notifications are a great marketing tool that can help you grow your business.

これらの素晴らしいリソースをご覧ください。きっと意味がわかるはずです。

プッシュ通知キャンペーンを作成するためにPushEngageの使用をお勧めします。PushEngageは世界No.1のプッシュ通知ソフトウェアです。まだお済みでない場合は、 今すぐPushEngageを使い始めましょう

コメントを追加

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従ってモデレーションされ、すべてのリンクはノーフォローとなりますのでご注意ください。名前フィールドにキーワードを使用しないでください。個人的で有意義な会話をしましょう。

ウェブサイトを離れた後も訪問者をエンゲージし、維持する

見逃せないプッシュ通知で、すべてのウェブ訪問の価値を高めましょう。

  • 永久無料プラン
  • 簡単なセットアップ
  • 5つ星サポート