Container - 中央大学...2019/06/06 ·...

Container™CMS使用者マニュアル

中央大学公式サイトVer.003｜edit 2019.4.5

INDEX

Copyright © 2019 Container™ .All Rights Reserved.

記事作成から公開までの流れ

STEP #01 ログイン

STEP #02 マイページ

STEP #03 新規作成

STEP #04 記事作成方法①：ファイルアップ・リンク方法②：画像加工方法③：プレビュー

STEP #05 公開方法

STEP #06 公開先指定

Modules モジュール一覧

2

STEP #01 ログイン


ブラウザを立ち上げ、ログイン画面にアクセスします

https://www.chuo-u.ac.jp/admin/上記のURLへアクセスし、統合認証情報を入力しログインしてください。

3

STEP #02 マイページ


ログイン後にマイページが表示され、操作はこのページからはじめます

ログインするとマイページが表示されます。このマイページでは、記事の投稿・編集ができるほか、記事の承認状況の確認、管理者からのお知らせを確認することができます。

それぞれのアカウント別に “操作可能” な部分が表示されます

4

STEP #03 新規作成


投稿するカテゴリを選び “新規作成” をクリックし「記事作成・編集画面」へ進みます

アカウントにより作成・編集が可能なコンテンツは異なりますが、本マニュアルでは「新着ニュース」の記事作成を例にご説明します。

5

STEP #04 記事作成方法


❷プルダウンメニューあらかじめ用意された「問い合わせ先」から選択できます

「記事作成・編集画面」の入力事項に沿って作成を進めます

これから作成を進めるページの場所が正しいか作成前に確認します。

Check!!

Point作成・編集の主な項目は次の通りです

❶「タイトル」テキスト入力エリア作成者本人で用意した「タイトル」テキストを入力できます

記事投稿 / 公開操作エリア

❹ モジュール選択 & 追加ページを作成する際に必要なパーツを追加できます。あらかじめ用意されたモジュールを選択します※モジュールのバリエーションについてはP9以降をご覧ください

❸ 画像アップロード & 削除トップページに表示するサムネイル画像素材のアップロードと削除ができます

作成中常に画面に表示されるフローティングボタン※上下のマークはスクロール

ファイル・アップロードこの画面からPDFなどのファイルをアップロードし、生成されたURLをコピー/貼り付けできます

プレビュー作成中のページが実際にどのように表示されるかをチェックすることができます

❺ サポート機能

お知らせ表示エリア

❶

❷

❸

新たな記事の作成における基本操作は以下の通りです。

6

❹



①ファイルアップ・リンク設定方法は作成画面の右側に表示されるアイコンをクリック

ファイル・アップロードこの画面からPDFなどのファイルをアップロードし、生成されたURLをコピー/貼り付けできます

作成画面の右側に表示される

フローティングボタン



①ファイルアップ・リンク設定方法「リンク > リンクリスト」のモジュールを使う場合

作成画面の右側に表示されるボタン

❶「ファイルアップロード」ボタンをクリックデスクトップなど任意の場所にファイルを用意して、ファイルアップロードボタンをクリックします。

↓ ファイルリンクを設定する場合、ここに入力

❷ファイルアップロード画面ファイルアップロード画面が表示されるので、用意しておいたファイルを、グレーの四角枠にドラッグ＆ドロップするか、グレーの四角枠をクリックしてファイルを選択しアップロードします。

❷

❶




❸

❹

❸アップされたファイルのリンク先URLファイルをアップすると、アップされたファイルのリンク先URLが表示されます。

❹ URLのコピーボタン「クリップボードにコピー」ボタンをクリックし、③に表示されたURLをコピーします。




❺ URLをペースト（貼り付け）

リンク先の入力欄に、カーソルをあわせて（入力できる状態）、パソコンのキーボードで「Ctrl+v」を押す、またはマウスの右クリックで「貼り付け」を選択すると先ほどコピーしたファイルのURLが表示（貼り付け）されます。これで、ファイルリンクの設定が完了です。

↓ ファイルリンクを、ここにペースト5



①ファイルアップ・リンク設定方法「テキスト > 本文（エディター）」モジュールを使う場合

作成画面の右側に表示されるボタン

❶「ファイルアップロード」ボタンをクリックデスクトップなど任意の場所にファイルを用意して、ファイルアップロードボタンをクリックします。

❶テキストにファイルリンクを設定する場合

学校法人中央大学（以下「本学」といいます。）は、日本国憲法の精神に則り、「個人の尊厳」を尊重し、学生・生徒および教職員（以下「構成員」といいます。）等にとって快適な教育（修学・学習を含む。）・研究、就業環境を作り出し、維持するために、「中央大学ハラスメント防止啓発ガイドライン」(433KB)（以下「ガイドライン」といいます。）を作成します。

❷ファイルアップロード画面ファイルアップロード画面が表示されるので、用意しておいたファイルを、グレーの四角枠にドラッグ＆ドロップするか、グレーの四角枠をクリックしてファイルを選択しアップロードします。

❷

https://www.chuo-u.ac.jp/uploads/2018/10/g02-02.pdf?1553614966419



