本文へスキップ
ドキュメント

公式資料

統合コンテンツウィジェット

統合コンテンツウィジェット(zittme_content)は、掲示板の投稿・コメントをさまざまな形で表示するレスポンシブウィジェットです。0.0.02 からコアに同梱されています。

核となる考え方は一つです:ウィジェット1個 = 横1行。行を1〜4個のスロット(列)に分け、各スロットに掲示板を接続します。このウィジェットを複数積み重ねれば、ポータル型のメインページが完成します。

すぐに始める

  1. 管理者 > ウィジェット、またはページ編集でウィジェットの挿入を開きます。
  2. 統合コンテンツウィジェットを選び、幅を100%にします。
  3. 行の構成でプリセットを一つ選びます。例:「マガジン 58 + リスト 42」
  4. スロット1・2に掲示板のアドレス(mid)を入力します。例:スロット1 notice、スロット2 free
  5. 保存すれば完了です。別の構成の行がさらに必要なら、同じ方法でウィジェットを下に追加します。
  6. 設定なしで挿入するとウィジェットの位置に使い方の案内が表示されるので、画面を見ながら埋めていけば大丈夫です。

    ブロックの形

    形見た目
    リストタイトルを1行ずつ。コメント数と新着(N)バッジがタイトルの横に付きます
    ウェブマガジンサムネイル + タイトル + 要約
    サムネイル画像カードのグリッド
    マガジン画像の上にタイトルを載せた大型カード。最初の投稿が大きく配置されます
    ミックス上部にウェブマガジン2件 + 下部にリスト
    タブ複数の掲示板をタブで切り替え(カンマで複数の mid を入力)
    最近のコメント最新のコメント一覧

    行の構成プリセット

    数字は幅の比率(%)です。選んだあとは、スロットに掲示板を接続するだけです。

    プリセット用途の例
    マガジン 58 + リスト 42ニュース・ブログのメイン上部
    リスト 42 + マガジン 58上記の左右反転
    ウェブマガジン 50 + サムネイル 50お知らせ + ギャラリー
    リスト 38 + ウェブマガジン 62告知 + お知らせの詳細
    ウェブマガジン 50 + ウェブマガジン 502つのお知らせ掲示板を並べて
    リスト 50 + リスト 50コミュニティ掲示板の2段
    タブ 40 + リスト 30 + 最近のコメント 30コミュニティポータル
    リスト + リスト + 最近のコメント(3等分)コミュニティの下部
    マガジン3枚(3等分)ブランドストーリー
    マガジン 55 + サムネイル 45代表コンテンツ + 最新の画像
    ウェブマガジン1行(100)単独のお知らせセクション
    サムネイルグリッド1行(100)ギャラリーセクション
    マガジン1行(100)ヒーロー型コンテンツ
    ミックス(ウェブマガジン+リスト)62 + リスト 38メインの中段

    カスタム構成

    プリセットで「カスタム構成」を選ぶと、幅の比率とスロットごとの形を自分で決められます。

    • 幅の比率:コロンで区切ります。例:100、50:50、62:38、33:33:33、25:25:25:25(最大4列)
    • スロットの形:スロットごとにリスト/ウェブマガジン/サムネイル/マガジン/ミックス/タブ/最近のコメントから選択

    スロットの設定

    項目説明
    掲示板掲示板のアドレス(mid)。例:notice
    タイトル空欄なら掲示板の名前が表示されます
    表示件数空欄なら構成に合った既定値

    複数の掲示板と全掲示板

    • カンマで複数の掲示板をまとめられます:free,humor(まとめて新しい順)
    • * を入力するとサイトの全掲示板が対象になります(all も使えますが、all という掲示板が実際にある場合はその掲示板が優先)
    • タブの形では、カンマで入力した掲示板ごとにタブが一つずつできます

    新着(N)表示の時間

    投稿後何時間までタイトルの横に N バッジを付けるかを、ウィジェットごとに決めます。空欄なら24時間です。

    スキン

    スキンコメント数N バッジ
    基本+3ポイントカラーの四角いバッジ
    ヘリテージ[3]heritage 掲示板スキンと同じオレンジのバッジ

    heritage テーマを使っているサイトなら、ヘリテージスキンを選んで掲示板と表記を統一してください。

    レスポンシブの動作

    ウィジェットを100%の幅で入れると、別途設定なしで画面サイズに合わせて配置が変わります。

    • 画面 960px 以下:複数の列が2列に減ります。
    • 画面 640px 以下:縦1列に積み重なります。
    • 各スロットの内部も自分の幅に反応します:狭くなるとウェブマガジンは縦型に、サムネイルグリッドは列数を減らします。

    高さは同じ行の中で自動的に揃えられます。

    構成例:コミュニティポータルのメイン

    ウィジェット3個を順に挿入します。

    1. 1行目:「マガジン1行(100)」+ スロット1 notice - 上部の代表コンテンツ
    2. 2行目:「タブ 40 + リスト 30 + 最近のコメント 30」+ スロット1 free,humor,qna / スロット2 notice / スロット3 *
    3. 3行目:「サムネイルグリッド1行(100)」+ スロット1 gallery
    4. よくある質問

      • 投稿が表示されません:mid の綴りを確認してください。掲示板のアドレス(mid)は掲示板設定の URL 項目で確認できます。秘密の投稿と非公開の投稿は表示されません。
      • サムネイルが空です:投稿に画像がないとサムネイルは生成されません。画像のない投稿にはプレースホルダーのアイコンが表示されます。
      • 行の間隔を調整したい:ウィジェット挿入時の余白設定を使うか、ページ側の CSS で調整します。