Jump to content

Archived

This topic is now archived and is closed to further replies.

marting

Wordpress PHP gallery issue

Recommended Posts

I am having an issue with a gallery I am building. It's a Wordpress website, and the gallery has an image for each item and when clicking on the image it links to the posts taxonomy. I can get either the images to display correctly or the links to work, but I can't get both to work together (I think it's the start and end I am screwing up). Here's the code:

 

<ul id="portfolio-list">
<?php 
foreach($latest_projects as $post) : setup_postdata($post);
$recent_project_thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
?>

<?php $categories = get_terms('gallery_cats'); foreach ($categories as $cat ) : ?>	

<li><a href="https://website.com/gallery-category/<?php echo $cat->slug; ?>" title="<?php the_title(); ?>"><img src="<?php echo $recent_project_thumb[0]; ?>" alt="<?php the_title(); ?>" width="162" height="100" class="imgstyle" /></a></li>

<?php endforeach; ?>
<?php endforeach; ?> 

</ul>

 

Thank you for your assistance I really appreciate it!

 

 

Share this post


Link to post
Share on other sites

what's the result of a var dump on

 

$recent_project_thumb[0]

Share this post


Link to post
Share on other sites

Hi digibucc,

 

Thanks for your help. When I do that it it doubles the amount of images than what is supposed to show and it doesn't display the image anymore it just shoes the title. Do you know what might be going on? Here's a sample of the code now:

 

<ul id="portfolio-list">
<?php 
foreach($latest_projects as $post) : setup_postdata($post);
$recent_project_thumb[0] = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
?>

<?php $categories = get_terms('gallery_cats'); foreach ($categories as $cat ) : ?>	

<li><a href="https://website.com/gallery-category/<?php echo $cat->slug; ?>" title="<?php the_title(); ?>"><img src="<?php echo $recent_project_thumb[0]; ?>" alt="<?php the_title(); ?>" width="162" height="100" class="imgstyle" /></a></li>

<?php endforeach; ?>
<?php endforeach; ?> 

</ul>

 

Thanks,

Share this post


Link to post
Share on other sites

I should mention that the original code also was displaying double the amount of images. but the links were working ok.

Share this post


Link to post
Share on other sites

well you have two foreach loops. .the image gets echoed for each category for each post. var _dump categories and make sure there is only one assigned to that post.

that img code does look ok at first glance, i'd try it hardcoded with values to see if that works, then if it does check the returns of each of that $vars in it.

Share this post


Link to post
Share on other sites

Hi Digibucc,

 

I don't want 2 loops, I want one loop, so it displays the image just once and its link. How would I combine these loops? I must apologise I am a real newbie at PHP, so if you could provide a sample it would greatly help me understand.

 

Thank you,

Share this post


Link to post
Share on other sites

what does this return:

 

<ul id="portfolio-list">
    <?php
    foreach($latest_projects as $post) : 
        setup_postdata($post);
        $recent_project_thumb[0] = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
        $categories = get_terms('gallery_cats');   
        var_dump($recent_project_thumb[0]);
        var_dump($categories);
        ?>
            <li><a href="http://wwww.google.com" title="Google"><img src="#" alt="#" width="162" height="100" class="imgstyle" /></a></li>        
        <?php endforeach; ?>
</ul>

Share this post


Link to post
Share on other sites

Hi Digibucc,

 

The code you provided is nearly working. What isn't working is the link part of it. I think what is throwing it out is you took out the:

 

foreach ($categories as $cat )

 

How would I incorporate that in what you provided here:

 

  <?php
    foreach($latest_projects as $post) : 
        setup_postdata($post);
        $recent_project_thumb[0] = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
        $categories = get_terms('gallery_cats');   
        var_dump($recent_project_thumb[0]);
        var_dump($categories);
        ?>

 

 

Thank you for being so helpful!

Share this post


Link to post
Share on other sites

not a problem, i did that for a reason though -

        [/color]var_dump[/color]([/color]$recent_project_thumb[/color][[/color]0[/color]]);

[/color]&

        [/color]var_dump[/color]([/color]$categories[/color]);

[/color]

should print out a bunch of text --- but it's inside a ul so it won't do that ;) i missed that part.

 

 

if you could copy the page source of that, or at least the relevant part where the elements were dumped. that will help me know how to construct the category foreach.

on a side not, is there a reason you re doing this:

[/color]$recent_project_thumb[/color][[/color]0[/color]] = [/color]wp_get_attachment_image_src[/color]([/color]get_post_thumbnail_id[/color](), [/color]'recent-work'[/color]);

instead of this:

[/color]$recent_project_thumb[/color] = [/color]wp_get_attachment_image_src[/color]([/color]get_post_thumbnail_id[/color](), [/color]'recent-work'[/color]);

[/color]

in other words, does $recent_project_thumb need to be an array? the [0] is setting it as the first element in array.

Share this post


Link to post
Share on other sites

Hi Digibucc,

 

This is the code so far. You will notice I removed the [0] from the $recent_project_thumb as that was causing the images to not display properly as well.

 