❸

❹

❸アップされたファイルのリンク先URLファイルをアップすると、アップされたファイルのリンク先URLが表示されます。

❹ URLのコピーボタン「クリップボードにコピー」ボタンをクリックし、③に表示されたURLをコピーします。




リンクを貼りたいテキストを選択

リンクをしたいテキストを選択します。


学校法人中央大学（以下「本学」といいます。）は、日本国憲法の精神に則り、「個人の尊厳」を尊重し、学生・生徒および教職員（以下「構成員」といいます。）等にとって快適な教育（修学・学習を含む。）・研究、就業環境を作り出し、維持するために、「中央大学ハラスメント防止啓発ガイドライン」(433KB)（以下「ガイドライン」といいます。）を作成します。

「中央大学ハラスメント防止啓発ガイドライン」

5

5

編集機能の「リンク設定」ボタンをクリック

リンクをしたいテキストを選択したら、その状態のままで「リンク設定」アイコンをクリックします。

6

6




7

リンクの設定7

8

「ハイパーリンク情報」のタブ画面が表示されたら、⑦のURL入力欄に、カーソルをあわせて（入力できる状態）、パソコンのキーボードで「Ctrl+v」を押す、またはマウスの右クリックで「貼り付け」を選択すると先ほどコピーしたファイルのURLが表示（貼り付け）されます。

別Windowで開く設定8

次に「ターゲット」のタブをクリックし、ターゲットの画面を表示します。ターゲットの一覧から「新しいウィンドウ（_blank）」を選択し最後に「OK」ボタンをクリックします。

これでテキストへのファイルリンク設定が完了です。

通常のテキストリンク（サイトへのリンク）の設定も⑤⑥⑦⑧（⑧は外部サイトにリンクする場合のみ設定）の手順で設定ができます。⑦にリンクしたいサイトのURLを入力します。

Point



②画像のアップロードと加工の方法「リサイズ」と「切り抜き」ができます。

❶❶「画像アップロード」ボタンをクリック

デスクトップなど任意の場所に画像を用意して、画像アップロードボタンをクリックします。

例えば、画像を掲載するモジュールを選択した場合「画像アップロード」のボタンをクリックします。

❷ファイルアップロード画面ファイルアップロード画面が表示されるので、用意しておいた画像を、グレーの四角枠にドラッグ＆ドロップするか、グレーの四角枠をクリックしてファイルを選択しアップロードします。

❷



②画像のアップロードと加工の方法「リサイズ」

＜画像がアップされた状態＞

❸画像をリサイズする場合A「変更後サイズ」にリサイズしたい画像サイズの数値を入力

↓B「処理」の「リサイズ」のラジオボタンを選択

↓C「保存」ボタンをクリック

↓D「投稿に挿入」ボタンをクリックで、リサイズした画像が記事画面に反映されます。

❸

A

B

CD

←このようにリサイズされます。



②画像のアップロードと加工の方法「切り抜き（トリミング）」

＜画像がアップされた状態＞

A

B

CD

このように自分が切り抜きたい範囲を指定します

❹画像を切り抜き（トリミング）する場合A 画像の四隅などにカーソルをあわせてサイズを縮小し、切り抜きたい箇所に点線の四角枠を移動させ範囲を指定

↓B「処理」の「切り抜き」のラジオボタンを選択

↓C「保存」ボタンをクリック

↓D「投稿に挿入」ボタンをクリックで、切り抜きした画像が記事画面に反映されます。



③プレビュー方法作成画面の右側に表示されるアイコンをクリック

プレビューマーク作成中のページが実際にどのように表示されるかをチェックすることができます

作成画面の右側に表示される

フローティングボタン

STEP #05 公開方法


作成した記事の公開に向けての登録を行います

記事ページの作成が完了したら、公開設定を行います。

Point❶掲載場所を指定どのエリアに表示させるかを選択します

❷ SNSボタンの表示選択表示の有無を選択します

❸ RSSボタンの表示選択表示の有無を選択します

❺公開日時を入力します

左: 公開開始日時記事を公開する日時

右: 掲載終了日時記事の掲載を終了する日時※日時は枠をクリックすると表示される情報から選択できます

19

❶

❷

❸

❹

❺記事を投稿します

左: 下書き保存ボタン記事を公開せず下書き保存する

右: 公開（公開申請）記事を公開する

（公開権限が無い方は「公開申請」となります）

66

❹読み込み先を選択読み込み先を選択します。※次ページに詳細説明

STEP #06 公開先指定方法


作成した記事を他カテゴリーに掲載したい場合

作成した記事ページを他カテゴリーに掲載を行います。

Point

❶読込先を開く右端のボタンをクリックし読込先一覧を開きます。

❷読込先を指定掲載したいカテゴリーを選択します。

20

❶

❷

ここをクリック⇒

＜読み込み先が開いた状態＞

Modules

主要モジュール解説


Pattern

BPattern

CPattern

DPattern

EPattern

FPattern

G

Pattern

A

本文

表組み + 本文

表組み

リンクボタン

