<div class="sidebar">
    <h3 class="sidebar-title">Search</h3>
    <div class="sidebar-item search-form">
        <form action="">
            <input type="text">
            <button type="submit"><i class="bi bi-search"></i></button>
        </form>
    </div>
    <h3 class="section-title">Categories</h3>
    <div class="sidebar-item categories">
        <ul class="categories">
            <% loop $Categories %>
                    <li><a href="$Link">$Title <span>($Articles.count)</span></a></li>
            <% end_loop %>
        </ul>
    </div>
    <!-- BEGIN ARCHIVES ACCORDION -->
    <h3 class="section-title">Archives</h3>
    <div id="accordion" class="panel-group blog-accordion">
        <div class="panel">

            <div id="collapseOne" class="panel-collapse collapse in">
                <div class="panel-body">
                    <ul>
                                                    <% loop $ArchiveDates %>
                            <li><a href="$Link">$MonthName $Year ($ArticleCount)</a></li>
                                                    <% end_loop %>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!-- END  ARCHIVES ACCORDION -->

    <h3 class="section-title">Regions</h3>
    <div class="sidebar-item categories">
        <ul class="categories">
            <% loop $Regions %>
                    <li><a href="$ArticlesLink">$Title <span>($Articles.count)</span></a></li>
            <% end_loop %>
        </ul>
    </div>
    <!-- BEGIN LATEST NEWS -->
    <h3 class="sidebar-title">Recent Posts</h3>
    <div class="sidebar-item recent-posts">
        <div class="post-item clearfix">
            <img src="$ThemeDir/img/blog/blog-recent-1.jpg" alt="">
            <h4><a href="blog-single.html">Nihil blanditiis at in nihil autem</a></h4>
            <time datetime="2020-01-01">Jan 1, 2020</time>
        </div>

        <div class="post-item clearfix">
            <img src="$ThemeDir/img/blog/blog-recent-2.jpg" alt="">
            <h4><a href="blog-single.html">Quidem autem et impedit</a></h4>
            <time datetime="2020-01-01">Jan 1, 2020</time>
        </div>

        <div class="post-item clearfix">
            <img src="$ThemeDir/img/blog/blog-recent-3.jpg" alt="">
            <h4><a href="blog-single.html">Id quia et et ut maxime similique occaecati ut</a></h4>
            <time datetime="2020-01-01">Jan 1, 2020</time>
        </div>

        <div class="post-item clearfix">
            <img src="$ThemeDir/img/blog/blog-recent-4.jpg" alt="">
            <h4><a href="blog-single.html">Laborum corporis quo dara net para</a></h4>
            <time datetime="2020-01-01">Jan 1, 2020</time>
        </div>

        <div class="post-item clearfix">
            <img src="$ThemeDir/img/blog/blog-recent-5.jpg" alt="">
            <h4><a href="blog-single.html">Et dolores corrupti quae illo quod dolor</a></h4>
            <time datetime="2020-01-01">Jan 1, 2020</time>
        </div>

    </div>
    <h3 class="sidebar-title">Tags</h3>
                        <div class="sidebar-item tags">
                            <ul>
                                <li><a href="#">App</a></li>
                                <li><a href="#">IT</a></li>
                                <li><a href="#">Business</a></li>
                                <li><a href="#">Mac</a></li>
                                <li><a href="#">Design</a></li>
                                <li><a href="#">Office</a></li>
                                <li><a href="#">Creative</a></li>
                                <li><a href="#">Studio</a></li>
                                <li><a href="#">Smart</a></li>
                                <li><a href="#">Tips</a></li>
                                <li><a href="#">Marketing</a></li>
                            </ul>
                        </div>
    <!-- END LATEST NEWS -->
</div>
