シードプロッド最新ニュース

ビジネスの成長に役立つWordPressのチュートリアル、ヒント、リソース

見事なアニメーション効果とStripe決済のご紹介

美しいアニメーション効果とStripe決済ボタンのご紹介 

執筆者 著者アバター ステイシー・コリン
著者アバター ステイシー・コリン
ステイシーはWordPressとデジタルマーケティングについて10年以上、その他のトピックについてはもっと長い間執筆している。また、ウェブデザイン、ユーザーエクスペリエンス、SEOにも造詣が深い。
     レビュー レビュアーアバター ターナー・ジョン
レビュアーアバター ターナー・ジョン
ジョン・ターナーはSeedProdの共同設立者です。彼は20年以上のビジネスと開発の経験があり、彼のプラグインは2500万回以上ダウンロードされています。

SeedProdの主な目標の1つは、WordPressサイトのカスタマイズをできるだけ簡単にすることです。これを念頭に置いて、私たちはあなたのサイトをコードなしでより魅力的でユーザーフレンドリーにするための別のエキサイティングな機能リリースで戻ってきました。

本日より、人目を引くエフェクトでウェブサイトのあらゆる部分をアニメーション化できるようになりました。また、Stripeでの支払いを可能にする全く新しいWordPressブロックもリリースしました。

このアップデートにより、SeedProdでの作業がこれまで以上に簡単で楽しくなります。このリリースの概要については、以下のビデオをご覧ください。

WordPressテーマを簡単にアニメーション化

これまで、WordPressサイトにアニメーション効果を追加したい場合、かさばる外部のWordPressプラグインやカスタムコードを使用する必要がありました。しかし、SeedProdの新しいアニメーションオプションを使えば、Proプランの利用者であれば誰でも、パフォーマンスに影響を与えたり開発者を雇ったりすることなく、ユニークなアニメーションウェブサイトをデザインする創造性を発揮することができます。

仕組みはこうだ:

  • ドラッグ&ドロップのページビルダーでレイアウトを開く
  • 任意の要素をクリックする
  • 詳細 設定タブを選択
  • アニメーション・エフェクトを開く
  • アニメーションを選ぶ
SeedProd アニメーション効果

合計46種類のアニメーションエフェクトで、WordPressサイトのどのページにも目を引くトランジションやアニメーションを追加できます。使い方はとても簡単で、数回クリックするだけです。しかも、見ている人を惹きつけるので、エンゲージメントを高めるのに最適です。

さまざまなアニメーションを詳しく見てみよう。

アテンション・シーカーズ

SeedProdの "アテンションシーキング "アニメーションは、まさにそのためにデザインされています。コールトゥアクションボタン、サインアップフォーム、カート追加ボタンなど、重要なデザイン要素に目を向けさせるのに最適です。

SeedProd アテンション・シーカー・アニメーション

アテンション・シーカーのアニメーションは18種類:

  • バウンス
  • フラッシュ
  • パルス
  • ラバーバンド
  • シェイクX
  • シェイクY
  • ヘッドシェイク
  • スイング
  • 多田
  • ウォブル
  • ジェロ
  • ハート・ビート
  • バウンス・イン
  • フリップ
  • フリップ・インX
  • フリップ・イン・Y
  • 左の光速
  • 右の光速

例を挙げようか?

例えば、近日公開のページを作成していて、訪問者にEメール通知を登録してもらいたいとします。数回クリックするだけで、訪問者がページに入ると同時に登録フォームがバウンスし、訪問者の注意を即座に引くことができます。

近日公開ページのオプトインフォームのアニメーション

アプリのプロモーションならどうでしょう?その場合、Google PlayやApp Storeの画像リンクをFlipにアニメーションさせることで、瞬時に目立たせ、クリックしやすくすることができます。

画像のフリップアニメーション SeedProd

スライド、フェード、ズーム、回転

より繊細なアニメーション効果をお探しなら、バック・インやフェード・アニメーションが最適です。

バックインセクションでは、下、左、右、上の4種類のスライドエフェクトから選ぶことができます。4つの異なる方向からページにスライドするので、画像ギャラリーやチームメンバー、サービスなど、緊急性の低いコンテンツを紹介するのに最適です。

