I have a sidebar menu with many entries and many sublevels, which looks like that :
<div class="container-fluid">
<div class="row">
<div class="col-md-2" id="sidebar" style="margin: 5px 0">
<div class="list-group panel">
<a href="/demo" class="list-group-item">Menu</a>
<a href="#tech" class="list-group-item" data-toggle="collapse"><i class="fa fa-wrench"></i> Menu 1 <i class="fa fa-caret-down"></i></a>
<div class="collapse" id="tech" data-parent="#sidebar">
<a href="#techsub1" class="list-group-item" data-toggle="collapse">Sub 1 <i class="fa fa-caret-down"></i></a>
<div class="collapse" id="techsub1" data-parent="#techsub1">
<a class="list-group-item" href="techsub1sub1.html">techsub1sub1</a>
<a class="list-group-item" href="techsub1sub2.html">techsub1sub2</a>
</div>
<a href="#techsub2" class="list-group-item" data-toggle="collapse">Sub 2 <i class="fa fa-caret-down"></i></a>
<div class="collapse" id="techsub2" data-parent="#techsub2">
<a href="#techsub2sub1" class="list-group-item" data-toggle="collapse">Sub 2 <i class="fa fa-caret-down"></i></a>
<div class="collapse" id="techsub2sub1" data-parent="#techsub2sub1">
<a class="list-group-item" href="techsub2sub1sub1.html">techsub2sub1sub1</a>
<a class="list-group-item" href="techsub2sub1sub2.html">techsub2sub1sub2</a>
</div>
</div>
</div>
<a href="#anx" class="list-group-item" data-toggle="collapse" data-parent="#sidebar"><i class="fa fa-book"></i> Menu 2 <i class="fa fa-caret-down"></i></a>
<div class="collapse" id="anx" data-parent="#sidebar">
<a class="list-group-item" href="anx1.html">anx1</a>
<a class="list-group-item" href="anx2.html">anx2</a>
</div>
</div>
</div>
<main class="col-md-10" style="background-color: #fff; max-width: 1140px; padding-top: 30px; padding-bottom: 20px">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</main>
</div>
</div>
It works well but there are so many entries in the menu that I want to use a pager on each page [Previous - Current - Next]
My concern is that when I click on Previous or Next page, the sidebar is collapsed. Is there a way to expand the according page called, but keeping it collapsed on the home page ?
All you need to do is to add a .show CSS class to the collapsed (having .collapse CSS class) block, which you want to be expanded. See https://getbootstrap.com/docs/4.0/components/collapse/
It can be done in two basic ways - hard-coded for each page or added dynamically/programmatically based on some parameter (probably id of desired expanded collapse)
Passing a parameter from one to other page on redirecting is a separate question, but in case you wonder how to do it - try some URL parameters/hash or cookies/local storage