Calling an image field in a template

[cmscritic]

Hi Guys

I'm doing the unthinkable and attempting to recreate cmscritic.com with processwire. A task that I'm sure will be incredibly fulfilling once complete and I'm hoping will teach me how to use this CMS in the process. (pun not intended). 

I'm messing with the blog profile at the moment and when I look at the template, I see it's got a field "site title" which when viewing the page, is populated with the words "Basic Blog Profile" and used in the masthead. Since I want to use an image logo instead and have it easy to change within the backend, I added an image field to the template and uploaded my logo.  The issue i'm having is that I'm unsure as to how to call this and within which template. I can see it in the page now as an uploaded image but I don't know how to call it within the masthead.

Tough to explain, hopefully my question makes sense.

Here's a screenie to show what I mean.

Thanks  in advance!

Mike

[cmscritic]

Update: I tried following the FAQ on the issue but couldn't get it to work.

[RyanJ]

I think you will find what you are looking for in the main.inc file on line 60. You could try to add something like this to that file. 

if($page->image) echo "<img src='{$page->image->url}'>";
 

Check out this for outputting images if you have not already.

**Disclaimer, I have not tested it and could be completely wrong. I'm still learning myself, but thought I would give you my 2 cent.

[cmscritic]

Thanks RJay.

So far, I followed the tutorial I found here and came up with this code, which outputs the logo above and the "site_title" below. Now all I need to do is figure out how to wrap the logo with <a href='{$config->urls->root}'> and I'm good. Code is as follows:
 

<?php $image = $page->logo_image->size(287,80); echo "<img class='logo' src='{$image->url}' alt='{$image->description}'  />"; ?> 
<?php echo "<a href='{$config->urls->root}'><h1>{$homepage->headline}</h1></a>"; ?>

Thoughts?

[horst]

Hi,

why not using it like:

<?php $image = $page->logo_image->size(287,80);?>
<?php echo "<a href='{$config->urls->root}'><h1><img class='logo' src='{$image->url}' alt='{$image->description}' /><br />{$homepage->headline}</h1></a>"; ?>

[Soma]

Looking at the screen it must be a multiple images field. In that case it's an array and you have to either change it to max 1 image int he field setting or chose the first from the array:

<?php 
$image = $page->logo_image->first->size(287,80);
echo "<img class='logo' src='{$image->url}' alt='{$image->description}' />";
?> 

Ah didn't read careful..

This is also possible I think:

<?php echo "<a href='{$config->urls->root}'><h1><img class='logo' src='{$page->logo_image->size(287,80)->url}' alt='{$image->description}' /></h1></a>";?>

[RyanJ]

Try this

<?php
$image = $page->logo_image->size(287,80);
echo "<a href='{$config->urls->root}'><img class='logo' src='{$image->url}' alt='{$image->description}'  /></a>";
?>
 

[cmscritic]

Looking at the screen it must be a multiple images field. In that case it's an array and you have to either change it to max 1 image int he field setting or chose the first from the array:

<?php 
$image = $page->logo_image->first->size(287,80);
echo "<img class='logo' src='{$image->url}' alt='{$image->description}' />";
?> 

Ah didn't read careful..

This is also possible I think:

<?php echo "<a href='{$config->urls->root}'><h1><img class='logo' src='{$page->logo_image->size(287,80)->url}' alt='{$image->description}' /></h1></a>";?>

That worked perfectly, (the second example that is) I wasn't sure the context to use. Thank you & thanks to all others who replied.

[horst]

Hi cmscritic, I just want to note that you now have the <h1>-Tag filled with an image, and only with an image.

Hhm, dunno if this is a good idea with respect to SEO and page semantic. (But my profession are the images, not SEO or semantic, just doesn't feel good to me)

[RyanJ]

Hi cmscritic, I just want to note that you now have the <h1>-Tag filled with an image, and only with an image.

Hhm, dunno if this is a good idea with respect to SEO and page semantic. (But my profession are the images, not SEO or semantic, just doesn't feel good to me)

I agree, if just using the image, ditch the <h1>. From your first post, I think you were trying to replace the headline text with the logo if I understood correctly.

[cmscritic]

Good call guys, done.

[OrganizedFellow]

@cmscritic

What is the current CMS for the site?

[kongondo]

@cmscritic

What is the current CMS for the site?

WP Same initials - other way round!