Buy me a coffee

Add Portfolio Thumbnails under Pagination

Suppose you want to make Portfolio Thumbnails appear under Pagination, something like this:

Demo: https://tuanphan3.squarespace.com/portfolio01-gridsimple/project-02?noredirect
pass: abc

Add Portfolio Thumbnails Under Pagination 01 Min

#1. Install this plugin

The plugin will give you some code to add to the Code Injection Header and footer, like this.

Add A Section To Top Of Blog Posts Use Not Linked Page 03 Min

Add A Section To Top Of Blog Posts Use Not Linked Page 04 Min

#2. Add this code to the Portfolio Page Header Code Injection

<div data-wm-plugin="load" data-target="/portfolio01-gridsimple"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
document.addEventListener('wmSectionLoader:loaded', ({detail}) => {
  if (detail.target !== '/portfolio01-gridsimple') return;
  $('div.wm-load-container').insertAfter('section#itemPagination');
  const path = location.pathname;
    $(`a[href="${path}"]`).css('display', 'none')
})
</script>
<style>
.wm-load-container+section {
    padding-top: 0px !important;
}
body.view-item div.wm-load-container {
  display: block !important;
}
  div#gridThumbs {
    opacity: 1 !important;
    transform: unset !important;
}
</style>

Add Portfolio Thumbnails Under Pagination 02 Min

#3. Note
This is the Portfolio Page URL

Add Portfolio Thumbnails Under Pagination 03 Min

#4. Fix error

Thumbnails will appear on both Portfolio List + Sub Pages.

You can use this code to Page Header Code Injection to remove it on the List Page

<style>
body.view-list div.wm-load-container {
  display: none !important;
}
</style>

Add Portfolio Thumbnails Under Pagination 04 Min