首页 » 建站手册 » 本站已更换Lonesome之Typecho主题

本站已更换Lonesome之Typecho主题

谷歌已收录,更新于2019年06月15日; 如遇到问题,请留言及时通知站长; 欢迎加入 三生三世,讨论各种问题!

说明

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

Lonesome主题

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

Lonesome主题预览

魔改

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

google翻译插件

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

网站信息统计

还要说说友链部分,问主题开发者要了他的导航模板,去掉了导航功能,增加了友情链接(直接修改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;
}

后续说明

不出意外,主题不会再换了。并且,应该不会再添加地球统计、评论UAIP位置、来访提示、评论等级等功能。

emmm,差点忘记说,还添加了海报分享功能,文末右下角的文章分享,点击会出现一张图片,右击复制图片,即可分享本文内容!!!

一个只会魔改主题,而不会制作主题的站长,专业扒各种网站的各种样式。希望每一位来到这里的访客,都能拿到你们需要的资源!

发表评论

已有 16 条评论

  1. 飞扬的旋律 飞扬的旋律说道:

    博主我发现了一个挺好看的博客,你可以去看看。
    https://molunerfinn.com/

    1. 枂下 枂下说道:

      emmm,还行吧

  2. 征稿网 征稿网说道:

    好奇文章第二段下加广告怎么实现的?

    1. 枂下 枂下说道:

      我在这篇文章里介绍过
      https://black1ce.com/other/google-adsense-typecho-css.html

  3. leetown leetown说道:

    你好,能否分享下代码高亮的源码或插件?

    1. 枂下 枂下说道:

      主题带的,而且收费主题,无法分享抱歉

  4. 南栀 南栀说道:

    表示很喜欢大佬的评论排行榜功能 大佬要不要出个教程 哈哈

    1. 枂下 枂下说道:

      这种玩意出不了教程,每个主题都有很大的区别

  5. 奕奕博客 奕奕博客说道:

    “不出意外,主题不会再换了。” 我不信!

    1. 枂下 枂下说道:

      哈哈哈哈,“不出意外”

      1. 仙踪小栈 仙踪小栈说道:

        域名呢,哈哈

        1. 枂下 枂下说道:

          域名,就更不会换了吧

  6. 七越 七越说道:

    咕咕咕

    1. 枂下 枂下说道:

      快换主题一起玩啊

  7. Eltrac Eltrac说道:

    沙发_(:з」∠)_

    1. 枂下 枂下说道:

      这沙发速度,666啊

返回主页看更多
赏杯咖啡给站长 支付宝 扫一扫