メディアとアプリの埋め込みセクション

[メディアとアプリ] セクションを使用して、Pinterest ボード、Youtube、Tumblr、Spotify、Vimeo などの外部コンテンツをサイトに追加します。

作業を始める前に
埋め込みブロックは、埋め込み標準を使用するサービスまたは手動で設定された埋め込みコードからコンテンツを取得します。

ここで扱われる内容:

  1. メディアとアプリのセクションとは何ですか?
  2. ページにメディアとアプリのセクションを追加する
  3. リスト アイテムの追加と編集
  4. シーケンス リスト アイテム
  5. リスト項目の削除
  6. セクション レイアウトの変更
  7. スタイルオプション

1. メディアとアプリのセクション

  • Pinterest ボード、Youtube、Tumblr、Issuu、Spotify、SlideShare、Wlista、Vimeo、Soundcloud、Dribble、Facebook、Bandcamp、Flickr、Instagram の投稿、Giphy、Twitch、などを紹介できるメディア & アプリ セクションを Web サイトに簡単に追加できます。カスタム埋め込みコードも含まれます。

2. メディアとアプリのセクションを追加する

  • セクションを追加するには、次のことを行う必要があります。 ページを追加 まずはあなたのウェブサイトへ。
  • あなたのページで、をクリックしてください 青+アイコン 追加する 新しいセクション あなたのページに。
  • 今すぐ セクションカテゴリ 左側にあります。
  • 選択する ソーシャルと埋め込み (1)カテゴリーをクリックし、 埋め込み タブ (2) から選択できます さまざまなレイアウト   埋め込み (3) セクション。

任意のセクション レイアウト (2) を選択し、クリックしてページに追加します。


3. リスト アイテムの追加と編集

リスト アイテムを追加

セクションを追加したら:

  • 以下を行うには、 埋め込みセクションの管理 (1) ボタンをクリックして、リスト アイテム パネルを開きます。

  • 以下を行うには、 アイテムを追加 (2) ボタンをクリックして、新しいリスト アイテムを追加します。

リスト アイテムの編集

  • リスト項目の編集オプションが開きます。
  • リスト項目に URL (1) を追加するか、埋め込みコード (2) を追加します。
  • リンクの追加オプションを選択した場合は、ここにリンク (3)、タイトル (4)、サブタイトル (5)、説明 6) を追加し、タイプを追加できます。 リンク (7)リスト項目へ。 ボタン/画像リンク/ソーシャルアイコン/テキストリンクを追加できます。 さらに詳しく.
  • 場合によっては、埋め込みコードの追加オプションを選択すると、埋め込みコードをここ (3)、タイトル (4)、字幕 (5)、説明 6) に追加し、次のタイプを追加できます。 リンク (7) リスト項目へ。

4. 配列表項目

  • リスト項目を簡単にドラッグ アンド ドロップして、順序を変更できます。

5. リスト アイテムを削除する

リスト アイテムを追加したら、同じものを編集したり、削除したりできます。

  • 以下を行うには、 削除 埋め込みリスト項目の横にあるアイコン。
  • 以下を行うには、 削除 確認ポップアップのボタン。
  • Save あなたの変更。

6.セクションレイアウト

  • 以下を行うには、 埋め込みセクションを編集 (1) ボタンをクリックしてリスト編集パネルを開きます。

  • 選択する レイアウト (2)タブ。
  • セクションのレイアウトを選択し、保存します。 変化 (3).


7. セクションのスタイルを設定する

  • 以下を行うには、 埋め込みセクションを編集 (1) ボタンをクリックして編集パネルを開きます。

  • 選択する スタイル(2) タブには何も表示されないことに注意してください。
  • セクション要素のスタイルを変更し、 保存 (3) あなたの変更。

セクションには複数のスタイル オプションがあります。 

  1. アイテムオプション
  2. テキストサイズオプション
  3. 間隔オプション
  4. セクションの見出し
  5. 切り抜きを埋め込む
  6. シェイプマスク
  7. カードオプション 
  8. 影のオプション
  9. ボタンとリンク

