修改模板添加左右边栏

测试
- 字
2024-12-11

通过修改模板文件“Ankia-Theme.ejs”来实现

特别说明：

调用的函数里面的数字代表的东西

subRoot.note.getVisibleChildNotes()[1].getVisibleChildNotes()

0：表示说说

1：表示分类

2：推荐阅读

3：顶部的导航

4：标签

5：首页内容

 

左边栏添加：”标签“※

<!--左边标签栏-->
              <% 
             function getRandomColor2() {
                 const letters = '0123456789ABCDEF';
                 let color = '#';
                 for (let i = 0; i < 6; i++) {
                     color += letters[Math.floor(Math.random() * 16)];
                 }
                 return color + 'A6';
             }
           %>
      <div id="recommendedReadingCard" class="bloggerInfoCardStyle" style="margin-left: auto;">
         <div class="bloggerInfoTitleStyle">标签</div>
        <hr>
      <div class="tagCloud">
        <% subRoot.note.getVisibleChildNotes()[4].getVisibleChildNotes().forEach( tags => { %>
        <a class="tagItem" style="background-color: <%= getRandomColor2() %>;" href="./tag_<%= tags.title %>"><%=`${tags.title}(${tags.getVisibleChildNotes().length})`%></a>
        <% }) %>
      </div>
      </div>

右边栏添加：“分类”※

<!--右边的分类栏-->
      <div id="announcement" class="bloggerInfoCardStyle">
         <div class="bloggerInfoTitleStyle">分类</div>
        <hr>
      <div class="tagCloud">
 <% subRoot.note.getVisibleChildNotes()[1].getVisibleChildNotes().forEach((childNote)=> { %>
          <a href="<%= childNote.shareId %>" title="<%= childNote.title %>" style="display: flex;justify-content: flex-start;align-items: center;" class="menuLinkStyle"><%= childNote.title %>
            <div id="articleCount"><%= childNote.getVisibleChildNotes().length %></div>
          </a>
          <% })%>
      </div>
      </div>

右边栏添加：常用工具※

 <!--右边栏的常用工具-->       
     <div id="announcement" class="bloggerInfoCardStyle">
       <div class="bloggerInfoTitleStyle">常用工具</div>
       <hr>
     <div class="tagCloud">
         <a href="./1QuOTXWlqEjm" class="menuLinkStyle">软件</a>
     </div>
     </div>

 

目录