Custom Blog Post is now broken

Site URL: https://www.nicolebarton.co.uk/blog

Hello all,

I've had a custom blog page set up for a while which has been working perfectly.  However recently the blog post has started to fail to load entirely and you are often just present with a bunch of 'load more' buttons.

the page in question is: https://www.nicolebarton.co.uk/blog

It is set up as a Summary Block which pulls all of its information from the a hidden blog section where I publish all of my articles.

It has custom code applied to the page which reads as follows:

This sits above the primary Summary Block

<div data-resource="blogs-hidden"></div>

Then in my Code Injection I have the following in my header:
 

//Blog Post Pagination

<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>

<style>
.load-more-summary + .sqs-block-summary-v2 .summary-item:not(.active){
display: none;
}
.load-more-summary + .sqs-block-summary-v2 .summary-item img{
position:absolute;
top:0 !important;
left: 0 !important;
height: 100% !important;
width: 100% !important;
object-fit: cover;
}
.load-more-summary + .sqs-block-summary-v2 .sqs-block-button {
width: 100% !important;
}
</style>

With the next set in the footer:

 

<script defer src="https://use.fontawesome.com/releases/v5.0.10/js/all.js" integrity="sha384-slN8GvtUJGnv6ca26v8EzVaR9DC58QEwsIk9q1QXdCU8Yu8ck/tL/5szYlBbqmS+" crossorigin="anonymous"></script>

<script>
  $(document).ready(function(){
    $('.sqs-block-code [data-resource]').each(function(){
      $(this).closest('.sqs-block-code').addClass('load-more-summary');
    })
    if($('[data-resource]').length > 0) {
      var resource = $('[data-resource]').attr('data-resource');
      var visiblePosts;
      var itemLength;
      var blogPosts = [];
      var jsonUrlOrigin = window.location.origin+'/'+resource+'?format=json-pretty';
      var jsonUrl = window.location.origin+'/'+resource+'?format=json-pretty';
      function ajaxRequests(url) {
        var promise = $.getJSON(url);
        promise.done(function(data){
          var items = data.items;
          if(items) {
            for (var i = 0; i < items.length; i++) {
              var blogPost = {};
              blogPost.title = items[i].title;
              blogPost.tags = items[i].tags;
              blogPost.categories = items[i].categories;
              blogPost.link = items[i].fullUrl;
              blogPost.excerpt = items[i].excerpt;
              blogPost.image = items[i].assetUrl;
              blogPosts.push(blogPost);
            }
            var lastItem = items[items.length - 1];
            var offset = lastItem.publishOn;
            jsonUrl = jsonUrlOrigin + '&offset=' + offset;
            theLoop()
          } else {
            var list = $('.sqs-block-code.load-more-summary + .sqs-block-summary-v2 .summary-item-list');
            var summaryStyle = list.find('.summary-item:first-child').attr('style')
            var summaryImgStyle = list.find('.summary-item:first-child .img-wrapper').attr('style')
            list.html('');
            for (var i = 0; i < blogPosts.length; i++) {
              if(i<=5) {
                var active = 'active';
              } else {
                var active = '';
              }
              $('<div data-type="image" style="'+summaryStyle+'" class="summary-item summary-item-record-type-text sqs-gallery-design-autogrid-slide summary-item-has-thumbnail summary-item-has-excerpt summary-item-has-cats summary-item-has-tags summary-item-has-author '+active+'"><div class="summary-thumbnail-outer-container"> <a href="'+blogPosts[i].link+'" class="summary-thumbnail-container sqs-gallery-image-container"> <div class="summary-thumbnail img-wrapper" style="height:0;'+summaryImgStyle+'"><img class="summary-thumbnail-image" data-load="false" src="'+blogPosts[i].image+'"></div></a></div> <div class="summary-content sqs-gallery-meta-container"> <div class="summary-title"> <a href="'+blogPosts[i].link+'" class="summary-title-link">'+blogPosts[i].title+'</a> </div><div class="summary-excerpt summary-excerpt-only"> '+blogPosts[i].excerpt+' </div><a href="'+blogPosts[i].link+'" class="summary-read-more-link">Read More →</a> </div></div>').appendTo(list);
            }
          }
          $('.sqs-block-code.load-more-summary + .sqs-block-summary-v2 .summary-item-list').each(function(){
            if ($(this).children().length > 6) {
              $('<div class="sqs-block button-block sqs-block-button"><div class="sqs-block-content"><div class="sqs-block-button-container--center" data-animation-role="button" data-alignment="center" data-button-size="medium" data-button-type="primary"><a href="#load-more" class="sqs-block-button-element--medium sqs-button-element--primary sqs-block-button-element" data-initialized="true">Load More</a></div></div></div>').appendTo($(this));
            }
          })
          Squarespace.initializeSummaryV2Block(Y)
          Y.all('[data-load]').each(function(img) {
            img.removeAttribute('data-load');
            ImageLoader.load(img);
            img.addClass('loaded');
          });

        })
      }
      function theLoop(){
        ajaxRequests(jsonUrl);
      }
      ajaxRequests(jsonUrl);
      $(document).on('click','.summary-item-list .sqs-block-button-element', function(){
        var visiblePosts = $(this).closest('.summary-item-list').find('.summary-item.active').length;
        var itemLength = $(this).closest('.summary-item-list').find('.summary-item').length;
        if(visiblePosts != itemLength || visiblePosts < itemLength) {
          $(this).closest('.summary-item-list').find('.summary-item').eq(visiblePosts).fadeIn().addClass('active');
          $(this).closest('.summary-item-list').find('.summary-item').eq(visiblePosts).next().fadeIn().addClass('active');
          $(this).closest('.summary-item-list').find('.summary-item').eq(visiblePosts).next().next().fadeIn().addClass('active');
          $(this).closest('.summary-item-list').find('.summary-item').eq(visiblePosts).next().next().next().fadeIn().addClass('active');
          $(this).closest('.summary-item-list').find('.summary-item').eq(visiblePosts).next().next().next().next().fadeIn().addClass('active');
          $(this).closest('.summary-item-list').find('.summary-item').eq(visiblePosts).next().next().next().next().next().fadeIn().addClass('active');
          visiblePosts=visiblePosts+6;
          if(visiblePosts == itemLength || visiblePosts > itemLength) {
            $(this).hide();
          }
        } else {
          $(this).hide();
        }
      })
    }
  })
</script>

I'll also provide below 2 photos, the first one which is my expected view, and then what I'm actually seeing:




What we're actually seeing now where the blogs no longer load:

As a final piece of information, sometimes when loading the page, it will just load the 'load more' button and nothing else.  So it feels like the pagination piece is working but it is failing to load in the blogs.

Any help would be greatly appreciated.

You can use this to Website Tools > Custom CSS to fix problem

div#block-yui_3_17_2_1_1561915224800_4465 img {
    opacity: 1 !important;
}