menu

Museでも高機能なフォームを(Adobe Muse CC)

【Adobe Muse】の機能を利用したコンテンツを紹介しています。
サードパーティウィジェット「Jotform」Widgetを利用すると、
Jotformというサービスと連携することで高機能のフォームを簡単に掲載できるようになります。
Jotformは、多段階フォーム、数千のテンプレート、および多数のカスタムオプションを提供しています。
※一定条件まではフリーで使用可能です。

■JOTFORMのセットアップ

1.jotform.comでアカウントを作成。
2.ダッシュボードの左上隅にある[フォームを作成]ボタンをクリックします。
3.フォーム構築プロセスを進める。いくつかのフォームタイプ、それに続くテーマなどがあり、利用可能なフォームオプションは非常に広範囲です。
フォームが完成したら、フォームIDを取得する必要があります。
4。フォームIDをコピーしておきます。

■MUSEのセットアップ

1.ウィジェットをライブラリからドラッグし、デザインモードでプロジェクトにドロップします。
2.ウィジェット自体の配置によって、サイト上のJotformフォームの位置が決まります。
3.必要に応じてウィジェットコンテナのサイズを変更します。
4.取得したフォームIDをウィジェットに貼り付けます。
フォームへの変更はJotform.comで行うことができ、公開後にサイトに自動的に反映されます。

サンプルでは、1ページ目にシンプルなタイプ。2ページ目にカード型のタイプです。

▽サンプル
live-preview

▷「Jotform」Widgetについての詳細はコチラ(外部サイト)
https://www.muse-themes.com/products/jotform

▷Adobe Museでホームページの制作/岸岡デザイン事務所
http://y-kishioka.com

▷Movie Web Magazine/KISHIOKA.DESIGN
http://kishioka.design

transitions_img01トランジションの設定(webflow)

multiscroll01左右の画面を逆スクロールで1枚に合成(Adobe Muse CC)

関連記事

  1. animated-text01

    74種類のテキストアニメーションをAdobe Museで表現(A…

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。「Animated Te…

  2. animated-buttons

    ボタンにアニメーションを付けてワンポイント(Adobe Muse…

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェッ…

  3. dynamic-copyright

    コピーライトの年号を自動で変更(Adobe Muse)

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。コピーライトに年号を使用…

  4. slanted-panels-01

    斜めのラインとスクロール効果を使う流行のデザインも簡単に表現可能…

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェット「…

  5. randomizer01

    イメージのランダム表示(Adobe Muse)

    サードパーティウィジェット「Randomizer」Widgetを利用することで、アクセスする度に…

  6. animate-sample09

    マウスの動きを追いかけるムービークリップに減速効果(Adobe …

    ◎HTML5 CanvasではFlashプラグインを使用せずにインタラクティブコンテンツの表現を…

  7. particles

    写真に重ねた素材に動きを付けて魅力アップ(Adobe Muse)…

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェッ…

  8. table-connect01

    動的な機能を備えたテーブルの作成(Adobe Muse)

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェッ…

PAGE TOP