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タグの少ない一部だけをサポートしているため、正しく表示されないスタイルもあることに注意してください。