Button "load more" or "next page"

Hello! On my website I upload articles weekly. I need to create a button after a certain number of article previews with options like “load more” or “go to the next page” but I don’t know how to…

The simplest option is to create a “read more” link under your article previews. The link can be text, a button or a graphic. The link should be set to open your full article page. Your full article pages could also have links at the foot of the article that takes people to the previous and next article so they don’t have to keep returning to the preview page to get to the next article. Again, the links would just point to the previous and next article in sequence.

That’s right, thank you, but I’m already doing it. What I meant was referred to the page where there is a list of all the previews. I have seen websites where after a defined number of previews there is a button at the end of the page of the type “load other” that loads the same number of articles in preview and so on… That’s what I can’t do, this type of button…

@Diana I understand entirely. Normally on long article pages there is a summary article followed by a read-more link that when clicked will expand the article to include the full text. This is something that cannot be done in Sparkle due to its fixed position layout. Essentially, were trading-off absolute freedom of page layout design for features that require the page content to expand. However, in your particular case, you do have the option of using an iframe. Although not the ideal situation, it does give you the effect you’re looking for.

Essentially, you would create your article summary pages as individual site pages that are excluded from the navigation structure. These pages should all be the same width and length. You then create an iframe on the page where you want to display your summaries. The iframe would be sized to the same size as your summary pages to avoid scroll bars from appearing. The iframe would typically point to the first or last summary page so when the page loads, the relevant summary page is visible.

On each summary page you would place a previous and next link at the bottom which links to the previous or next summary page in sequence. You could also have a standard home link to take people directly to the first summary page.

When the initial page is displayed, the previous and next links will be displayed INSIDE the iframe along with the content. Clicking the links will simply change the displayed summary page within the iFrame.

Here is the code you will need to add to your page:

<iframe src="your-first-article-page.html" style="border:0px #ffffff none;" name="myiFrame" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" height="1200px" width="800px" allowfullscreen></iframe>

This will create an iframe 800px wide X 1200px high. Your article pages would be set to the same dimensions. If your article summaries contained links to the full article, these too would open in the same iFrame, so you would need an additional link on the full article page to return to the summaries page. Again, you full article pages would be set to the same dimensions as the iFrame.

Hi Diana, I believe @francbrowne alluded to this. I have tried this. see if it will be suitable for what you wish.

https://sites.ualberta.ca/~mhirji/newsletters.html

@Diana, I have an example here to show you how I have set it up for one of our latest clients - https://finacialstreams.com.au

It’s not perfect, but it works. Once the blog page gets to long I will introduce a button (like a blog post pagination you see) and move the user to a second page laid out the same way.

EDIT : A big sorry… I mistyped the link - https://financialstreams.com.au//blog.html
Thanks @mhirji for pointing it out! :slight_smile:

Hi Henriks Link seems broken? I cannot get to the page??

1 Like