I'm trying to create a content type that allows me to post multiple images from an external database in this sort of style: http://www.newageman.co.uk/14-time-travelling-celebrities

In an ideal world this is what I would like my group of fields to look like in the article creation screen.

enter image description here

Any idea how I would achieve this using best practices? To post articles like this I'm currently using a piece of php code but it's confusing for my contributors, so would like to use fields. I've never made a module or custom field before.

Essentially I am trying to recreate what this PHP does: The input

<?php $folder = ''; ?>
<?php $location = ''; ?>
$title01 = '';
$content01 = ''; ?>

The output

<div class="image_article">
<span id="title"><span id="num">1. </span><?php echo "$title01"; ?></span> 
<p><img src="/sites/default/files/foldered_images/<?php echo "$folder"; ?>/<?php echo "$location"; ?>_01.jpg" /></p>
<p><?php echo "$content01"; ?></p>

You can create a multiple-value field collection field.

In the "field collection item" entity type, you can create the fields for the image and body text.

Afaik, the built-in image field type does not really work with external images. This problem is discussed here: Linking image field to an external URL

And now for the output.

Under "manage display" of the field collection item, use Display suite, with ds_extras enabled. Choose "Reset" as the layout (which will disable all divs that wrap the field collection item). Then create a ds custom field using token, and use it to put the other fields into your custom html.

Or alternatively, override field-collection-item.tpl.php in your theme, or better, override field-collection-item--field-xyz.tpl.php. I am not sure which exact template suffix to use to target the specific field collection item type. You should play around a bit and then we can update the answer based on your findings.

  • Thank you, the field collection module answered the first half of what I was looking for. I am trying to find the answer to placing the code into html using fields. – alexO Mar 17 '14 at 21:37
  • Can you elaborate on this remaining problem? – donquixote Mar 17 '14 at 22:49
  • There we go, I edited the answer to cover the output problem. – donquixote Mar 17 '14 at 23:06

As an alternative to field collection, you could simply use a text field (or just the body field) with image embedding.

I typically use a combination of IMCE and CKEditor or BUEditor. For external images you might not need IMCE, but you want to configure the text editor of your choice to provide a button for embedding of (external) images.

  • I currently use this method using some php I wrote but I am trying to keep it to copy and paste fields for my contributors. – alexO Mar 17 '14 at 22:48
  • i think some php got removed in your post? – donquixote Mar 17 '14 at 22:50
  • I didnt include the php as it made the question too long, I will edit the op – alexO Mar 17 '14 at 22:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.