Volgende en Vorige aan het einde van blogpost

I would like to have links for the next and previous post in the end of each blog text. I'm using Emporio. I couldn't find any setting / gadget to get the links. Do I need to change html-code?

Categorieën:ChromeGet Help with an IssueTemplates, gadgets, HTMLWindows

4 berichten

838 weergaven

1 deskundig antwoord

+1

Content van de community is mogelijk niet geverifieerd of up-to-date.

Beste antwoord

20-04-17

Soraya Lambrechts [TC FR] zei:

Hi, welcome to the Blogger forum,


Step 1 :

Open the XML editor and locate the Blog1 widget.

Step 2 :

In the "postPagination" inclusion, add the red codes

<b:includable id='postPagination'>
  <div class='blog-pager container' id='blog-pager'>
    <b:include cond='data:newerPageUrl' name='super.previousPageLink'/>
    <b:include cond='data:olderPageUrl' name='super.nextPageLink'/>
    <b:include cond='data:view.url != data:blog.homepageUrl' name='super.homePageLink'/>
  </div>
</b:includable>

Step 3 :

In the "main" inclusion, add the red codes :

<b:includable id='main'>
          <b:include name='noContentPlaceholder'/>
          <b:include name='super.main'/>
          <b:include cond='data:view.isPost' name='postPagination'/>
</b:includable>

Step 4 :

And in the CSS editor, add these styles :

.blog-pager-newer-link { float: left; }
.blog-pager-older-link { float: right; }

Best :)

Als beste antwoord gemarkeerd door irsah

+9

Antwoorden

Druk in een samengevouwen rij op Enter om deze uit te vouwen.

Samengevouwen

Soraya Lambrechts [TC FR] zei:

 Hi, welcome to the Blogger forum, Step 1 : Open the XML editor and locate the Blog1 widget. Step 2 : In the "postPagination" inclusion, add the red codes <b:includable id='postPagination'> <div class='blog-pager container' id='blog-pager'>

20-04-17

heinä zei:

Now it works :) Thanks a lot!






Zie ook: https://www.airinaa.com/2018/04/notable-theme-add-next-home-previous.html


The tutorial earlier works & tested on Notable theme and can be seen at this test blog => Notable Theme Next Prev Links (look at bottom of posts).

Duration: Less than 1 minute

Here is the complete step-by-step guide. Backup theme if required...

• Go to Theme > Edit HTML > click Jump to widget > select Blog1..
• Find this Line <b:includable id='postPagination'>
• Expand the codes by click the small black triangle.
• Replace the entire line so it would look like so:-

          <b:includable id='postPagination'>
<div class='blog-pager container' id='blog-pager'>
<b:include cond='data:newerPageUrl' name='super.previousPageLink'/>
<b:include cond='data:olderPageUrl' name='super.nextPageLink'/>
<b:include cond='data:view.url != data:blog.homepageUrl' name='super.homePageLink'/>
</div>
</b:includable>

• Then scroll to the top and find this line <b:includable id='main' var='this'>
• Expand the codes by clicking the small black triangle.
• Add the pagination inclusion highlighted yellow as below (refer screen capture on the exact location)...

<b:include cond='data:view.isPost' name='postPagination'/>

• Click Save Theme

Then Add the pagination CSS...

• Go to Theme
• click Customize
• slelect Advance
• find & select Add CSS and add below...

.blog-pager { text-align:center; float:none; margin-right:0; }
.blog-pager a { font: inherit!important; text-transform:uppercase;  }
.blog-pager-newer-link { float: left; }
.blog-pager-older-link { float: right; }

• click Apply to Blog.
• Refresh and preview your blog pages.

This guide was adapted at this forum thread & this forum thread designed for Emporio theme.