Xử lý trạng thái node flagged trong Drupal 7 theme

I was recently working on a Drupal 7 project which required updating an Image style on a node based on whether or a flag was set or not.

The Requirements

The specific context was that the nodes were biography nodes and each biography had an image attached. The requirement was to give editors the ability to allow certain bio's to display a large or small version of an uploaded image.

I considered using taxonomy, a CCK field and finally settled on using a flag. Mostly due to the fact that the Flag module places a nice Ajax link on the node for logged in users, allowing them to quickly tag and un-tag the node as needed.

What you need to achieve this is:

  1. An image field.
  2. Two image styles, one small and one large.
  3. One flag which will indicate whether a large or small image will be displayed.
  4. And the following code in your node template or node preprocess function in template.php
$flag = flag_get_flag('your_flag_name_here'); // Get the flag
// If there is an image and this node has been flagged...
if (!empty($node->field_photo['und'][0]['filename']) && $flag->is_flagged($node->nid)) {
  // Show the large image...
  print theme('image_style', array('style_name' => 'profile_pic_lrg', 'path' => $node->field_photo['und'][0]['uri']));
} else {
  // Show the small image...
  print theme('image_style', array('style_name' => 'profile_pic', 'path' => $node->field_photo['und'][0]['uri']));


  1. The first thing to do is get the flag you need to check using the Flag API function


  2. Next, check if the image field exists and check if the node is flagged, this is most important piece of code..


    The $flag object has a Boolean method that allows you to check if a certain Node is flagged, this is exactly what we need. IT returns TRUE if flagged,FALSE if not. If the node has a flag set, we want to display a large image, if not a small one.

  3. The Drupal 7 theme function


    works perfectly for our needs here. The function takes the Image style preset name and an array of information as arguments

Important Note

When testing this I noticed that the image sizes did not change for Anonymous users. The main reason is because flags are usually user based. A user flags content and all of the API functions return status for a certain user or the current user. Because I had flagged the content as an administrator, it was not showing up for anonymous users. I eventually realized that the flag should not be associated with a user and remembered a check-box when setting up the flag that allowed it to be set as a "Global" flag; which meant that it didn't matter which user set it.