レイアウト（詳細）

（2021.07.08改訂）

レイアウト詳細

詳細ページではレイアウトのソースコードを編集できます。

①のプルダウンを切り替えることで別のカテゴリー、レイアウトの詳細画面へ遷移することができます。
②CPタグボタンをクリックすると、使用できるCPタグの説明、入力例の確認とCPタグのコピーができます。

画像を挿入する

エディター左上メニューから「画像挿入」をクリックします。

レイアウト（詳細）３

ポップアップされたアルバムメニューから挿入したい画像をクリックします。

レイアウト（詳細）４

エディターのカーソル位置にimgタグが挿入されます。

リンクを挿入する

エディター左上メニューから「リンク挿入」をクリックします。

レイアウト（詳細）６

ポップアップされたリンクメニューから挿入したいリンクの「OK」をクリックします。

レイアウト（詳細）７

エディターのカーソル位置に該当ページのaタグが挿入されます。

CSS、JSを追加する

カテゴリーのコードを指定してCSSを出力する

<cp:css category_code="basic" media="all"></cp:css>

コードを指定してCSSを出力する

<cp:css category_code="カテゴリーコード" code="スタイルコード" media="all"></cp:css>

カテゴリーのコードを指定してJSを出力する

<cp:js category_code="カテゴリーコード"></cp:js>

コードを指定してJSを出力する

<cp:js category_code="カテゴリーコード" code="スクリプトコード"></cp:js>

コンポーネントを追加する

コンポーネントを追加する際、下記のようなコード（例はヘッダー部分と仮定）を書きます。

<cp:component category_code="base" code="header"></cp:component>

ニュース・イベントレイアウト詳細　

ニュース・イベントレイアウト詳細の独自タグをを利用する際は、下記のコード内に入力します。

ニュースレイアウト

イベントレイアウト

レイアウト作成時の注意

ニュース詳細記事のOGP設定に関して

ニュース詳細記事のOGP設定はPHPでの設定が望ましいです。

例

<cp:php
source="
$news_title = '';
$news_url = '';
$news_thumbnail = 'https://www.shibaura-it.ac.jp/ogimage.png';
$news_url = (empty($_SERVER['HTTPS']) ? 'http://' : 'https://') . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
$url_search = ['/news/','/event/','/staging/json/','.html'];
$url_replace = ['/json/','/json/','/json/','.json'];
$json_url = str_replace($url_search,$url_replace,$news_url);
$json = file_get_contents($json_url, false, stream_context_create($opts));
$json = mb_convert_encoding($json, 'UTF8', 'ASCII,JIS,UTF-8,EUC-JP,SJIS-WIN');
$arr = json_decode($json,true);
if ($arr !== NULL) {
$path_parts = pathinfo($news_url);
$dir = $path_parts['dirname'];
$json_id = $arr['cms_news_id']; //jsonのcms_news_id
$json_title = $arr['title']; //jsonのtitle
$json_thumbnail = $arr['thumbnail_file_name']; //jsonのthumbnail_file_name
$news_title = str_replace(array('\r\n', '\r', '\n'), '', $json_title);
if($json_thumbnail != null && $json_thumbnail != ''){
$news_thumbnail = $dir . '/albums/' . $json_id . '/' . $json_thumbnail;
}
}
" />