Valine is a very lightweight comment system with no back-end implementation. At present, many static blogs such as Hexo, Jekyll, Hugo, etc. Native support valine. The halo blog I use drives me crazy because of its own emoticon function, so I still choose to continue to use valine (I won't say it's because I don't want to give up the comments that have been saved for a year).
Valine official document
As of this update, valine has been updated to version v 1.4. 14. Many previously unsupported functions were finally supported after N versions of liver explosion at home due to the author's great idleness during the epidemic. Of course, there are some small functions that we can find and use in the magic valine, which I will recommend later.
This interface beautification is basically that radish and cabbage have their own love. Some people like the original "essence" of valine, while others like to change it according to their own tastes. The following are all beautification of the style of my news area. If you are also in v 1.4. 14 version, you can use the following style directly.
In Valine 1.4.5 version, this has already supported the custom expression function, and mainly configured two configuration items: emojiCDN and emojiMaps. It is recommended to read the document. More importantly, it should be the source of expression packs. Here, we recommend the CDN emoticon package interface provided by xaoxuu, which covers emoticon packages such as aru, Post Bar, qq and Weibo. At present, the usage of native characters is mainly to write paths in emojiCDN and mapping relationships in emojiMaps, which still makes the writing very complicated when a large number of characters are added to js, so I suggest that it is best to modify the configuration in Valine source code.
First, locate here in the source code, and modify the path of the original Sina emoticon package, corresponding to the emojiCDN field in the js configuration:
Then locate here and modify the mapping path of the emoticon package, corresponding to the emojiMaps field in js:
Modifying the above source code can avoid writing many complicated configurations with js, and friends who need it can consider it.
Because it is imported in js, we don't need to manually add facial characters one by one. Take the xaoxuu face text given above as an example, we can write it like this:
After adding Yan characters, classifying them should be our most intuitive idea. However, the author of native valine has not provided this function at present. Below I provide a MiniValine that can realize the classification function of expression packs.
MiniValine demo address
The author provides two types of valine comment plug-ins, one is xCss style, that is, the author of native valine style; The other one is DesertP style, which I also used in the previous Hexo blog (called enhanced valine). Now that the function of native valine has caught up, I switched back to the native valine plug-in written by xCss.
On the other hand, if you want to use this Valine plug-in with emoticon classification function, you can refer to the Github document provided by the author. In addition, this version of MiniValine not only has the classification of emoticons, but also the functions such as blogger and buddy logo to be provided below have been integrated and are still very easy to use.
I copied this picture from Uncle Drew. Awkward), I found a lot of pictures before, but I didn't think they were very good. I chose to choose and finally used Uncle Drew, which made me feel better. I suggest that when looking for a picture, you'd better look for one with a white background or a transparent background, otherwise it will look ugly.
How to use it is as follows: Add CSS to your blog style file.
The pictures in the above websites can be changed according to your own taste.
Change this according to your own taste. You can even imitate Disqus and put the three input boxes and the submit button in one line.
Make sure that the id of the div of the Valine comment is vcomments, that is,
This is relatively simple and can also add some dynamics to the blog.
Look at the style of my comment area, so I won't put pictures here.
This local valine is not supported. We need to use the valine file of magic change, and we can directly replace the native valine with the following Valine.min.js file.
Compared with the native, it has the following functions:
The usage method is similar to the native method, except that more parameters can be set:
For example, we can add the following fields to the configuration js of Valine:
The above can be achieved by adding parameters in the configuration of valine, and other native parameters will not be affected. MD5 encryption can recommend an online website, but MD5 front-end single encryption itself is not secure, but security is relative, and only the email information itself is of little value. If the requirements for blog security are relatively high, and it is hoped that the mailbox of friends who leave messages will not be leaked (of course, it cannot be completely avoided), then it is still not recommended to use this.
This function is mainly done with service sauce. You can prompt your blog to receive comments through WeChat or qq. The original text of the author Xiaokang blog is very detailed. If you need to turn on this function, you can read it on the move, so I won't spend much time explaining this function here.