在網上瀏覽博客時經常看到頁面的右上角或左上角有一個fork me on github的按鈕，本文將介紹如何實現。
1、效果展示
右上角截圖
right
左上角截圖
left
2、實現
2.1、樣式挑選
點我跳轉 挑選你自己喜歡的樣式。
2.2、next主題實現
打開文件：hexo博客根目錄\themes\next\layout\_layout.swig 找到如下代碼塊
<div class="{{ container_class }} {% block page_class %}{% endblock %} ">
<div class="headband"></div>
添加自己喜歡的樣式后結果如下
<div class="{{ container_class }} {% block page_class %}{% endblock %} ">
<div class="headband"></div>
<a target="_blank" ></a>
訪問你的本地服務測試看看修改的效果吧。
2.3、小屏幕不顯示fork me on github
按照上面的步驟當屏幕縮小后還會顯示fork me on github圖標，但這不是我想要的，我希望在大屏下顯示，小屏后就不顯示了。方法如下：
修改文件hexo博客根目錄\themes\next\layout\_layout.swig 找到如下代碼塊
<html class="{{ html_class | lower }}">
<head>
{% include '_partials/head.swig' %}
<title>{% block title %}{% endblock %}</title>
添加如下代碼，結果如下
<head>
{% include '_partials/head.swig' %}
<title>{% block title %}{% endblock %}</title>
<style>
.forkme{
display: none;
}
@media (min-width: 768px) {
.forkme{
display: inline;
}
}
</style>
</head>
最后在2.2節添加的代碼塊上套上div加上class就行了，如下
<div class="forkme">
<a target="_blank" ></a>
</div>
最后在試試效果達到自己的想要的了
