StudioMic

PTM・Products-カスタムフィールド

Products→新規追加→カテゴリ選択

Productページは、カスタムフィールドを入力し基本的なテンプレートで表示させる「Product-item」カテゴリと自由書式で書ける「Product-item-free」カテゴリの2つで成り立っています。

新規投稿はダッシュボード左メニュー「Products」の「新規追加」を押下し、まずカテゴリ「Product-item」をチェックボックスで選択することで投稿画面の下にカスタムフィールドの入力欄が表示されます。

レイアウトに必要なもの

14項目が表示されますが、すべてが入力必須ではありません。
製品の情報に応じて必要な項目だけを埋めていきます。
最低限の必須なのは、投稿の「タイトル」「本文」と「写真1」フィールドの3つです。

カスタムフィールドの種類

  • ヘッディング2
  • ヘッディング3
  • データシート1
  • データシート2
  • ZIPファイル名称
  • ZIPファイルURL
  • 写真1
  • 写真2
  • 追加写真1
  • 追加写真2
  • 追加写真3

ここまでが基本レイアウト内に表示されるもので、入力形式は1行テキストかURL形式です。

ヘッディング2

RFR60ITR34-20U, 40U

研究・開発向け 60GHz MIMOレーダ製品評価キット(2.5D/ 2DHR)​

60GHz帯 超広帯域(20U)、狭帯域(40U)にて国内電波法技術適合審査取得済み​

1行目・グレー背景帯に「投稿のタイトル」が表示され、
2行目・下線付きの中見出しがヘッディング2の入力値・テキストです。

ヘッディング3

3行目の小見出しがヘッディング3の入力値・テキスト。

データシート1とデータシート2

製品データシート（PDFファイル）をアップロードしたURLを転記
https://www.ptm-co.jp/・・・からはじまるファイルのアドレスを入力します。

PDF製品データシート

PDFアイコン付きの「製品データシート」というテキストリンクが本文末尾に自動で出力されます。

ZIPファイル名称とZIPファイルURL

ZIPファイルは任意のリンクテキストをつけるため、名称とURLのどちらも入力します。

ZIPオプション：BlueTooth通信 Android用アプリケーション

出力位置は本文末尾・製品データシートの下に表示されます。

写真1と写真2

写真2枚までは本文の右手側に縦配置できます。
「写真2」を使わずに本文下に配置する「追加写真」を記入するのも可。サイズやレイアウトを考慮して使い分けます。

横幅は300pxに縮小表示されるので、それ以上のサイズの写真を用意します。
ディスプレイ解像度を考慮して倍の600px以上が妥当ですが、大きすぎるとブラウザの読み込み速度が落ちるので、負担にならない1500px以下サイズに加工しましょう。

写真はいずれも画像ファイルのURLを記入すると、イメージタグと別タブリンク付きのソースに変換して配置します。

追加写真1・2・3

追加写真は本文下のエリアに独立したブロックを書いて配置されます。写真の数で書かせるブロック枠を変えるため、1・2・3の連番は順序を守って使うこと（2と3だけ使うなどはNG）

投稿記事のプレビュー

WP投稿画面のプレビューは、通常のシングル記事としての体裁でフラットに表示されてしまうため、製品情報を編集中の画面確認には適しません。

新しい記事のプレビューを確認するには、「下書き保存」をしながら編集し、Productページそのものをリロードして見るのが適切です。「下書き」は管理画面にログインしている状態では普通に表示され、一般来訪者には非表示なので編集確認には最適です。

本文の投稿

下の画像がカスタムフィールドをフル活用した場合の基本レイアウトです。
本文は3パラグラフ（段落タグP）で書かれています。
WPのクラシックエディターは改行と空白・空行の扱いがわかりにくくビジュアルモードでたくさんの空白をいれても外観にまったく変化なし・・等々、混乱の元になりやすいので、テキストモードで自分で制御した方が早かったりします。
また使い慣れたテキストエディタで打ったものをテキストモードにコピペするのも時短になります。

段落に空白をつける

■グローバル市場への展開が可能な周波数設定です。RFICの内部にリッチなDSPが搭載されており、高度なプログラムの実装も可能です。仰角識別が可能な2.5次元型をご用意しています。フロントエンド部とバックエンド部はそれぞれ量産に対応しており製品化への移行が容易です。＜改行＞
ご契約により、アンテナのカスタマイズや量産供給までサポート致します。​​
■「製品化への最短距離」をご提案いたします。​​
■※　コアデバイス：　IWR6843​​

■ではじまる3つの段落の間に＜改行＞とは違う空白をあけたい場合、

<p>にクラス"gen__mb--20"をつけると
マージン・ボトム20pxの空白をあけることができます。
<p class="gen__mb--20">・・・</p>
<p class="gen__mb--20">グローバル市場への展開が可能な周波数設定です。RFICの内部にリッチなDSPが搭載されており、高度なプログラムの実装も可能です。仰角識別が可能な2.5次元型をご用意しています。フロントエンド部とバックエンド部はそれぞれ量産に対応しており製品化への移行が容易です。​<br />
		ご契約により、アンテナのカスタマイズや量産供給までサポート致します。​​</p>
<p class="gen__mb--20">「製品化への最短距離」をご提案いたします。​​</p>
<p class="gen__mb--20">※　コアデバイス：　IWR6843​​</p>

この他にも、マージンやパディングといった段落余白に使う共有スタイルは複数用意しているので別項で説明します。

またカスタムフィールド

  • グループタイトル
  • グループ説明文
  • サブグループタイトル

についても別ページで説明しています。