Panelsが生成するHTMLの変更:可能ですか?


15

私はパネルを使うのが好きですが、パネルは大量のdivを生成するため、スタイルに苦労します。また、それらのdivに適用されるクラスは意味をなさないため、かさばりすぎます。仲間のフロントエンダーの間で混乱を引き起こしています。

生成される出力を表示するには:

パネルによる出力

問題は、私が960.gsを使用していることと、パネルが独自のクラスとかさばるdiv構造を追加しているため、クラスをオーバーライドする必要があることです。これはやりたくないことです。divをクリーンアップしたいです。これを行う方法はありますか?

編集:

私が役に立たないと考えたいくつかのdivをクリーンアップするためにしたこと:

flexible.incの#388行目から開始(panels / plugins / layouts / flexible)

$output = '';     
//$output = "<div class=\"panel-flexible " . $renderer->base['canvas'] . " clearfix\" $renderer->id_str>\n";
    //  $output .= "<div class=\"panel-flexible-inside " . $renderer->base['canvas'] . "-inside\">\n";

      $output .= panels_flexible_render_items($renderer, $settings['items']['canvas']['children'], $renderer->base['canvas']);

      // Wrap the whole thing up nice and snug
      //$output .= "</div>\n</div>\n";

実際に柔軟なレイアウトのコピーを作成して編集しましたが、このプロジェクトにもっと時間があれば、よりクリーンなプラグインを作成します。

注:これは最善の解決策ではありませんこれは私の目標を達成するための最速のルートでした。独自の小さなプラグインを作成するのが最善の方法です。既存のプラグインのいずれかをベースとしていつでも使用できます。

回答:


19

以前にこの問題を調べました。これがあなたが読みたい問題です。それは最初はナッツのように思えますが、実際にこのようになるのには十分な理由があります。

結論:Panels Flexible Layoutsをプロトタイピングツールと考えてください。開発、ステージング、ユーザーテストなどでアイデアを試してドラフトし、完成したレイアウトがサインオフされたら、クリーンで鮮明な、手作業で最適化されたHTMLをカスタムパネルレイアウトとして制作用に実装します(詳細以下のものに)。

私がリンクした問題に基づいて、それがそうである理由の簡単な要約を以下に示します。

  • PanelsのHTML出力には、誰もが作成したいクレイジーで柔軟なレイアウトに対応できるように、すべてのクレイジーマークアップが必要です。ネストされた流体と固定領域の負荷を並べて考えてください。
  • 自動生成されたものはHTML純粋主義者にとって十分なものではないので、Panelsのメンバーは柔軟なレイアウト機能内でそれらを満足させようとしませんでした。そのため、レイアウトによって生成されたHTMLを最小限に抑えるためのHTMLオプティマイザーアルゴリズムはありません。それがどれほど優れていても、それは最高の標準のHTMLではないからです。
  • 彼らが言及していないこと:そのようなオプティマイザーがあった場合、レイアウトへの特定の変更により、現在冗長なdivとクラスが消えます。これらをCSSから切り離した場合、ほとんどの場合、Panelsフレキシブルレイアウトを少し変更するだけでCSSを書き直す必要があります。つまり、Panels Flexible Layoutsを最高水準のプロダクションツールにしようとした(そして失敗した)場合、プロトタイピングツールとしても弱体化することになります。
  • あなたはきれいな、リーンパネルHTML出力を得ることができます。行間を読んで期待されるワークフローは、次のようなものだと考えています。
    • アイデアを試しながら、開発の初期段階でPanels Flexible Layoutsを使用します。
    • 特定のレイアウトに収まった後、クリーンなHTMLが必要な場合は、カスタムレイアウトを使用して実装します。レイアウトに必要な正確な量のHTMLマークアップのみを使用し、サイトの適切なクラス、セマンティクスなどを使用します)。

最初は気に入らなかったが、振り返ってみると理にかなっていると思う。プロトタイピングとプロダクションコンテキストでのベストスタンダードの両方に最適なツールを作成しようとするのではなく、ニーズが非常に異なり、どちらにも適さない妥協しか得られない-彼らはプロトタイプ作成に最適なツールと、無駄のない生産に最適な別のツール(カスタムレイアウト)を使用しました。

これは、最高の標準HTMLに基づいたテンプレートとして最終レイアウトを実装するためにもう少し手間をかけることで、両方を最大限に活用できることを意味します-しかし、HTML純粋主義者は、とにかく少しだけ余分な作業を行いたいと思うでしょうその出力は完璧です。


カスタムパネルレイアウトの作成方法 ありますこれを行う方法上のドキュメントの詳細なガイドが。以下に簡単な基本的な要約を示します。

  1. 既存のレイアウトをコピー/sites/all/modules/panels/plugins/layoutsになるために/sites/all/themes/[your_theme_name]/layouts/[new_unique_layout_machine_name]
  2. 新しいフォルダー名に合わせて、新しいコピーのファイルの名前を変更します。.tpl.phpファイルにはアンダースコアではなくハイフンを使用する必要があることに注意してください。
  3. テーマ情報ファイルに行を追加します。plugins[panels][layouts] = layoutsこれにより、このテーマにカスタムレイアウトがあること、およびパネルの場所がlayoutsわかります(テーマからカスタムレイアウトフォルダへのパスでない場合は文字列を置き換えます)。
  4. 完全で洗練された、最小限の、セマンティックなベストスタンダードのHTMLおよびCSSを使用してファイルを編集します。

    • .inc名前、カテゴリ、ファ​​イル名などのレイアウトに関する情報でファイルを更新することも忘れないでください。
    • theme.incファイル.tpl.php内のファイル名は、拡張子なしでファイル名と一致する必要があります。ここでtheme値に入力したアンダースコアはハイフンに変換されます。
    • また.png、実際のレイアウトをよりよく反映するようにアイコンを編集することも検討してください。
  5. キャッシュをクリアします。新しいレイアウトは、.incファイルで指定した名前、カテゴリなどとともに、パネルにオプションとして表示されます。これを使って。

1
Thnx man !、これは私のために午後の残りを取り上げるつもりです...しかし、それは私の心を少し楽にするために「ハッキング」なしで行うことができます。Btw:問題に関する投稿が見つからなかったため、この投稿が何らかの形でGoogleに掲載されることを願っています:S。
thecodeassassin

@Stephen私は質問をしてから自分の質問になってから6か月以上何かを検索する頻度に驚いています。または同じSEの質問
...- WernerCD

この質問と回答は非常に役立つと思うので、受け入れられたタイトルの編集を提案しました。:私はあそこに同じ質問自分尋ねdrupal.stackexchange.com/questions/69807/theming-panels-html重複している
ジョージKatsanos

5

Panelのマークアップ出力を制御するために、Clean Markup Drupal 7モジュールを検討することもできます。

ブラウザーでこのページを検索しましたが、user568458から提供された非常に優れた総合的な回答も含めて、このページに関する言及はまだ見つかりませんでした。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.