Is there any way to number Paragraphs rendered so as to have a numbered list rendered?

Question

I’m putting together a project that requires a content type that has a numbered “How To” list in Drupal 7.5.x.

I am using the Paragraphs module and so far the basic concept of having paragraph blocks of how to “steps” is working as expected. Users are able to “Add another Paragraph” to add each additional step and the steps render correctly on the front-end display as expected.

But while that’s all fine, I’m having a heck of a time understanding how I can have Drupal/Paragraphs automatically number each paragraph so it would look like—for all intents and purposes—something like this; literally I just need that number to the left of each Step …: item and that’s it:

1. Step One: Do this.
2. Step Two: Do that.
3. Step Three: Do something else.

I have been playing around with the Custom Formatters module and it almost seems like that might be my solution: I could use a custom formatter that uses PHP to do something like this. Let’s assume this is what outputs the title for each paragraph field_title value with a PHP custom formatter:

return $variables['#object']->field_title['und']['0']['value'];

So I should be able to do something like this to get a number/order prepended:

return $count . ': ' . $variables['#object']->field_title['und']['0']['value'];

Of course $count is just some arbitrary pseudo-code I am placing for example’s sake, but is this the right approach? Or am I barking up the wrong tree. FWIW, I am poking around the values of the output via the Devel module and don’t see anything useful that would related to count/order.

Answer 1

I’d take a look at overriding the paragraph template file in your theme and doing the work there. Paragraph’s uses the following template names:

• paragraphs-item--[VIEW-MODE].tpl.php
• paragraphs-item--[BUNDLE-NAME].tpl.php
• paragraphs-item--[BUNDLE-NAME]--[VIEW-MODE].tpl.php

The source code of the paragraphs-items.tpl.php is as follows:

<?php

/**
 * @file
 * Default theme implementation for a single paragraph item.
 *
 * Available variables:
 * - $content: An array of content items. Use render($content) to print them
 *   all, or print a subset such as render($content['field_example']). Use
 *   hide($content['field_example']) to temporarily suppress the printing of a
 *   given element.
 * - $classes: String of classes that can be used to style contextually through
 *   CSS. It can be manipulated through the variable $classes_array from
 *   preprocess functions. By default the following classes are available, where
 *   the parts enclosed by {} are replaced by the appropriate values:
 *   - entity
 *   - entity-paragraphs-item
 *   - paragraphs-item-{bundle}
 *
 * Other variables:
 * - $classes_array: Array of html class attribute values. It is flattened   into
 *   a string within the variable $classes.
 *
 * @see template_preprocess()
 * @see template_preprocess_entity()
 * @see template_process()
 */
?>
<div class="<?php print $classes; ?>"<?php print $attributes; ?>>
  <div class="content"<?php print $content_attributes; ?>>
    <?php print render($content); ?>
  </div>
</div>

You could use a preprocess hook to set an $attribute or other variable that would provide the Step identifier for the paragraph being rendered, although, I’d be suprised if you couldn’t figure that logic out at this level with data available on either $content or $attributes.