画面幅の固定機能

概要

PLAINERのデモコンテンツの画面幅を、自動調整もしくは固定にすることが可能です。

自動の場合、閲覧者のブラウザ画面の幅に合わせてレスポンシブにレイアウトが変わります。
固定の場合、指定した幅でレイアウトが固定され、閲覧者のブラウザ画面の幅に合わせて拡大縮小されます。

活用シーン

以下のようなケースで活用することが可能です。

• 撮影したデモコンテンツ画面のデザインが、閲覧する画面の解像度やブラウザサイズによって、崩れる場合があるケース
  • 参考: キャプチャした画面上のプルダウンメニューなどの要素の位置が意図した箇所とずれてしまう
• PLAINERの編集画面の右メニューの「高度な編集」機能により変更した、ハイライトの位置が意図した箇所からズレてしまうケース
• サイトへの埋め込みなどで表示範囲が狭い際に、デモコンテンツが見辛くなってしまうケース
• スマホ用のデモや、画像で作成したデモを、よりキレイに見せたいケース
  • 参考: スクリーンショット等の画像で、PLAINERのデモコンテンツを作成したい

手順

• デモコンテンツの編集画面右上の「︙」→「コンテンツ設定」をクリック
  
• 「画面幅の設定」欄のラジオボタンを、「自動」から「固定」へ変更
  
• 数値入力欄に、固定したい画面の横幅のpx数を入力
• 「保存」をクリック
• デモコンテンツ自体の保存をするために、「下書き保存」もしくは「保存して公開」をクリック

参考情報

• キャプチャした時の画面の幅(現在のWindowサイズ)はこちら (※外部サイト)などから確認できますので、確認した値でpx単位をお試しください