Adding a "news item" style thumbnail image to a Dexterity content type

Question

I'm working on a listing page for a custom Dexterity content type, and I'd like to pull one of the images to display in the listing, kind of how a listing page for a folder full of news items shows the thumbnails alongside the title and description (i.e. folder_summary_view).

What's the best way to go about this? I tried customizing the folder_summary_view template to change the thumbnail code to look instead for 'item_object/thumbnail' however it returns an error because it's a blob image or something:

<a href="#" tal:condition="exists:item_object/thumbnail" tal:attributes="href python:test(item_type in use_view_action, item_url+'/view', item_url)">
<img src="" alt="" tal:replace="structure python: path('nocall:item_object/thumbnail')(scale='original', css_class='tileImage')" />
</a>

Returns:

    Module Products.PageTemplates.ZRPythonExpr, line 48, in __call__
    __traceback_info__: path('nocall:item_object/thumbnail')(scale='original', css_class='tileImage')
    Module PythonExpr, line 1, in <expression>

TypeError: 'NamedBlobImage' object is not callable 

I guess I'd also be interested in finding out how to call any of the other fields. It pulls the title and description automatically. Is there an easy way to call moar fields? i.e. if there's a text field called: developer_name — how would I display that after Title in the folder summary view?

I saw this question in case that helps, but it seemed to be more related to migration and not displaying content.

Answer 1

The folder_summary_view still needs to be updated for Plone's default news item, like this (works with both; Plone's default Archetype- and Dexterity-newsitem):

            <a href="#"
               tal:condition="exists:item_object/@@images/image"
               tal:attributes="href python:test(item_type in use_view_action, item_url+'/view', item_url)">
                <img src="" alt=""
                     tal:replace="structure item_object/@@images/image/mini" />
            </a>

Where 'image' is the fieldname, in case yours differs.

See plone.app.imaging's README for complete reference.

I hope to find some time soon, to commit this, unless someone else is heading to do it ;)

Note: I think I remember it's not recommended to use python:test() though, maybe that part should be adjusted, too.

For generally rendering your field, you can use good ol':

    <div tal:content="structure context/developer_name" />

Tested with a TTW-created Dexterity-CT and a text-field.

See also (with a grokked example): http://developer.plone.org/reference_manuals/external/plone.app.dexterity/custom-views.html#simple-views

Answer 2

if you look closely to the folder_summary_view template you will find that all you need to do is adding some helper methods to you class:

<a href="#"
   tal:condition="exists:item_object/image_thumb"
   tal:attributes="href python:test(item_type in use_view_action, item_url+'/view', item_url)">
    <img src="" alt=""
         tal:replace="structure python: path('nocall:item_object/tag')(scale='thumb', css_class='tileImage')" />
</a>

we did something similar in collective.nitf by creating a getImage, imageCaption, tag and image_thumb functions (you probably won't need them all).

also, note the image attribute that will map the getImage function.

class NITF(Container):
    implements(INITF)
    ...    
    # The purpose of these methods is to emulate those on News Item
    def getImage(self):
        """Return the first Image inside the News Article."""
        content_filter = {'portal_type': 'Image'}
        images = self.listFolderContents(content_filter)
        return images[0] if len(images) > 0 else None

    image = getImage # XXX: a hack to support summary_view

    def imageCaption(self):
        image = self.getImage()
        if image is not None:
            return image.Description()

    def tag(self, **kwargs):
        # tag original implementation returns object title in both, alt and
        # title attributes
        image = self.getImage()
        if image is not None:
            scales = image.restrictedTraverse('@@images')
            if 'scale' in kwargs:
                scale_id = kwargs.get('scale')
                del kwargs['scale']
            else:
                scale_id = 'thumb'
            kwargs['alt'] = image.Description()
            kwargs['title'] = image.Title()
            scale = scales.scale(fieldname='image', scale=scale_id)
            return scale.tag(**kwargs)

    def image_thumb(self):
        """Return a thumbnail."""
        image = self.getImage()
        if image is not None:
            view = image.unrestrictedTraverse('@@images')
            # Return the data
            return view.scale(fieldname='image', scale='thumb').data

take a look at that code.