Child links with images

Author Message

Izzy Lindsay

Saturday 25 September 2004 4:32:27 pm

Hi,

I'm currently using the following code to list the links to articles in a folder. However, as well as just showing the name for the link, I'd also like to display an image from each article as well. The image is added to the articles using related object but it is called "image". Any idea what I need to add to the following code to make it happen?

Thanks

<div class="pagetitle">
<br>
</div>

{* Grab all the child nodes. *}
{let children=fetch( content, list, hash( parent_node_id, $node.node_id,
                                          sort_by,        $node.sort_array ))}

    <table class="member_list" cellpadding="0" cellspacing="0" border="0">

        {* Loop through all nodes that we just fetched. *}
        {section name=Child loop=$children}

            {* Output the name as a link to the node containing the member. *}
            <tr>
                <td>
                    <a href={$:item.url_alias|ezurl}>{$:item.name}</a> 
                </td>
            </tr>

        {* End of loop. *}
        {/section}

    </table>

{/let}

Izzy Lindsay

Monday 27 September 2004 7:25:28 am

Solved it by doing this:

{* FULL LIST WITH IMAGES AND NAMES AS LINKS *}

{* Grab all the child nodes. *}
{let children=fetch( content, list, hash( parent_node_id, $node.node_id,
                                          sort_by,        $node.sort_array ))}


        {* Loop through all nodes that we just fetched. *}
        {section name=Child loop=$children}

            {* Output the name as a link to the node containing the member. *}

            <a href={$:item.url_alias|ezurl}>{attribute_view_gui image_class=gallerythumbnail 
attribute=$Child:item.object.data_map.image.content.data_map.image}</a><br>                    
            <a href={$:item.url_alias|ezurl}>{$:item.name}<br><br></a> 

        {* End of loop. *}
        {/section}


{/let}

Izzy Lindsay

Monday 27 September 2004 7:31:54 am

I'd like to have the above image and name links set out as grid rather than a long list.

I'd also like the grid to change depending on the width of the page so an 800x600 screen might see 24 links as 3x8 but a 1280x1024 screen would see them something like 6x4

I'm guessing that I just need to enclose some of the code in a div that floats each link to the left. Anything that doesn't fit on the first row drops down to the second row and so on. However, I've tried it and I can't seem to get it to work.

Any ideas?

Randeep Walia

Monday 27 September 2004 9:01:28 am

For future reference you could have noticed that EZ's default display of an article listing included a thumbnail- the code of which you would have found in the article line template.

As for the float question, different browsers render floated divs differently which may explain your varied results, but floating a div would be your best bet, maybe specifying a height and width if you can- or controlling the layout by linking it with some javascript. Either, that's a topic better suited for an HTML forum and probably not this one.

__________________________________
Randeep Walia is http://www.rundeep.net powered by EZ Publish

Powered by eZ Publish™ CMS Open Source Web Content Management. Copyright © 1999-2014 eZ Systems AS (except where otherwise noted). All rights reserved.