曾经用过的Typecho主题Lonesome

以前用Typecho创建的黑冰站点，最近在翻那时候的数据库备份（当然，最近也有自己写），发现了这篇曾经刚刚换Lonesome主题时写的文章，放出来留个纪念吧。

之前用的Initial主题，魔改了很多，相信也有人看到啦。最近，有位大佬说网站有点卡，耗电脑资源过多。然后，前不久看到个mrju.cn的主题Lonesome，还挺不错。最后，用了一天时间魔改适配（友链，每次换主题都让人头疼），现在总算完美啦。

Lonesome主题

主题增加后台主题设置，小白也能轻松玩转typecho。不用明白html以及css。回归博客最初的本质。当然你也可以接着折腾下去。折腾到适合自己为止。如需个性化定制，请联系博主。如logo设计以及添加某个小功能等，不过这个收费哈，视情况而定。

魔改

无疑的，添加了谷歌翻译插件，并做了适配：小屏幕下的语言选择可滑动选择更多语言；翻译插件位置调整；浏览器语言获取自动翻译等。

还有侧边栏的一些调整以及顶部统计模块添加了一些内容。

还要说说友链部分，问主题开发者要了他的导航模板，去掉了导航功能，增加了友情链接（直接修改php，添加链接），网站名称避免过长而出现双行，70多个友链差点没加完。接着，又用这套友链模板，魔改了留言榜功能，几乎完美适配。

还有，用主题的归档模板，魔改了分类汇总模板，emmm，最初这玩意还是拿yodu主题的，不管换了多少主题，这个分类汇总我一直在适配新主题。

当然，少不了的是谷歌广告，这次首页是双栏结构，css废了点功夫，这里就不细说了。

导航也做了点调整，主要是把不想要的删掉了，我有六个分类，如果全显示，直接炸的感觉。所以就不显示分类目录了，统一用分类汇总展示！

高端的代码块显示，基本没动，我给添加了复制功能以及划过变色之类的，总之，往高端的方向改了。之前，我用的是prism，这个主题用的是highlight。

最后，来一段魔改生成的一堆css，看着爽一爽算了！！！

.entry-content p img {
    cursor: pointer!important;
    margin: 0 auto;
    display: block;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}

.ads-post {
    float: right;
    margin: 0 0 0 10px!important;
    width: 350px
}

@media (max-width:600px) {
    .ads-post {
        float: none!important;
        margin: 0 auto!important;
        width: auto!important;
        text-align: center;
    }
}

.ads-com {
    margin: 10px auto;
    width: 550px
}

@media (max-width:600px) {
    .ads-com {
        margin: 20px auto;
        width: 250px
    }
}

.view-img img {
    border-radius: 5px;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}

.entry-content p {
    text-align: justify;
    word-break: break-all;
}

.view-img {
    background: rgba(0,0,0,.618)!important;
}

.image_title {
    background: rgba(200,200,200,.9);
}

.poster img {
    display: block;
    margin: 0 auto;
}

.poster {
    border: 0!important
}

input.posters {
    float: right;
    color: #000;
    padding: 0 15px;
    margin-top: 8px;
    background: #fff;
    font-size: 11px;
    line-height: 28px;
}

.entry-content p.notice {
    position: relative;
    padding: .5rem;
    border: 1px dashed #b00;
    background: #eee
}

.entry-content p.notice::before {
    position: absolute;
    top: -.5rem;
    left: .5rem;
    z-index: 1;
    padding: 0 .3rem;
    content: "Notice";
    font-size: .8rem;
    line-height: 1
}

.entry-content p.notice::after {
    position: absolute;
    top: -1px;
    left: .5rem;
    z-index: 0;
    width: 50px;
    height: 6.4px;
    background: #eee;
    content: ""
}

.entry-content code {
    padding: 0;
    margin: 0;
}

@keyframes heartbeat {
    to {
        transform: scale(1.3)
    }
}

pre {
    position: relative;
}

.btn-copy {
    display: inline-block;
    cursor: pointer;
    background-color: #eee;
    background-image: linear-gradient(#fcfcfc,#eee);
    border: 1px solid #d5d5d5;
    border-radius: 3px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-appearance: none;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    color: #333;
    -webkit-transition: opacity .3s ease-in-out;
    -o-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    padding: 2px 6px;
    position: absolute;
    right: 5px;
    top: 5px;
    opacity: 0;
}

.btn-copy span {
    margin-left: 5px;
}

pre:hover .btn-copy {
    opacity: 1;
}

.hljs ol li:hover {
    background: #ccc;
}

::selection {
    color: #fff;
    background-color: #666;
}

#digg a {
    padding: 0 5px
}

#digg {
    padding: 10px 0;
    text-align: center;
}

ul.mod-list.row {
    margin: 0
}

.mod-list li {
    list-style: none;
}

.pull-right {
    float: right!important
}

.badge {
    display: inline-block;
    padding: 3px 7px;
    min-width: 10px;
    border-radius: 10px;
    background-color: #777;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    white-space: nowrap;
    font-weight: 700;
    font-size: 12px;
    line-height: 1
}

.badge {
    background-color: #cfdadd
}

.bg-danger {
    background-color: #f05050;
    color: #fff
}

.bg-info {
    background-color: #23b7e5;
    color: #dcf2f8
}

.bg-warning {
    background-color: #fad733;
    color: #fffefa
}

.badge,.label {
    text-shadow: 0 1px 0 rgba(0,0,0,.2);
    font-weight: 700
}

.b-white {
    border-color: #fff
}

.product-title {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}