例えば、あなたが代理店であれば、Back Inの効果を使って、人々の注意をあなたのポートフォリオにそっと誘導することができる。

ポートフォリオのスライドアニメーション SeedProd

同様に、フェードアニメーションはユニークでエキサイティングなエフェクトを作成するのに役立ちます。例えば、ページを下にスクロールするにつれて、ページ上のすべての要素が上にフェードしていくようなアニメーションを作成できます。

フェード・アニメーション効果 SeedProd

ヘッダー、フッター、サイドバーの要素にアニメーション効果を使うこともできる。

回転エフェクトとズームエフェクトはこれに最適で、ソーシャルメディアのアイコン、ブログのカテゴリー、ナビゲーションリンクなど、重要な情報を強調することができます。

SeedProdの他の機能と同様に、アニメーションエフェクトは100%モバイル対応で、どのようなスクリーンサイズにも適応します。あなたのウェブサイトをカスタマイズする無限の方法を提供し、美しいだけでなく、あなたのウェブサイトのユーザーエクスペリエンスを大幅に向上させることができます。

Stripeを使った迅速な支払い処理

本日リリースするもう一つのエキサイティングな機能は、新しいStripe支払いボタンです。無料・有料ユーザーを問わず、StripeアカウントをSeedProdに接続し、WordPressサイトから直接支払いを受け取ることができます。

注:取引ごとに3%の手数料とStripeの手数料がかかります。

Advanced WordPress blocksセクションでPayment Buttonブロックを見つけ、ページにドラッグします。

SeedProd Stripe支払いボタンブロック

ブロック設定を開くと、Stripeと接続ボタンをクリックしてSeedProdをStripeアカウントとリンクさせることができます。

SeedProdをStripeアカウントに接続する

接続を承認すると、自動的にウェブサイトに戻り、そこで支払いボタンをカスタマイズできます。支払い金額、説明、通貨を編集し、成功URLを追加することができます。

Stripeの支払いブロック設定とリダイレクトオプション

サクセスURLは、購入後もユーザーをウェブサイトに留める素晴らしい方法です。例えば、SeedProdを使用して、チェックアウト後に顧客に表示されるカスタムサンキューページを作成することができます。

Stripe決済後のリダイレクト

さらに、ボタンのスタイリングも簡単です。詳細設定をクリックし、タイポグラフィ、スペーシング、色、デバイスの表示オプションを選択するだけです。

支払いボタンの詳細設定 SeedProd

Stripeペイメントボタンは、小規模なビジネスオーナーにとって素晴らしいニュースです。オンラインストア全体を作成することなく、単一または複数の商品を販売し、シームレスに支払いを受け付けることができます。

今すぐSeedProdプラグインをアップデート

これらの新機能を私たちと同じようにエキサイティングに感じていただければ幸いです。今すぐあなたのサイトをSeedProdの最新バージョンにアップデートして、これらの新機能をお試しください。

もしあなたがSeedProdプラグインを初めてお使いになるのであれば、今がSeedProd Proを入手し、その最もパワフルな機能を楽しむベストタイミングです。

これらの機能についてご不明な点がございましたら、遠慮なくカスタマーサポートまでお問い合わせください。いつでもお手伝いいたします。

皆さんのサポート、提案、フィードバックにとても感謝しています。今後ともよろしくお願いいたします。SeedProdを最高のWordPressウェブサイトビルダーにするための私たちのコミットメントは、お客様と共に勝ち続けることで、ますます強くなっています。

著者アバター
ステイシー・コリン ライター
ステイシーはWordPressとデジタルマーケティングについて10年以上、その他のトピックについてはもっと長い間執筆している。また、ウェブデザイン、ユーザーエクスペリエンス、SEOにも造詣が深い。

情報開示私たちのコンテンツは読者支援型です。つまり、あなたが私たちのリンクをクリックした場合、私たちはコミッションを得る可能性があります。私たちは、読者に付加価値をもたらすと信じる製品のみを推薦します。