Use the Github space to build a Hexo technology blog-add a message board function to the Hexo NexT theme (13)

Not implemented yet:

Leave a message to make the blog more humane

The NexT theme official website has a method for adding tab pages and category pages. In fact, the way to add a message book is the same. The way is slightly different.

1. Add guestbook page

Go to the root directory of the blog and run the command:

hexo new page guestbook

Second, add more visitor codes to the message page

In the previous step, use the hexo command to create a new page and enter the blog sourcedirectory. There will be an additional gusetbookfolder with a index.mdfile in it. Open the file for editing:

<div class="ds-recent-visitors" data-num-items="28" data-avatar-size="42" id="ds-recent-visitors"></div>

Add this code to the index.mdbottom.
Then you have to log in to the site you talk about, go to Settings-> Custom CSS, and add:

#ds-reset .ds-avatar img,
#ds-recent-visitors .ds-avatar img {
    width: 54px;
    height: 54px;     /*設置圖像的長和寬,這裏要根據自己的評論框情況更改*/
    border-radius: 27px;     /*設置圖像圓角效果,在這裏我直接設置了超過width/2的像素,即為圓形了*/
    -webkit-border-radius: 27px;     /*圓角效果:兼容webkit瀏覽器*/
    -moz-border-radius: 27px;
    box-shadow: inset 0 -1px 0 #3333sf;     /*設置圖像陰影效果*/
    -webkit-box-shadow: inset 0 -1px 0 #3333sf;
}

#ds-recent-visitors .ds-avatar {
    float: left
}
/*隱藏多說底部版權*/
#ds-thread #ds-reset .ds-powered-by {
    display: none;
}

 

Published 120 original articles · praised 201 · 230,000 views +

Guess you like

Origin blog.csdn.net/wugenqiang/article/details/88386497