Perch if in blog posts

I'm trying to use <perch:if exists="image4"> to output a photo only if image4 exists (which it doesn't at the moment) and I think I must have my syntax wrong - or maybe i can't use it in post.php?

My code is in post.php (but the images are added in post.html)

I need to suppress the code if it doesnt exist as although the image doesnt show if it doesnt exist, my gallery is still assuming it does and scrolling onto a missing image. https://www.ukplantgroup.co.uk/blog/post.php?s=2016-05-12-caterpillar-xr3it

I have added the <perch:if exists="image4"> to all my images, even image3 etc, to try and see what is happening. I would have expected image 3 not to be shown as well as image 4 because of the perchif - but image3 is being shown.

Post.php

<div class="container list-of-items">
<div class="row">
     <?php perch_blog_post(perch_get('s')); ?>
</div><!-- end row --> 
</div><!-- end list of items --> 



  <div id="links">
    <div class="container">
    <div class="row">

    <perch:if exists="image4">
        <div class="col-sm-4 col-xs-6">
        <a class="gallery-box" href="<?php perch_blog_post_field(perch_get('s'), 'image'); ?>" title="UK Plant Group Excavator for Sale" data-gallery>
        <img src="<?php perch_blog_post_field(perch_get('s'), 'image'); ?>" class="img-responsive" alt=""/>
        <div class="gallery-box-caption"><div class="gallery-box-content">   
        <i class="icon-lg ion-ios-search"></i>
        </div><!-- end gallery box content --></div> <!-- end gallery box caption -->
        </a>
        </div> <!-- end col -->
    </perch:if>

        <perch:if exists="image4">
<div class="col-sm-4 col-xs-6">
        <a class="gallery-box" href="<?php perch_blog_post_field(perch_get('s'), 'image2'); ?>" title="UK Plant Group Excavator for Sale" data-gallery>
        <img src="<?php perch_blog_post_field(perch_get('s'), 'image2'); ?>" class="img-responsive" alt=""/>
        <div class="gallery-box-caption"><div class="gallery-box-content">   
        <i class="icon-lg ion-ios-search"></i>
        </div><!-- end gallery box content --></div> <!-- end gallery box caption -->
        </a>
        </div> <!-- end col -->
    </perch:if>
            <perch:if exists="image4">
<div class="col-sm-4 col-xs-6">
        <a class="gallery-box" href="<?php perch_blog_post_field(perch_get('s'), 'image3'); ?>"  data-gallery>
        <img src="<?php perch_blog_post_field(perch_get('s'), 'image3'); ?>" class="img-responsive" alt=""/>
        <div class="gallery-box-caption"><div class="gallery-box-content">   
        <i class="icon-lg ion-ios-search"></i>
        </div><!-- end gallery box content --></div> <!-- end gallery box caption -->
        </a>
        </div> <!-- end col -->
    </perch:if>
        <perch:if exists="image4">
        <div class="col-sm-4 col-xs-6">
        <a class="gallery-box" href="<?php perch_blog_post_field(perch_get('s'), 'image4'); ?>"  data-gallery>
        <img src="<?php perch_blog_post_field(perch_get('s'), 'image4'); ?>" class="img-responsive" alt=""/>
        <div class="gallery-box-caption"><div class="gallery-box-content">   
        <i class="icon-lg ion-ios-search"></i>
        </div><!-- end gallery box content --></div> <!-- end gallery box caption -->
        </a>
        </div> <!-- end col -->
        </perch:if>
            <perch:if exists="image4">
        <div class="col-sm-4 col-xs-6">
        <a class="gallery-box" href="<?php perch_blog_post_field(perch_get('s'), 'image5'); ?>" data-gallery>
        <img src="<?php perch_blog_post_field(perch_get('s'), 'image5'); ?>" class="img-responsive" alt=""/>
        <div class="gallery-box-caption"><div class="gallery-box-content">   
        <i class="icon-lg ion-ios-search"></i>
        </div><!-- end gallery box content --></div> <!-- end gallery box caption -->
        </a>
        </div> <!-- end col -->
    </perch:if>

</div><!--/row-->
</div><!--/container-->

</div><!--/links-->

<!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body -->
<div id="blueimp-gallery" class="blueimp-gallery">
 <!-- The container for the modal slides -->
    <div class="slides">    </div><!--/slides-->

    <!-- Controls for the borderless lightbox -->
    <h3 class="title"></h3>
    <a class="prev">‹</a>
    <a class="next">›</a>
    <a class="close">×</a>
    <a class="play-pause"></a>
    <ol class="indicator"></ol>


    <!-- The modal dialog, which will be used to wrap the lightbox content -->
    <div class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" aria-hidden="true">×</button>
                    <h4 class="modal-title"></h4>
                </div>
                <div class="modal-body next"></div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default pull-left prev">
                        <i class="glyphicon glyphicon-chevron-left"></i>
                        Previous
                    </button>
                    <button type="button" class="btn btn-primary next">
                        Next
                        <i class="glyphicon glyphicon-chevron-right"></i>
                    </button>
                </div>
            </div>
        </div>
    </div><!--/modal dialog-->

</div>

post.html includes :

<perch:if exists="image">
<img src="<perch:blog id="image" type="image" class="img-responsive" label="Main Image" suppress="true"/>" alt="<perch:blog id="postTitle" suppress="true"/>"   />
</perch:if>
<perch:if exists="image2">
<img src="<perch:blog id="image2" type="image" class="img-responsive"  label="Image 2" suppress="true"/>" alt="<perch:blog id="postTitle" suppress="true"/>"  />
</perch:if>
<perch:if exists="image3">
<img src="<perch:blog id="image3" type="image" class="img-responsive"  label="Image 3" suppress="true"/>" alt="<perch:blog id="postTitle" suppress="true"/>"  />
</perch:if>
<perch:if exists="image4">
<img src="<perch:blog id="image4" type="image" class="img-responsive"  label="Image 4" suppress="true"/>" alt="<perch:blog id="postTitle" suppress="true"/>" />
</perch:if>