目次
目次
このドキュメントは、Framerを学ぶ日本のユーザーが日本語資料の不足によって直面する困難を解決するため、公式ブログの内容を翻訳し実務に役立つ情報を追加しました。Framerを使用する皆さんの助けになれば幸いです。
Trustpilotウィジェットを挿入する
Framerには基本的にTrustpilotコンポーネントが含まれています。しかし、直接Trustpilotのウィジェットをサイトに埋め込むこともできます。以下のステップを追って進めてください。
1. サイト設定にTrustpilotスクリプトを追加する
まず、Trustpilotから提供される最初のスクリプトをサイト設定のCustom Codeセクション、<head>タグの開始部分に追加してください。

2. Trustpilotウィジェットのコードを検索および編集する
Trustpilotアカウントで二つ目のスクリプトをコピーして、TextEdit(Mac)またはNotepad(Windows)のようなテキストエディタに貼り付けてください。
次に、以下の三つの要素を確認し抽出します。
data-template-id(例: 5407e68dz0d06a09e041d5km)data-businessunit-id(例: 5c09c4742068df0001rrfd35)レビューページURL(例: https://www.trustpilot.com/review/yourdomain)
以下のコードのプレースホルダー(your-data-template-id、your-business-unit-id、your-URL)を上記でコピーしたユーザーデータに置き換えてください。
3. キャンバスにEmbedコンポーネントを追加する
次に、Framerエディタの左側にあるInsertメニューを開いてください。検索ボックスに「embed」と入力し、Embedコンポーネントをキャンバスにドラッグして追加します。

4. Embedコンポーネントにコードを挿入する
右側のプロパティパネルのHTMLタブを選択し、前回完成させたすべてのTrustpilotコードをそのタブに貼り付けてください。

Trustpilotウィジェットのプレビューを確認する
Framerはブラウザ上でのみ<head>と<body>に挿入されたスクリプトを実行し、エディタ内では実行しません。したがって、挿入されたコンポーネントが正しく動作するか確認するには、サイトを公開(Publish)し、ブラウザで直接サイトを確認する必要があります。
もし上記のステップをすべて完了してもウィジェットが表示されない場合は、Trustpilotスクリプトが正しく接続されているかもう一度確認してください。問題が続く場合は、FramerのContactページを通じてサポートを受けることもできます。
この記事はFramer公式ブログの‘Embedding a Trustpilot widget in your site’を翻訳・改編したコンテンツです。