アイテムオプション

  1. に選択します。 アイテムを表示 in 行と列 or カルーセル 
    • を選択した場合 行と列 オプションを選択すると、リスト項目が行と列に配置されます。 この場合、行数と列数を指定する必要があります。
    • を選択した場合 カルーセル オプションを選択すると、リスト項目がスライドショーとして表示されます。
  2. をセットする  列の数 埋め込みリストの場合、1 ~ 10 列から選択できます。
  3. 特定します 列間のスペース リスト項目の。
  4. 特定します 行間のスペース リスト項目の。
  5. 選択する コンテンツの順序 つまり、リスト項目の埋め込まれた部分が最初に表示されるか、または関連付けられたテキストが表示されるかです。
  6. 整列 コンテンツを水平方向に表示 画像リストで。 左、右、または中央揃えに設定できます。


テキストサイズオプション

  1. 以下を行うには、 文字スタイルの変更 にアクセスするためのボタン 設計 セクションと フォントのサイズとスタイルを管理します。
  2. をセットする  Title リスト項目のフォント スタイル。
  3. をセットする  サブタイトル リスト項目のフォント スタイル。
  4. デフォルトを設定する  詳細説明  リスト項目のフォント スタイル。


間隔オプション

  1. 特定します 埋め込み幅 リスト項目(% 単位)。
  2. 特定します コンテンツの幅 リスト項目(% 単位)。
  3. 特定します セクション見出しの下のスペース (ピクセル単位)。
  4. 特定します 埋め込み部分の下のスペース (の %)。
  5. 特定します タイトルの下のスペース リスト項目の (%)。
  6. 特定します 字幕の下のスペース リスト項目の (%)。


セクションの見出し

  1. 水平に揃える セクションの見出しテキスト。左、中央、右に設定できます。
  2. 有効/無効にする 分配器 セクションの見出しとセクションのコンテンツの間。
  3. をセットする  仕切りの厚さ (ピクセル単位)。
  4. 特定します 仕切りの色 カラーピッカーから。
  5. 優先するものを選択してください ディバイダースタイル.


切り抜きを埋め込む

  • 選択する 切り抜きを埋め込む1:1 正方形、2:1 水平、3:2 水平、4:3、3:4、16:9、2.4:1、元の埋め込みクロップとして設定できます。


シェイプマスク

  1. シェイプマスク: このトグルを有効にすると、埋め込みセクションの画像にシェイプマスクが適用されます。有効にすると、選択したシェイプが画像に視覚的にクリップされ、そのフォームに収まります。
  2. 形状を選択: 画像に適用するさまざまな定義済み形状から選択します。これにより、丸型、ダイヤモンド型、ドロップ型などのユニークな形で画像を表示して、コンテンツをクリエイティブにスタイル設定できます。

Notes

  • シェイプマスクオプションはレイアウトに依存します – タイトルやサブタイトルなどのテキストが画像の上に表示されるレイアウトでは表示されない場合があります。
  • ストレッチ設定は複数の要因に依存します – スタイル タブで定義された画像サイズ、配置、切り抜きの設定が含まれます。
  • 画像の切り抜きがオリジナルに設定されている場合画像の実際の寸法によって、垂直方向に引き伸ばされるか、水平方向に引き伸ばされるかが決まります。


カードオプション


影のオプション

  1. ディスプレイ – リスト項目の背後にある影を常に表示するか、ホバー時にのみ表示するかを選択します。
  2. 形式 – 既存のプリセットから選択するか、カスタム シャドウを作成します。
    カスタムオプションを選択した場合は、これにアクセスしてください ボックスシャドウジェネレータ カスタム シャドウを作成します。 最後に、コピーして貼り付けます ボックス シャドウ CSS.
  3. プリセットオプションを選択した場合は、 影のスタイルを選択 をドロップダウンから選択します。


ボタンとリンク

  1. 方法を参照してください ボタンとリンクのスタイルを管理します。
  2. Save 変更。


お探しのものが見つかりませんか?

Pixpaエキスパートに連絡してください。

Pixpa Studioがリニューアルされました。現在、ヘルプ記事のスクリーンショットをすべて更新中です。