Split blogger Posts into Multiple Pages
split-blogger-post is compatible with almost all blogger templates and it can be implemented in easy ways. For user friendliness, this solution code come up with a button “Split Page ‘⏩’ ” and easy usage within the text editor. It is light weight and comparatively optimized so it will not interrupt your scripts uselessly.
Demo : https://nextprev-preview.blogspot.com/2018/11/test-post.html
Posts and Pages can be divided into parts with page-breaks.
Navigation captions can be edited.
Slides counter can be displayed.
Custom HTML and CSS can be added above and below post slides.
Installing split-blogger-post on your Blogger website is simple! In this article, we will walk you through each step. If you prefer visual instructions, check out our video tutorial below:
...
These are Following Steps:
Go to Blogger Theme and Click the Edit HTML Button.
Click around the Code and Press Ctrl+F and Search for: ]]></b:skin>
then paste the code in the style.css file above: ]]></b:skin>
click the Save Template button.
Go to Blogger Theme and Click the Edit HTML Button.
Click around the Code and Press Ctrl+F and Search for: <data:post.body></data:post.body>
In the most blogger templates, this tag exists at least twice, or more than once. But how can we find the right tag that we need.
If you have multiple <data:post.body></data:post.body> in your template then, before each of those <data:post.body></data:post.body> tag write this <h1>First place</h1> , here ‘First’ is for the first <data:post.body></data:post.body> , write ‘Second’ for the second <data:post.body></data:post.body> and so on. Now save your template.
After saving is complete, go to your blog and notice which <h1 ></h1> tag is appearing before your post body. If ‘First’ is appearing then the first <data:post.body></data:post.body> is the actual <data:post.body></data:post.body> .
That’s it, you just debugged your code to find out which <data:post.body></data:post.body> is the actual one working. Now go back to your template code editor and again find all those <data:post.body></data:post.body> and remove the <h1></h1> tag you added to debug, but only before the actual <data:post.body></data:post.body> , write something like <!– POST BODY HERE –> , a comment, so that to use it the next step.
<data:post.body></data:post.body> and replace it with the code in the body.html file.Just don’t forget to remove all the <h1></h1> tags you used for debugging.
Click around the Code and Press Ctrl+F and Search for the close tag </body>.
Paste the code in the script.js file just befor the closing tag </body>.