web-dev-qa-db-ja.com

Drupal 7)で、レンダリング時にブロックのマークアップを動的に変更するにはどうすればよいですか?

次のような構造のページがあります。

  • ヘッダーゾーン

    • ヘッダー1領域(ブロック)
  • コンテンツゾーン

    • コンテンツ領域(ノード)

レンダリングされたノードには画像が添付されています。必要なのは、添付された画像をコンテンツの一部としてではなく、「Header One Area」ブロック内にレンダリングすることです。

ブロックとその#markupはノードが処理される前にレンダリングされるので、これは難しいことがわかっています。私が持っていたより良いアイデアは、ページの前処理関数を作成し、レンダリングされているnode_idをコードで把握し、そのイメージを取得して、ブロックのマークアップを動的に変更することです。

Template.php内にMYTHEME_preprocess_page()メソッドを作成して、次の方法でブロックにアクセスしてみました。

if ($block = block_get_blocks_by_region('header_one_area')) {
   // what code do I need here to make a #markup modification stick ???
   $block['block_4']['#markup'] = "<h2>TEST</h2>";
   print kpr($block);
}

ここに表示される前に、マークアップを動的に実際に変更する方法がよくわかりません。

何か提案はありますか?

1
skålfyfan

hook_block_view_alter() を探していると思います。変更可能な$data、 と同様 $block、モジュールとデルタが含まれています。

使用可能なブロックを判別するには、次のように開始できます。

function MYTHEME_block_view_alter(&$data, $block) {
  kpr($block->module);
  kpr($block->delta);
}

次に、モジュールを見つけたら:

/**
 * Implements hook_block_view_alter().
 */
function YOURTHEME_block_view_alter(&$data, $block) {
  if ($block->module == 'block' && $block->delta == 1) {
    $data['content'] = '<p>New content</p>';
  }
}

あるいは:

/**
 * Implements hook_block_view_MODULE_DELTA_alter().
 */
function YOURTHEME_block_view_block_4_alter(&$data, $block) {
  $data['content'] = '<p>New content</p>';
}
7
tim.plunkett

変更をブラウザクライアントに委任できる場合は、Jqueryを使用してHTMLを操作できます。あなたのhtmlを操作(変更/移動/切り離し/接続/ etc)するには、この関数(例を含む)を参照してください http://api.jquery.com/category/manipulation/

http://www.w3schools.com/jquery/jquery_html.asp も興味深いリソースです。

1つのhtml要素を別のhtml要素内に移動する1つの例を次に示します(この例では、id = "one"のdivは、div id = "six"の中にappendTo()Jqueryメソッドを使用して挿入されます)。

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("div#one").appendTo("div#six");
});
</script>
</head>
<body>
<div id="one"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/FullMoon2010.jpg/200px-FullMoon2010.jpg"></div>
<div id="two">text</div>
<table border=1><tr><td>
<div id="six">text</div>
</td></tr></table>
</body>
</html>

(前の例のように)ヘッダーでjqueryを使用してpage.tpl.phpまたは、htmlターゲットをレンダリングした後にjqueryを使用できます。

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<div id="one"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/FullMoon2010.jpg/200px-FullMoon2010.jpg"></div>
<div id="two">text</div>
<table border=1><tr><td>
<div id="six">text</div>
</td></tr></table>
<script type="text/javascript">

    $("div#one").appendTo("div#six");

</script>
</body>
</html>
0
cigotete

受け入れられた回答は、ブロックのコンテンツを完全に上書きします。 #prefixおよび#suffixを使用して、コンテンツの前または後にブロックにマークアップを追加できます。

_function mymodule_block_view_alter(&$data, $block) {
  $data['content']['#prefix'] = '<div class="my-class">';
  $data['content']['#suffix'] = '</div>';
}
_

_#prefix_および_#suffix_は、すべてのDrupalレンダー配列がrender()(またはdrupal_render())を介して渡されたときに有効になります。

0
alec