Images Fields?

[disall2000]

How does the image field work? I've been trying to understand the tutorials but it just ties my head in knots. I now very very very little php. What I'm trying to do here is just to output a simple page title and the image but the image don't show up at all.
What am I missing here?

<?php
foreach($page->children as $child)
   echo "{$child->title}{$child->$image->image}" 
    ;?>

 

[BitPoet]

Like you do with "title", you reference the images field by its name (look in the field settings if you are unsure). So $child->images gives you the images field. Depending on whether you have set the field to hold one or more images, it returns either a Pageimage instance or multiple images in a Pageimages instance. In the latter case, you have to state which image you want to get, e.g. with $child->images->first.

Each image field has properties like url, (file)name, description or tags.

To "output" the image, you have to output the correct HTML.

<?php
// image field set to single image and named "image"
foreach($page->children as $child)
   echo "{$child->title} <img src='{$child->image->url}'>" 
   ;

// image field set to multiple images and named "images"
foreach($page->children as $child)
   echo "{$child->title} <img src='{$child->images->first->url}'>" 
   ;

 

[lokomotivan]

You need to echo image html and use image field as a src attribute. Processwire doesn't add any html to the front-end, 0, but it provides you everything you need. In this case, lets say you have image field on a page:

<?php
$page->image // will get you jsut image name my_image.jpg
$page->image->url // will get you image path site/assets/files/1234/my_image.jpg
?>

<!-- and here full image -->
<img src="<?= $page->image->url ?>" />

 

[disall2000]

Can't get it to work. What am I doing wrong?

<ul><?php
foreach($page->children as $child)
   echo "<li>" . " {$child->title} " . " 
   
foreach($page->children as $child)
   echo "{$child->title} <img src='{$child->images->first->url}'>" . "</li>";
   
   ?>
   </ul>		

 

[BitPoet]

Are you working with one of the shipped site profiles and the basic-page template?

[SamC]

This might help: https://www.pwtuts.com/processwire-tutorials/in-depth-look-at-the-images-field-type/uploading-and-rendering-images/

50 minutes ago, disall2000 said:

Can't get it to work. What am I doing wrong?

<ul><?php
foreach($page->children as $child)
   echo "<li>" . " {$child->title} " . " 
   
foreach($page->children as $child)
   echo "{$child->title} <img src='{$child->images->first->url}'>" . "</li>";
   
   ?>
   </ul>		

 

Not sure why there's two loops in there, I didn't fully understand your first post. Maybe like:

<ul>
  <?php
  $child_pages = $page->children;
  foreach($child_pages as $child_page):
  ?>
  <li>
    <?= $child_page->title; ?>
    <!-- IF IMAGE FIELD SET TO ALLOW ONLY 1 -->
    <img src="<?= $child_page->image->url; ?>" />
    <!-- OR IF IMAGE FIELD SET TO ALLOW MULTIPLE, GET THE FIRST ONE, not sure if 'first' or 'first()' -->
    <img src="<?= $child_page->image->first()->url; ?>" />
  </li>
  <?php endforeach; ?>
</ul>

Presuming the image field itself is named 'image'.

 p.s. welcome to the forum @disall2000  

[disall2000]

Now it works, thanks!