Добрый день, сегодня я хочу поделиться с реализацией — кнопка «показать еще товары» на Simpla.
Как работает кнопка вы можете посмотреть на видео www.youtube.com/watch?v=MFU8v0IXyW8
Для того чтобы работала кнопка «показать еще» обворачиваем класcом все товары, например:

<div id="notliders" class="tiny_products">
    {foreach $products as $product}
        ... Здесь вашы товары
    {foreach}
</div>			
И сама пагинация чтобы получилась как у меня на картинке нужно

В папке design/default/html/pagination.tpl перед {include file='pagination.tpl'} вставляем следующий код

{if $total_pages_num > 1 && $current_page_num == 1}
	<div id="load-more-button">+ Показать еще 24 товара</div>
{/if}
{include file='pagination.tpl'}

Далее мы подключаем библиотеку и сам скрипт

    	{literal}
					<script src="design/default/js/jquery.infinitescroll.js"></script>

					<script type = "text/javascript" >
					(function ($, undefined) {
						$.extend($.infinitescroll.prototype, {
							_setup_twitter: function infscr_setup_twitter() {
								var opts = this.options, instance = this;
								$("#load-more-button").live('click', function (e) {
									if (e.which == 1 && !e.metaKey && !e.shiftKey) {
										e.preventDefault();
										$(".pagination").hide();
										instance.retrieve();
									}
								});
								instance.options.loading.start = function (opts) {
									opts.loading.msg.appendTo(opts.loading.selector).show(opts.loading.speed, function () {
										instance.beginAjax(opts);
									});
								}
							}, _showdonemsg_twitter: function infscr_showdonemsg_twitter() {
								var opts = this.options, instance = this;
								opts.loading.msg.find('img').hide().parent().find('div').html(opts.loading.finishedMsg).animate({opacity: 1}, 2000, function () {
									$(this).parent().fadeOut('normal');
								});
								$(opts.navSelector).fadeOut('normal');
								$("#load-more-button").hide();
								opts.errorCallback.call($(opts.contentSelector)[0], 'done');
							}
						});
					})(jQuery);
				</script>

					<script type = "text/javascript" >
						$(document).ready(function () {
							$('#notliders.tiny_products').infinitescroll({navSelector: ".pagination", nextSelector: ".next_page_link", itemSelector: "#notliders.tiny_products", behavior: "twitter"});
						});
					</script >
				{/literal}

ну и мой файл пагинации design/default/html/pagination.tpl выглядит следующим образом

{* Постраничный вывод *}

{if $total_pages_num>1}
	{* Скрипт для листания через ctrl → *}
	{* Ссылки на соседние страницы должны иметь id PrevLink и NextLink *}

	<!-- Листалка страниц -->
	<div class="pagination">
		<div style="display: inline-block;">

		{* Количество выводимых ссылок на страницы *}
		{$visible_pages = 3}

		{* По умолчанию начинаем вывод со страницы 1 *}
		{$page_from = 1}

		{* Если выбранная пользователем страница дальше середины "окна" - начинаем вывод уже не с первой *}
		{if $current_page_num > floor($visible_pages/2)}
			{$page_from = max(1, $current_page_num-floor($visible_pages/2)-1)}
		{/if}

		{* Если выбранная пользователем страница близка к концу навигации - начинаем с "конца-окно" *}
		{if $current_page_num > $total_pages_num-ceil($visible_pages/2)}
			{$page_from = max(1, $total_pages_num-$visible_pages-1)}
		{/if}

		{* До какой страницы выводить - выводим всё окно, но не более ощего количества страниц *}
		{$page_to = min($page_from+$visible_pages, $total_pages_num-1)}


		{if $current_page_num==2}<a class="prev_page_link" href="{url page=null}"></a>{/if}
		{if $current_page_num>2}<a class="prev_page_link" href="{url page=$current_page_num-1}"></a>{/if}
		{* Ссылка на 1 страницу отображается всегда *}
		<a {if $current_page_num==1}class="selected"{/if} href="{url page=null}">1</a>

		{* Выводим страницы нашего "окна" *}
		{section name=pages loop=$page_to start=$page_from}
			{* Номер текущей выводимой страницы *}
			{$p = $smarty.section.pages.index+1}
			{* Для крайних страниц "окна" выводим троеточие, если окно не возле границы навигации *}
			{if ($p == $page_from+1 && $p!=2) || ($p == $page_to && $p != $total_pages_num-1)}
				<a {if $p==$current_page_num}class="selected"{/if} href="{url page=$p}">...</a>
			{else}
				<a {if $p==$current_page_num}class="selected"{/if} href="{url page=$p}">{$p}</a>
			{/if}
		{/section}

		{* Ссылка на последнююю страницу отображается всегда *}

		<a {if $current_page_num==$total_pages_num}class="selected"{/if}  href="{url page=$total_pages_num}">{$total_pages_num}</a>

		{if $current_page_num<$total_pages_num}<a class="next_page_link" href="{url page=$current_page_num+1}"></a>{/if}
		</div>
	</div>
	<!-- Листалка страниц (The End) -->
{/if} 

Вроде ничего не забыл) Спасибо за внимание! Надеюсь ета статья была для вас полезной)