<ul id="gallery-list">
    <?php
    foreach($latest_projects as $post) : 
        setup_postdata($post);
        $recent_project_thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
        $categories = get_terms('gallery_cats');
        var_dump($recent_project_thumb);
        var_dump($categories);
        ?>
            <li><a href="https://ivyvintage.com/gallery-category/<?php echo $categories->slug; ?>" title="<?php the_title(); ?>"><img src="<?php echo $recent_project_thumb[0]; ?>" alt="<?php the_title(); ?>" width="162" height="100" class="imgstyle" /></a></li>        
        <?php endforeach; ?>
</ul>

 

This is what is actually looks like on the web:

 

https://ivyvintage.com/

 

Under the 'Latest Photos' section. As you can see it is outputting all this nasty stuff in the HTML and I think it is because the:

 

<?php echo $cat->slug; ?>

 

is missing. I am sorry for not showing you this at the start as it probably would have helped. Thanks,

Share this post


Link to post
Share on other sites

try this:

<ul id="portfolio-list">
<?php 
foreach($latest_projects as $post) : setup_postdata($post);
$recent_project_thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
?>

<?php $categories = get_terms('gallery_cats'); foreach ($categories as $cat ) : ?>   

<li><a href="https://ivyvintage.com/gallery-category/<?php echo $cat->slug; ?>" title="<?php the_title(); ?>"><img src="<?php echo $recent_project_thumb[0]; ?>" alt="<?php the_title(); ?>" width="162" height="100" class="imgstyle" /></a></li>

<?php endforeach; ?>
<?php endforeach; ?> 

</ul>

Share this post


Link to post
Share on other sites

Hi Digibucc,

 

I have implemented that code, as you can see with that code, which I think is identical to my original code, it shows both images twice, but the links kind of work. Do you know how we can get it to just show 1 image for each.

 

Thanks!

Share this post


Link to post
Share on other sites

this?

 

<ul id="portfolio-list">
<?php 
$categories = get_terms('gallery_cats');
foreach ($categories as $cat ) :  
foreach($latest_projects as $post) : 
setup_postdata($post);
$recent_project_thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
?>

<li><a href="https://ivyvintage.com/gallery-category/<?php echo $cat->slug; ?>" title="<?php the_title(); ?>"><img src="<?php echo $recent_project_thumb[0]; ?>" alt="<?php the_title(); ?>" width="162" height="100" class="imgstyle" /></a></li>

<?php endforeach; ?>
<?php endforeach; ?> 

</ul>

Share this post


Link to post
Share on other sites

Hi Digibucc,

 

This code is getting there but is not quite there as you can see. It is still displaying double the amount of images, but now the images are in the right order and the links are kind of close, so the purpley coloured shoes should link to the shoes taxonomy/group. Any ideas? I feel like there is something up with the foreach statements, I think that is what is creating double the amount of images. What other word can be used instead of foreach so it kind of joins or allows for the 2 statements simultaneously?

 

Thanks,

Share this post


Link to post
Share on other sites

you have nothing in there to check whether the $latest_projects is in the category you want. i assumed it was only calling posts from that category.

 

so you have a foreach category loop, which runs twice for the two categories.

and then you have a foreach post loop, which loads all the  $latest_projects, regardless of whether they match the category you are on in the foreach category loop.

 

i'ts late so im done for the night, but if you want i'll help some more tomorrow.

 

basically you need to write in if statement that checks to be sure the current post(image) is in the current category.

 

 

so with:

<ul id="portfolio-list">
<?php 
$categories = get_terms('gallery_cats');
foreach ($categories as $cat ) :  
foreach($latest_projects as $post) :
// get the about post's category/taxonomy, and make sure it matches the current category in $cat, from your foreach loop above.
setup_postdata($post);
$recent_project_thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
?>

<li><a href="https://ivyvintage.com/gallery-category/<?php echo $cat->slug; ?>" title="<?php the_title(); ?>"><img src="<?php echo $recent_project_thumb[0]; ?>" alt="<?php the_title(); ?>" width="162" height="100" class="imgstyle" /></a></li>

<?php endforeach; ?>
<?php endforeach; ?> 

</ul>

 

right now it's running the category loop twice as there is two categories, and putting the pic twice because there are two products total. you need it to only show a pic if it matches the current category in your foreach category as cat loop.

Share this post


Link to post
Share on other sites

Hi Digibucc,

 

I have been experimenting with it for hours and haven't gotten anywhere unfortunately. If you could help me with the if statement that would be fantastic!

 

Thanks,

Share this post


Link to post
Share on other sites

sorry it's been a busy few days at work. if you are still looking:

 

<ul id="portfolio-list">
<?php 
$categories = get_terms('gallery_cats');
foreach ($categories as $cat ) :
foreach($latest_projects as $post) :
$catg = get_the_category();
if ($cat->term_id == $catg->cat_ID) {
// get the about post's category/taxonomy, and make sure it matches the current category in $cat, from your foreach loop above.
setup_postdata($post);
$recent_project_thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'recent-work');
?>

<li><a href="https://ivyvintage.com/gallery-category/<?php echo $cat->slug; ?>" title="<?php the_title(); ?>"><img src="<?php echo $recent_project_thumb[0]; ?>" alt="<?php the_title(); ?>" width="162" height="100" class="imgstyle" /></a></li>
}
<?php endforeach; ?>
<?php endforeach; ?> 

</ul>

 

but that's assuming "foreach($latest_projects as $post) :" gives you a proper post return, that gives it's id via post->id

Share this post


Link to post
Share on other sites

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.