Designing the template for gallery

[mel47]

Hi
Still on my quest to build my website. Since now I know how to basically display fields, I'm now at a design' step. I know I can do, what, and how, I want using PW, but there is so many possibilities! Could you help to choose the more efficient technique and/or point me pro and cons of each of them?
My page is a classic team page
Team
   Some text
   Director 1 (photo+text)
   Director 2 (photo+text)
   Other members
     ~35 photos separated in differents categories (photo, name and position title)
   Some text
   
Method 1 : a page for each section. Pictures uploaded in one field, as described here. Using photo tags to create the different sections and description for name and position.

Method 2: each person is a page. A field "category" will be added to displayed them correctly.

Method 3 : repeater but I'm not sure yet how it works and his advantage or inconvenient.

I have 35 photos to upload for now (one time upload, after I will add/modify only 2-3 by year). I was thinking using a module to batch Import via CSV to create pages (which seems to speed up with method 2) (However, I don't know if it's working for images). On the other hand, method 1 is also easy for uploading pictures in 1 click. However, adding description in batch seems more complicated and less easy to maintain (more clicks to see them).

Also, subsidary question. If I want to re-use some pictures in an other webpage, is it easier to reuse from this page or just reupload and recreate a child page in an other page?

Do I miss something?
Thanks
Melanie

 

[Ivan Gretsky]

I would go with method 2 - let each person be a page on his own.  That will make it easy for you to add properties (fields) for them in the future. For example, their performance stats or sоmething. You can use Page Table field (or RepeaterMatrix if you got ProFields) to manage all the team members on the same page, but it is optional. Each person this way can have an image field (gallery) on his own. You can get the first image from a person page on the team page to make a list of team members.

I think it could beneficial for you to see the code of skyscrapers profile (live demo here). It is by Ryan and can open your eyes on quite a lot of ProcessWire possibilities.

[mel47]

Hi,

I'm fighting to display all photos on the same page (team)... I use a 3 levels :

Team
  --categ_team
      ---member

team's template:
$content = $page->body; 
$categ_team = $page->find("template=categ_team");

	foreach ($categ_team as $categ) {
		$content .= "<h2>{$categ->title}</h2>"
			foreach ($categ->Children() as $member){
				$content .= $page->render("member");  //Why this doesn't work?
		}
	
	}

member's template:
$content .= 
"<p>{$page->summary}</p>
<p>{$page->project}</p>
<p><a href='{$page->one_image->url}'><img src='{$page->one_image->url}' alt='{$page->one_image->description}' ></a></p>";

 

Why I'm not able to render the member's template in the team's template? I tried many variations but without success...

Thanks

Mel

 

 

[Robin S]

$categ->Children()

...should probably be...

$categ->children()

And...

$content .= $page->render("member");

...should probably be...

$content .= $member->render();

You are also missing a semicolon at the end of this line...

$content .= "<h2>{$categ->title}</h2>"

I haven't used the render() method a great deal so I'm not sure of all the ins and outs, but it looks like you are using delayed output so you could run into issues where your _main.php gets auto-appended to your member template when you render it. And that wouldn't be what you want.

Are you actually showing the pages using the member template as individual pages on the front-end? Or do you only use their content inside other pages? If the latter you might be better off not having a template file for the member template. So do something like this...

foreach($categ->children as $member) {
    $content .=
    "<p>{$member->summary}</p>
    <p>{$member->project}</p>
    <p><a href='{$member->one_image->url}'><img src='{$member->one_image->url}' alt='{$member->one_image->description}' ></a></p>";
}

If you output this same content structure in other templates and want to avoid repetition you could use a function or include to output the member content.

[mel47]

Hi

Thanks for your answer. I had already tried

Quote

$content .= $member->render();

It doesn't work since it recopy the full page (with header etc..) as you suspected.

Quote

Are you actually showing the pages using the member template as individual pages on the front-end? Or do you only use their content inside other pages? If the latter you might be better off not having a template file for the member template. So do something like this...

Yes, I want individual pages (and they are displayed ok). And I also want to use it in others pages, team and maybe eventually an other one. I'm ok to write markup directly in team's template, it's easier and too bad for reduction of amount of code for now. Will try this later.

But now, I messed up my loops and can't displayed what I want. I don't know how to display only $past under is own category (which could be either 1 or 2 levels).

$categ_team = $page->find("template=categ_team, parent=/team");
$categ_team_year = $pages->find("template=categ_team, parent=$categ_team");
$past = $page->find("template=member, actual=0");

	foreach ($categ_team as $categ) {   //1st category
	 	$content .=  "<h2><a href='{$categ->url}'>{$categ->title}</a></h2>";
				if($categ_team_year){
						foreach ($categ_team_year as $year) { //2nd category (not always present)
								 $content .=  "<h2><a href='{$year->url}'>{$year->title}</a></h2>";  //Problem: Print under every categ
					}
		  					foreach ($past as $member){ //I want only $past and not all but it should have a categ_team_year->children somewhere?
								$content .= "<h4>{$member->title}</h4>"; //
	}

What I'm doing wrong?

Thanks

Mel

[Robin S]

I don't really understand what your page structure is and what you are trying to output. Maybe you could show...

• the structure of this branch of the page tree
• what templates are used at each level
• an example of what you want your output to be

...then it would be easier to help.

But generally I think the problem is that you need to get $categ_team_year and $past inside your loop, using $categ. Also, you need to use count() in your if() statements when testing if a PageArray is empty.

Maybe something like:

$categ_team = $page->children("template=categ_team");
foreach($categ_team as $categ) {
    $categ_team_year = $categ->children("template=categ_team");
    $past = $categ->find("template=member, actual=0");
    $content .= "<h2><a href='{$categ->url}'>{$categ->title}</a></h2>";
    if(count($categ_team_year)) {
        foreach($categ_team_year as $year) {
            // do something with $year
        }
    }
    if(count($past)) {
        foreach($past as $member) {
            // do something with $member
        }
    }
}

 

[mel47]

Hi

Thanks so much! Little details, big changes! I add my final result, successful, in case some future beginners needed and also if someone have suggestion to optimization (like why I'm unable to use the function I wrote in member instead of re-type markup on team page...).

Mel

Team (team template)
----Categ1 (categ_team)
------Member 1(member)
----Categ2 (categ_team)
-------Year (categ_team)
-----------Member 2 (member)
-------Year (categ_team)
-----------Member 3(member)

$categ_team = $page->children("template=categ_team");

	foreach ($categ_team as $categ) {
		$content .=  "<h2><a href='{$categ->url}'>{$categ->title}</a></h2>"; 
	    $categ_team_year = $categ->children("template=categ_team");
        $past = $categ->children("template=member, actual=0");

	    if(count($past)) {
			foreach($past as $member) {
				$content .= "<h4>{$member->title}</h4>"; 
        }
	}
			if(count($categ_team_year)){
				
				foreach ($categ_team_year as $year) {
					$content .=  "<h3><a href='{$year->url}'>{$year->title}</a></h3>"; 
					$past = $year->children("template=member, actual=0");

						if(count($past)) {
							foreach($past as $member) {
							$content .= "<h4>{$member->title}</h4>"; 
							}
						}
				}
			}
	}