After a few years, I've actually managed to finally figure out how to make the posters for shows/movies to open up large in a lightbox. It involved editing two templates.
Add the below code to the top of the 'snog_movies_thread_view_type_movie' template.
Code:
<xf:css src="lightbox.less" />
<xf:js prod="xf/lightbox-compiled.js" dev="vendor/fancybox/jquery.fancybox.js, xf/lightbox.js" />
<xf:if is="!page_param('hasLb')">
<script class="js-extraPhrases" type="application/json">
{
"lightbox_close": "{{ phrase('lightbox_close')|escape('js') }}",
"lightbox_next": "{{ phrase('lightbox_next')|escape('js') }}",
"lightbox_previous": "{{ phrase('lightbox_previous')|escape('js') }}",
"lightbox_error": "{{ phrase('lightbox_error')|escape('js') }}",
"lightbox_start_slideshow": "{{ phrase('lightbox_start_slideshow')|escape('js') }}",
"lightbox_stop_slideshow": "{{ phrase('lightbox_stop_slideshow')|escape('js') }}",
"lightbox_full_screen": "{{ phrase('lightbox_full_screen')|escape('js') }}",
"lightbox_thumbnails": "{{ phrase('lightbox_thumbnails')|escape('js') }}",
"lightbox_download": "{{ phrase('lightbox_download')|escape('js') }}",
"lightbox_share": "{{ phrase('lightbox_share')|escape('js') }}",
"lightbox_zoom": "{{ phrase('lightbox_zoom')|escape('js') }}",
"lightbox_new_window": "{{ phrase('lightbox_new_window')|escape('js') }}",
"lightbox_toggle_sidebar": "{{ phrase('lightbox_toggle_sidebar')|escape('js') }}"
}
</script>
</xf:if>
<xf:page option="hasLb" value="{{ true }}" />
Then edit the 'snog_movies_post_macros' template. Search for the below code -
Code:
<xf:if is="$thread.Movie.tmdb_image">
<xf:if is="$xf.options.tmdbthreads_forum_local">
<img src="{$thread.Movie.getImageUrl('l')}" />
<xf:elseif is="$xf.options.tmdbthreads_usecdn" />
<img src="{$xf.options.tmdbthreads_cdn_path}/movies/LargePosters{$thread.Movie.tmdb_image}" />
<xf:else />
<img src="https://image.tmdb.org/t/p/w185{$thread.Movie.tmdb_image}" />
</xf:if>
<xf:else />
<img src="{$thread.Movie.getImageUrl('l', 1)}" />
</xf:if>
Change to -
Code:
<div class="lightboxWrapper bbImageWrapper" title="" data-src="{$thread.Movie.getImageUrl('l')}" data-lb-sidebar-href="" data-lb-caption-extra-html="" data-single-image="" data-fancybox="" data-caption="" style="">
<xf:if is="$thread.Movie.tmdb_image">
<xf:if is="$xf.options.tmdbthreads_forum_local">
<img src="{$thread.Movie.getImageUrl('l')}" />
<xf:elseif is="$xf.options.tmdbthreads_usecdn" />
<img src="{$xf.options.tmdbthreads_cdn_path}/movies/LargePosters{$thread.Movie.tmdb_image}" />
<xf:else />
<img src="https://image.tmdb.org/t/p/w185{$thread.Movie.tmdb_image}" />
</xf:if>
<xf:else />
<img src="{$thread.Movie.getImageUrl('l', 1)}" />
</xf:if>
<p>Click on Poster to Enlarge</p>
</div>
You can see that I added a small addition of text beneath the poster saying 'Click on Poster to Enlarge'
Accomplished result (old screenshot so the rest of the layout looks slightly different) -
This is coded to use the images served locally. I have also set the poster images as large otherwise it serves no great purpose. Thank you
@RobinHood for your help with this all that time ago!