フリップブックのブランディング(ロゴ、ファビコン、スキン、背景)

ブランディングとコンテンツ

フリップブックのビューアーをAPIでブランディングできます。ロゴ、ファビコン、背景画像、スキン/テーマ、カスタムの読み込み画面テキストを設定します。

このディスカッションで使うAPI

このガイドに誤りや古い情報がありますか?

できること

5つの書き込みエンドポイントで、ダッシュボードに触れることなくフリップブックのホスト型ビューアーをブランディングできます。各エンドポイントは1つのフリップブック({flipbookId}で指定)を対象に、外観の1つの側面を変更します。

  • ビューアーのヘッダー/ブランディング領域に表示されるロゴを設定する
  • ホスト型ビューアーページのファビコン(ブラウザタブのアイコン)を設定する。
  • ビューアーにスキン/テーマを適用する
  • ビューアーの背景画像を設定する
  • ビューアーの読み込み画面に表示されるカスタム読み込みテキストを設定する

始める前に

  • APIキー — すべてのリクエストでX-Api-Keyヘッダー、またはAuthorization: Bearer YOUR_API_KEYとして送ります。
  • {flipbookId} — ブランディングしたいフリップブックの数値IDです。create-by-file/create-by-url(IDとして)や一覧から返されます。5つのエンドポイントはいずれも、これをパスパラメーターとして取ります。
  • すべてのリクエストの送信先はベースURL https://go.fliplink.meです。
  • ここでの各リクエストボディはform-urlencoded(JSONではありません)です。各フィールドは--data-urlencodeで送ってください。

ロゴを設定する

フリップブックビューアーのヘッダー/ブランディング領域に表示されるロゴ画像を設定します。

curl -X PUT 'https://go.fliplink.me/api/set-logo/96216' \
  -H 'X-Api-Key: YOUR_API_KEY' \
  --data-urlencode 'LogoIMG=' \
  --data-urlencode 'LogoURL=' \
  --data-urlencode 'IsShowLogoMobile=false'

このエンドポイントは、3つのボディフィールドを受け付けます。

  • LogoIMGロゴ画像そのもの(そのURL/パス)。ビューアーのヘッダー/ブランディング領域に表示される画像です。
  • LogoURL — ロゴが指すクリック先リンク。ロゴをクリックするとこのURLが開きます。デフォルトはhttps://fliplink.meです。
  • IsShowLogoMobile — モバイルでロゴを表示するかを切り替えるブール値(true / false、デフォルトはfalse)。

レスポンス:

{
  "Result": "OK",
  "Message": "Updated successfully"
}

ファビコンを設定する

フリップブックのホスト型ビューアーページで使うファビコン(ブラウザタブのアイコン)を設定します。

curl -X PUT 'https://go.fliplink.me/api/set-favicon/96216' \
  -H 'X-Api-Key: YOUR_API_KEY' \
  --data-urlencode 'FaviconIMG='

レスポンス:

{
  "Result": "OK",
  "Message": "Updated successfully"
}

スキンを適用する

フリップブックにビューアーのスキン/テーマを適用します。サーバーがスキン名をそのIDに解決します。フィールドはSkinName(list-skinsが返す文字列)であり、数値IDではありません。

curl -X PUT 'https://go.fliplink.me/api/set-skin/96216' \
  -H 'X-Api-Key: YOUR_API_KEY' \
  --data-urlencode 'SkinName='

レスポンス:

{
  "Result": "OK",
  "Message": "Updated successfully"
}

背景画像を設定する

指定したURLからビューアーの背景画像を設定します(組み込みのギャラリーはありません)。BackgroundIMGは画像URL、またはhttps://plchldr.co/i/100x100?text=&bg=HEXのようなプレースホルダーURLを取ります。色の値は16進の#RRGGBB文字列で、そのまま保存されます。

curl -X PUT 'https://go.fliplink.me/api/set-background-image/96216' \
  -H 'X-Api-Key: YOUR_API_KEY' \
  --data-urlencode 'BackgroundIMG='

レスポンス:

{
  "Result": "OK",
  "Message": "Updated successfully"
}

読み込みテキストを設定する

ビューアーの読み込み画面に表示されるカスタムテキストを設定します。フィールドはCustomLoadingTextであり、LoadingTextではありません。

curl -X PUT 'https://go.fliplink.me/api/set-loading-text/96216' \
  -H 'X-Api-Key: YOUR_API_KEY' \
  --data-urlencode 'CustomLoadingText='

レスポンス:

{
  "Result": "OK",
  "Message": "Updated successfully"
}

起こりうるエラー

これらは5つのエンドポイントすべてに当てはまります。

  • APIキーが欠けているか無効な場合 → HTTP 401。これはプレーンなUnauthorized HTMLページを返し、JSONボディはありませんX-Api-Key(またはAuthorization: Bearer)ヘッダーが存在し、正しいことを確認してください。
  • アイテムIDが見つからないか、キーが所有していない場合 → HTTP 200Message: "Item not found"
  • 不明またはスペルミスのボディフィールド → HTTP 200Message: "Unknown field(s) '…'. Expected: …"

メモ

  • スキンの設定では、スキンのName/api/list-skinsから取得)をSkinNameに送ってください。数値IDではありません。
  • 読み込みテキストの設定では、フィールドはCustomLoadingTextです。LoadingTextを送ると、不明なフィールドとして拒否されます。
  • 背景画像の設定では、組み込みのギャラリーはありません。画像URLは自分で用意してください。

関連ディスカッション