Contaoのアーティクルの管理方法
アーティクルはコンテント要素の入れ物です。コンテント要素を一緒にグループ化すると移動、公開、複製、編集、エクスポートを個々に扱うのでなく一度にまとめて行えます。それぞれのアーティクルは特定のページとレイアウトセクションに関連付けられています。このため、ウェブサイトとサイト構造の固定した位置となります。Contaoには続きを読むのリンクを付けた、アーティクルのティーザーだけを表示する追加の機能があります。
コンテント要素
コンテント要素はコンテンツを作成する簡単で直感的な方法です。単にリッチテキストエディターを使用する代わりに、Contaoはテキスト、箇条書き、表、ハイパーリンク、画像、ダウンロードといった各種のコンテンツに分けたコンテント要素を提供しています。Contaonのコアのコンテント要素の概要をここに示します:
名前 | CSSのclass | 説明 |
---|---|---|
見出し | cs_headline | 見出しを生成します(h1からh6)。 |
テキスト | cs_text | TinyMCEを使用して書式整形できるリッチテキストエディターを生成します。 |
HTML | - | 独自のHTMLコードを追加できます。 |
箇条書き | ce_list | 順序付き、または順序なしの箇条書きを生成します。 |
表 | ce_table | 並べ替え可能にもできる表を生成します。 |
アコーディオン | ce_accordion | MooToolsのアコーディオンの枠を生成します。 |
コード | ce_code | コードの断片を強調表示して画面に表示します。 |
ハイパーリンク | ce_hyperlink | 他のウェブサイトへのリンクを生成します。 |
トップリンク | ce_toplink | ページの先頭に移動するリンクを生成します。 |
画像 | ce_image | 単体の画像を生成します。 |
ギャラリー | ce_gallery | lightboxの画像ギャラリーを生成します。 |
ダウンロード | ce_download | 単体のファイルをダウンロードするリンクを生成します。 |
複数ダウンロード | ce_downloads | 複数のファイルをダウンロードするリンクを生成します。 |
アーティクル | - | 他のアーティクルを取り込みます。 |
コンテント要素 | (親のclass) | 他のコンテント要素を取り込みます。 |
フォーム | ce_form | フォームを取り込みます。 |
モジュール | (親のclass) | フロントエンドモジュールを取り込みます。 |
アーティクルのティーザー | ce_teaser | アーティクルのティーザーを取り込みます。 |
コメント | ce_comments | アーティクルにコメント欄を追加します。 |
アクセス制御
各コンテント要素を保護することができ、ウェブサイドでゲストだけか、特定のグループのメンバーだけが見られるようにできます。
Flashコンテンツ
FLashコンテンツは特殊なコンテンツで、ウェブサイトのアーティクルに表示されずに動的なFlash動画をloadVars()を使用して読み込みます。ContaoとFlashの間の通信を可能とするため、以下の関数を動画のルートのフレームに追加しなければなりません。
TextField.prototype._loadArticle = function(flashID) {
tf = this;
// HTMLモードを有効にして、HTMLのコンテンツを削除
tf.html = true;
tf.htmlText = "";
// 新しいLoadVarsオブジェクトを生成
lv = new LoadVars();
lv["flashID"] = flashID;
lv.sendAndLoad(URL + "flash.php", lv, "POST");
lv.onLoad = function(success) {
if (success) {
tf.htmlText = lv["content"];
}
}
}
// Flashのコンテン"myArticle"をテキスト項目の"myTextBox"に読み込み
myTextBox._loadArticle("myArticle");
スタイルシートのインポート
以下のActionScriptで動的なテキスト項目を整形するスタイルシートをインポートできます:
TextField.prototype._addCSS = function(style_sheet) {
tf= this;
tf.styleSheet = null;
// 新しいStyleSheetオブジェクトのインスタンスを生成
st = new TextField.StyleSheet();
st.load(URL + style_sheet);
st.onLoad = function(success) {
if (success) {
tf.styleSheet = st;
}
}
}
// スタイルシート"basic.css"をテキストボックス"myTextBox"に追加
myTextBox._addCSS("basic.css");
FlashはHTMLタグの少ない一部だけをサポートしているため、正しく表示されないスタイルもあることに注意してください。