How to set image style for particular image in node creation or edit?

Question

I want to add some image style to the particular image, preferably the first image for adding some badge like "Agent Face Image".

My idea is when creating the node, there is an option for check box. If the user selected the check box, a particular style need to be applied to that image only, if unchecked then vice-versa. I'm using Drupal 6.

How can I achieve this?

Answer 1

If you are asking "How can I theme the first image in a multi-value field differently from the remaining images in that field?" you can use a custom field template.

First, copy content-field.tpl.php from the CCK module (found in modules/cck/theme/content-field.tpl.php) to your theme's directory.

Then copy it to content-field-field_NAME_OF_FIELD.tpl.php eg something along the lines of content-field-field_pictures.tpl.php.

NOTE: You must have both content-field.tpl.php and content-field-field_whatever.tpl.php in the same directory in your theme or it won't work.

Inside, it looks basically like this:

<?php if (!$field_empty) : ?>
<div class="field field-type-<?php print $field_type_css ?> field-<?php print $field_name_css ?>">
  <?php if ($label_display == 'above') : ?>
    <div class="field-label"><?php print t($label) ?>:&nbsp;</div>
  <?php endif;?>
  <div class="field-items">
    <?php $count = 1;
    foreach ($items as $delta => $item) :
      if (!$item['empty']) : ?>
        <div class="field-item <?php print ($count % 2 ? 'odd' : 'even') ?>">
          <?php if ($label_display == 'inline') { ?>
            <div class="field-label-inline<?php print($delta ? '' : '-first')?>">
              <?php print t($label) ?>:&nbsp;</div>
          <?php } ?>
          <?php print $item['view'] ?>
        </div>
      <?php $count++;
      endif;
    endforeach;?>
  </div>
</div>
<?php endif; ?>

and you will be wanting to change the <?php print $item['view'] ?> line in the middle.

Dull ax approach, this would do it:

<?php if (!$field_empty) : ?>
<div class="field field-type-<?php print $field_type_css ?> field-<?php print $field_name_css ?>">
  <?php if ($label_display == 'above') : ?>
    <div class="field-label"><?php print t($label) ?>:&nbsp;</div>
  <?php endif;?>
  <div class="field-items">
    <?php $count = 1;
    foreach ($items as $delta => $item) :
      if (!$item['empty']) : ?>
        <div class="field-item <?php print ($count % 2 ? 'odd' : 'even') ?>">
          <?php if ($label_display == 'inline') { ?>
            <div class="field-label-inline<?php print($delta ? '' : '-first')?>">
              <?php print t($label) ?>:&nbsp;</div>
          <?php } ?>
          <?php
            if ($count==1) {
              $first=str_replace('100x100','228x228', $item['view']);
              print $first;
            } else {
              print $item['view'];
            }
          ?>
        </div>
      <?php $count++;
      endif;
    endforeach;?>
  </div>
</div>
<?php endif; ?>

where, if in your CCK configuration you have 100x100 as the imagecache style for this field as the default, it is changed to 228x228 for the first image.

Obviously, if 100x100 appears anywhere else this fails so I am sure something more eloquent could be created. But in either case, clear caches/theme registry and you should be on your way.

Also, I've left out any logic based upon toggling this on another field's value, but all the information is available in that template to do so.

Answer 2

It looks like you only want to backport Formatter Field to Drupal 6.

For example, say you have a page node with an image field. Normally, you would select an image style as the formatter, and all page nodes would use that same image style. With this module, you can add a formatter field to page nodes, which is hooked up to the image field. Then when the node is created or edited, the image style can be selected per-node.

Looks exactly like your use case.

Answer 3

An easy way out, might be to have two image fields in the same content type. This way you can style these fields differently using different displays or views. The editor can decide not to use one or the other image field (or use both).

If you have one single image field and one multiple image field, you can use the single image field as a teaser image and/or a main image - and use the multiple image field to display a slide show or some sort of image gallery display.

If you need some "if this is empty then show this" logic, you might look into these discussions: https://drupal.org/node/206012, https://drupal.org/node/945268

Answer 4

As a work around

• Create a field collection as image and checkbox using field-collection module.
• Now adding logic to pick the right field as checbox checked ,css class can be added to the image field.