テキストリンク

画像

画像 + 本文

Pattern

HPattern

IPattern

JPattern

K

区切り線

動画

21

Pattern

MPattern

N

Pattern

L

Adobe PDFリンク

見出し（小・中）

見出し（数字リスト）

罫線付きコンテンツ

箇条書きリスト

Modules 主要モジュール説明


見出し > 中・小見出しPattern

A

中・小見出しのモジュール見出しのモジュールです。見出し2（H2）、見出し3（H3）、見出し4（H4）、見出し5（H%）の4種類の中から、いずれかを選択して設定します。

22

◎見出し

◎見出し



見出し > 数字リストPattern

B

数字リストの見出しのモジュール数字付き見出しのモジュールです。連番にしたい場合は「数字をリセット」の項目で「しない」を選択してください。

23

1．見出し

2．見出し



テキスト > 本文（エディター）Pattern

C

本文のモジュールテキストのみの掲載エリアを作成するモジュールです。横列は最大3カラムまで組むことが可能です。※通常は、表示例のように「1列」で作成

Text

24



テキスト > 罫線付きコンテンツPattern

D

罫線付きコンテンツのモジュール囲みや、背景付きテキストを作成するモジュールです。背景色をなしにすると罫線での囲みのみ、背景色をグレーまたはピンクにすると、背景色をつけることができます。

25

Text



画像 > 画像 + 本文Pattern

E

画像 + 本文のモジュール Text+画像とテキストの組み合わせで作成するモジュールです。

画像の表示は、左右の配置、クリック時のポップアップ表示を指定でき、キャプションの入力も可能です。

26

※「セットを追加」をクリックすると、同じモジュールが追加表示されます。上下に追加可能。



画像 > 画像ギャラリーPattern

F

画像のモジュール画像のみ掲載するエリアを作成するモジュールです。1列に最大3枚まで横に画像を並べることができます。※1枚のみの時は左寄せ

27




リンク > リンクリストPattern

G

テキストリンクのモジュールテキストリンクを作成するためのモジュールです。メニュー名にテキストを入力、リンク先ページの開き方、段落（行頭おとし）が選択できます。リンク先が「公式サイト内 / 外」によりアイコンが変わります。※リンクの入力方法は下記参照

リンク先の設定

公式サイト内の場合 ※http://www.chuo-u.ac.jp 以降を入力

→例 /academics/faculties/law/

外部サイトの場合 ※http://から入力

→ 例 https://yab.yomiuri.co.jp/adv/chuo/index.html

28

※「リンクを追加」をクリックすると、同じモジュールが追加表示されます。上下に追加可能。



リンク > リンクボタンPattern

H

リンクボタンのモジュール Text

リンクボタンを作成するためのモジュールです。「前のページに戻る」や「カテゴリトップに戻る」などのバックボタンや、外部のサイトへのリンクをボタンで表示する際に使用します。ボタンのサイズは3種類ありますが、「可変（テキストの文字数で幅を設定）」を推奨します。

29

>



箇条書き > リストPattern

I

箇条書きリストのモジュール箇条書きのリストを作成するモジュールです。リストの表示は、カッコ付き（数字）、黒丸（大 /小）が選択でき、横は最大３列（3カラム）まで組むことができます。※リンク先がない通常のリストの場合は、リンク先の入力はなし

30

※「リンクを追加」をクリックすると、同じモジュールが追加表示されます。上下に追加可能。



テーブル > テーブルPattern

J

表組みのモジュール表組みを作成するモジュールです。※基本の表組みは、左セル（Title）が項目名になるパターンです。他のパターン設定については、次ページを参照ください。

31



表組みのモジュール別パターンを設定する方法です。

32

❶セルを選択して（選択箇所はどこでも可）、右クリックメニューが表示されるので「表のプロパティ」を選択します

❷行数、列数、ヘッダをそれぞれ設定します行数：必要な行数を入力します列数：必要な列数を入力しますヘッダ：項目セルの設定ができます。

❸画表組みのセル、行、列の設定ができます挿入、削除、セルの結合ができます



テーブル > テーブル + 本文Pattern

K

表組み + 本文のモジュール Text+表組みと本文を合わせた表示エリアを作成するモジュール

です。表の配置は左右選択できます。

33




Pattern

34

※実線と点線を選択いただければ、モジュールの追加のみで、区切り線が追加されます。

区切り線のモジュール複数のモジュールを組み合わせた場合に必要に応じて区切り線を追加できるモジュールです。「実線」と「点線」タイプのいずれかを選択できます。

エリア区分 > 区切り線L



Pattern

35

動画のモジュール動画を掲載できるモジュールです。Youtubeなどにアップした動画の埋め込み用ソースを登録することで、動画を挿入・表示することができます。

M その他 > 動画




Pattern

36

Adobe PDFリンクのモジュールAdobe PDFリーダーのダウンロードへの誘導を表示するモジュールです。

N その他 > Adobe PDFリンク

PDF

※表示例

Container - 中央大学...2019/06/06 ·...

Documents

Transcript of Container - 中央大学...2019/06/06 ·...