Conditionally change the image field style and wrapping it in a div

Question

The Article content type has been classified by taxonomy vocab Topic, where each Article's node has one topic.

For some usability and design requirements, I want Articles belongs to a specific topic to render the image field in different image style when it is on the full display mode.

I used the code in node--article.tpl.php:

if ($node->field_topic['und'][0]['tid'] == 154){
     // In some preprocessor...
    $images = field_get_items('node', $node, 'field_image');
    if(!empty($images)) {
      $image = field_view_value('node', $node, 'field_image', $images[0], array(
        'type' => 'image',
        'settings' => array(
          'image_style' => '200x260',
          'attributes' => array('class'=>'center-text')
        )
      ));
    }
    // Testing wrapping the image
    $variables['image'] = "----".$image."----";

    // Now, in your .tpl.php
     $content['field_image'] =  $image;
     }  
  print render($content)

The above code renders the image with HTML code like the following:

<img typeof="foaf:Image" src="http://example.com/path/to/image/10_0.jpg?itok=COlIqejP" width="200" height="260">

However, it works fine but has two limitations:

1- I could not able to figure out how to enclose the image inside a div with css class to style it using CSS. The img tag is supplied only i.e without any wrapping divs or spans!

2- Using it from node--article.tpl.php is not recommended and I have a custom module, but I don't know the suitable node's hook that allows me to perform this task.

Answer 1

You can set wrapper for it with simple way instead

print render($content);

just use

print '<div class="my-wrapper">'.render($content['field_image']).'</div>;

and for second limitation if you have not $node just need load it with node_load ( if you have nid)

So before your code

  $node= node_load($nid);