Matt_P Posted August 15, 2016 Share Posted August 15, 2016 Hi everyone, I am having difficulties using the blog module and was wondering whether someone could enlighten me. I have got a grid which has all my posts on (which I will refer to as post menu, for lack of a better description) and I would like to attach and image to each (like a thumbnail) with the post title as an overlay. Where the blue rectangle is on the attached image. I have attached and image to each post and I'm trying to call them. However I have since realised from receiving a blank result that I need to call them from another page (from the post to the post menu). You'll have to excuse my lack of knowledge for PHP and the PW calls, but I have found it really difficult to understand how this module is set up. I also apologise if I've posted this in the wrong category. Does anyone what I need to produce this? I have tried some of the below but doesn't bring back what I am after. Thanks, Matt <!-- Attempt 1 --> <?php echo " <script> $(document).ready(function(){ $(\".post-headline\").css(\"background-image\", \"url('"; echo $image; echo "')\"); }); </script>"; ?> <!-- Attempt 2 --> <style> .post-headline { background: url("<?php foreach($page->blog_images as $image){ echo "{$image->url}"; } ?>"); } </style> <!-- Attempt 3 --> <div style='background-image: url( <?php foreach($page->blog_images as $image){ echo "$image->url"; } ?> )'><div> Link to comment Share on other sites More sharing options...
Robin S Posted August 15, 2016 Share Posted August 15, 2016 I'm not familiar with the blog module, but I assume that "blog_images" is an images field in the blog post template. If so, you don't want to iterate over the images in that field but rather you want to iterate over the PageArray of blog post pages. So something like: <?php $posts = $pages->find("template=blog_post"); foreach($posts as $post): ?> <div class="blog-post"> <div class="post-thumbnail" style="background-image:url(<?= $post->blog_images->first->url ?>);"> <h3><?= $post->title ?></h3> </div> Other summary content here... </div> <?php endforeach; ?> 2 hours ago, Matt_P said: You'll have to excuse my lack of knowledge for PHP and the PW calls, but I have found it really difficult to understand how this module is set up. No doubt the blog module has some cool features, but it's not difficult to build blog functionality into your website using the basic PW fields and no module. Give it a go! That way you'll know exactly what's going on behind the scenes, learn about several different field types, and buzz-out when you see how easy PW makes it to build whatever is in your head. 2 Link to comment Share on other sites More sharing options...
Matt_P Posted August 16, 2016 Author Share Posted August 16, 2016 Hi Robin S, 12 hours ago, Robin S said: I'm not familiar with the blog module, but I assume that "blog_images" is an images field in the blog post template. If so, you don't want to iterate over the images in that field but rather you want to iterate over the PageArray of blog post pages. Yes "blog_images" is a field attached to the template "blog-post". I've attached an image of where it is in PW, its labelled "images". This is the blog module: http://modules.processwire.com/modules/process-blog/ 12 hours ago, Robin S said: No doubt the blog module has some cool features, but it's not difficult to build blog functionality into your website using the basic PW fields and no module. Give it a go! That way you'll know exactly what's going on behind the scenes, learn about several different field types, and buzz-out when you see how easy PW makes it to build whatever is in your head. I would have happily done this blog from the ground up, but I've taken this project over from a colleague and it was his choice to include the module, which I am reluctant to undo his work. The issue here is that I cannot see in the code what is producing what. Therefore I do not know how to implement your code. Below I have attached the code from the file "blog-main.inc" (this comes with the module) which I assume based on the inspecting the page is the 'post-menu', which is also attached. "h4.post-headline is where I would like the image to go. Do you know what it is I need to do? <?php include("./head.inc"); ?> <?php /** * Blog Demo main markup include * Demo template file include * */ /* we need to get topNav items by their templates in order to adapt to different blog styles (1-4) of course, in your blog install, you would use a different method since you would know the blog style you selected! */ /*$templates = array('blog-categories','blog-tags', 'blog-comments', 'blog-authors', 'blog-archives'); foreach ($templates as $t) { $p = $pages->get("template=$t"); if($p->id) $topNavItems[] = $p; } $topNav = $blog->renderNav('', $topNavItems, $page);*/ ?> <body> <div id="wrapper" class="block-group"> <!-- #wrapper --> <!-- LEFT COLUMN - NAV --> <div id ="nav" class="block"><!-- #nav --> <div id="top-nav"><?php echo $topNav;?></div><!-- #top-nav --> <?php $noSubNav = array('blog-comments','blog-posts', 'blog-tag', 'blog-tags'); if (!in_array($page->template->name, $noSubNav)) { //subnav only on certain pages and if not empty if(!empty($subNav)) echo '<div id="sub-nav">' . $subNav . '</div><!-- #sub-nav -->'; } ?> </div><!-- end #nav --> <!-- CENTRE COLUMN - MAIN --> <?php //if 'post author widget' is disabled, we want to style the end of the post using the css class 'no-author' (see further below in CENTRE COLUMN output) //only applies to 'blog-post' pages $noAuthor = $pages->get('template=blog-widget-basic, name=post-author, include=all')->is(Page::statusUnpublished) ? ' no-author' : ''; ?> <div id="main" class="block<?php echo $noAuthor?>"><?php echo $content?></div> <!-- #main --> <!-- RIGHT COLUMN - SIDEBAR --> <div id="sidebar" class="block"><?php include_once("blog-side-bar.inc"); ?></div><!-- #sidebar --> </div><!-- end #wrapper --> <?php include("./foot.inc"); Thanks, Matt Link to comment Share on other sites More sharing options...
Robin S Posted August 16, 2016 Share Posted August 16, 2016 Looks like the markup for post-headline is set here: https://github.com/kongondo/Blog/blob/master/MarkupBlog.module#L916 This should work I think: $out .= "<$h class='post-headline' style='background-image:url({$page->blog_images->first->url});'><a href='{$page->url}'>{$page->title}</a></$h>"; You may want to resize the image - see the API methods for this. There is a support thread for the blog module. I believe @kongondo is away at the moment but if you post questions there other users of the module may have advice. 4 Link to comment Share on other sites More sharing options...
Matt_P Posted August 16, 2016 Author Share Posted August 16, 2016 Hi Robin S, Thank you very much, that has fixed my issue. If only I had known that's where all the code was! I wish I could like your post twice. Thanks, Matt 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now