How to display several field values from sub-sub-pages in the first-level "grandparent" page (images with external links)

[Christophe]

Hello,

I know almost nothing about php. I've looked a bit a the API docs and tried to find answers in the forum these last hours.

I've seen different styles, one of them being for example the use of <? foreach(...): ?>...<? endforeach; ?>. 

It's the first time I want to do something like this with Processwire.

Let's say I have a horizontal menu, and one of it's first-level links is something like Projects.

At first the sub-sub links/pages where directly under Projects, but then I created 3 "categories" (level 2), and so each sub-sub page (level 3) is under one of these categories

The categories and sub-sub pages are "Hidden".

The Projects page uses a template file that has a name like projects.php (so the code needs to be inserted here normally).

The sub-sub pages use a template file named for exemple projects_childen.php (or it could be projects_grandchilden.php).

For the pages that use projects_childen.php as a template file, there are several fields including images (Image type) and external_url (URL type).

So I want something like a porfolio list/gallery using for example the headline, the images and the external_url fields.

Later on I will perhaps link the image to the url of the corresponding page for each image, and/or try other variations.

But for the moment I'd like to have for example the headine (before or after the image), then the thumbnail image inside a link pointing to the external url entered in the grandchild page.

I've tried to "merge" some pieces of code but it doesn't work for the moment, and also I hadn't taken into account the creation of the categories.

I know that I probably need to use include=hidden.

I don't know if I need to use something like a double foreach...

I've tested some things, starting from the following code at http://processwire.com/api/fieldtypes/images/:

foreach($page->images as $image) {     $large = $image->width(500);     $thumb = $image->size(100, 100);     echo "<a href='$large->url'><img src='$thumb->url'></a>";     }

The image inserted in each grandchild page is 640 X 400.

The images in the Projects page need to be for instance 320 x 200.

I've ended up with this:

<div class="gallery"> (because I'm using HTML Kickstart)   

    <?php

        foreach($page->children('include=hidden') as $child) {
            $external_url = $child->get('external_url');
            $thumb = $child->images->size(320);
            echo "<a href='$external_url' width='320' height='200' target='_blank' rel='nofollow'><img src='$thumb->url' width='320' height='200' /></a>";
        }

    ?>

I can just imagine or am perhaps close to or far from the solution, but as I said I know nothing about php.

Perhaps the $external_url part shouldn't be inside the foreach part, or this part or another one is not good.

It's possible that some of the old versions were better .

And also it doesn't take into account the fact that now the pages are grandchildren, not children.

Single or double quotes also sometimes have to change depending on the style, etc.

The headlines need to go somewhere...

Perhaps the "get" is not necessary where it is, but it could be necessary elsewhere.

A lot of "perhapses" . I have impressions, not more... There are so many variations possible.

Thanks in advance for your help . I need external (re)views as I can't seem to concentrate anymore and/or step back...

NB: I've seen that I can specify the name of the template used only by the grandchildren pages (in order to "avoid" the categories).

                
                
    

[Macrura]

@Christophe,

i'm not clear on what problem you are having... but there were some errors in your code

<div class="gallery">

    <?php

        foreach($page->children('include=hidden') as $child) {
           //  $thumb = $child->images->size(320); 
              // your $thumb var is an array... changing it below so it works
            $thumb = $child->images->first()->size(320); 
            echo "<a href='$child->external_url' width='320' height='200' target='_blank' rel='nofollow'><img src='$thumb->url' /></a>";
        }

    ?>

[Christophe]

Hello,

Yes, I knew there were certainly some errors .

I have also "overcomplicated" the code. As foreach($page->images as $image) became foreach($page->children('include=hidden') as $child), I guess  '$child->external_url' was sufficient.

For $thumb = $child->images->first()->sizewidth(320); I now remember having read that the image field behaves as an array of images by default, but that it can be changed, and having seen this type of code with "first()", when looking at the API Images page.

I'll test the code as soon as I can and come back here to confirm that it works. I have to add the headline field too.

After, I may try to see how I could possibly filter the "pages" displayed depending on their category, with a drop-down menu at the top of the page for instance.

And if I want it to be without clicking on a button, I guess I could use something like Isotope.

Also I would prefer the "portfolio" page to appear by default with the first "pages" being the last websites made, and so on.

They are manually organized like that inside each category, but when they are (partially) displayed on the "portfolio" page they are no more really sorted by/in (general) order.

I surely can use a field for that, or something like that.

I will see.

Thank you

[Christophe]

Hello again,

I have this error message (like others have had apparently) when using the code:

"Error:
Call to a member function size() on a non-object (line 12 of...".

I have tried some variations, but with no good results for the moment.

NB: I'm wondering if I'm not going to link to the pages directly intead of (to) the external urls, and above all if it wouldn't be better, in this case, to remove the categories and use fields/"tags"* to possibly filter these pages by "category" later.

Could you give me hints on how to "categorize" by "tags"' and/or tell me what you think about this*? I guess it must be simple to do. It's just a decision to take.

* Ok, so I've removed the 3 categories' pages, and now it logically works (no more error message), certainly because the pages are the direct children.

Perhaps one day I will need the code as it should be with categories in between.

Also, size apparently needs at least 2 "arguments", so I've put width instead and the "thumbnails" appear too. *