海狸网

  • 首页
  • 源码分享
    • APP源码
    • 商业源码
  • 主题插件
    • wordpress主题
    • wordpress插件
    • Typecho主题
    • Typecho插件
    • Zblog主题
    • Zblog插件
    • Emlog主题
    • Emlog插件
    • 苹果cms主题
    • 苹果cms插件
    • Discuzq
  • 系统软件
    • Windows平台
    • Mac平台
    • Android平台
    • Nas平台
    • VPS相关
    • 软件分享
  • 建站技巧
  • 视频推荐
  • 生活圈
  • 网址导航
海狸网
佛系博主,随缘更新,有事请留言。
  1. 首页
  2. 主题插件
  3. Typecho主题
  4. 正文

typecho美化版后台

2020年04月02日 188点热度 0人点赞 0条评论

扩展更新,根据http://www.hail520.cn/archives/626做了一个简单的后台中心,如有需要,可以下载替换就行了

个人觉得小白还是不要下载这个比较好

感觉还挺好看的,放着这里,做个记录,方便下载

过程记录(只讲思路):
1.首先,要改的只有一个文件,那就是admin/header.php,我需要在它的头部添加js和css的引用,这样就会全局生效。

<?php if($user->group != "administrator"): ?>
<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css">
<link rel="stylesheet" href="<?php $options->siteUrl(); ?>/user/user.css?v=1.0">
<script>
var UserLink="<?php $options->adminUrl('profile.php'); ?>";
var UserPic="<?php echo Typecho_Common::gravatarUrl($user->mail, 100, 'X', 'mm', $request->isSecure()); ?>";
var SiteLink="<?php $options->siteUrl(); ?>";
var UserName="<?php $user->screenName(); ?>";
var UserGroup="<?php $user->group(); ?>";
var SiteName="<?php $options->title(); ?>";
</script>
<script src="<?php $options->siteUrl(); ?>/user/user.js?v=1.0"></script>
<?php if($menu->title == "网站概要"): ?>
<style>
.typecho-page-main div:nth-child(4){display:none;}
</style>
<?php endif; ?>
<?php endif; ?>

大概的含义是,对用户组进行判断,如果不是管理员则显示引用的外部代码,在此基础上判断是否为首页界面,想办法去掉typecho官方的更新公告,另外再设置常用字段,方便js进行判断。

2.在根目录创建member.php,加入以下代码。

<!DOCTYPE HTML>
<html class="no-js">
    <head>
        <meta charset="UTF-8">
          <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="renderer" content="webkit">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>会员中心</title>
          <style>
          *{margin:0;
            padding:0;}
          html,body{
              height:100%;
            width:100%;
          }
        </style>
    </head>
    <body>
          <iframe id="contentPage" src="admin" scrolling="yes" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="100%" frameborder="0"></iframe>
    </body>
</html>

通过iframe 嵌套的方式,让用户访问member.php等同于访问后台,因为有了之前的判断,非管理员用户呈现的都是自己定义的样式。本来我是准备参考QQ爹博客实现前台登录功能,但是typecho方法里面的退出登录后跳转地址根本控制不了,所以干脆用嵌套来的实在。

3.通过js修改判断登录的用户并且修改typecho的导航区域,我没有使用jquery而是原生js,然后通过css对js新增加的区块进行样式定义,同时还修改了登录注册界面的样式,于是就有了以下的效果。

1584859421-300x154-1

2690723818-300x183-1

因为所有的功能都是几个小时做出来的,都很简陋,代码也不复杂

下载地址:(原版)https://www.lanzous.com/iaxnxji


我这边修改了一下样式,我个人更喜欢白色系的风格,如图所示:

968766281-300x191-1

1017339640-300x140-1

4241336738-300x145-1

下载地址:https://www.lanzous.com/iaxnxhg

打赏赞微海报分享
本作品采用 知识共享署名 4.0 国际许可协议 进行许可
标签: typecho主题
最后更新:2020年09月14日

小海

打赏 点赞
< 上一篇
下一篇 >

文章评论

取消回复

内容搜索

小海狸

保持饥渴的专注,追求最佳的品质

毒鸡汤
分类目录
  • APP源码
  • Mac平台
  • Nas平台
  • Typecho主题
  • Typecho插件
  • Windows平台
  • wordpress主题
  • wordpress插件
  • Zblog插件
  • 商业源码
  • 建站技巧
  • 生活圈
  • 苹果cms主题
  • 苹果cms插件
  • 视频推荐
  • 软件分享
最新 热点 随机
最新 热点 随机
WordPress免费博客杂志主题CX-MULTI 推荐一款极简约的wordpress免费博客自媒体文艺主题下载 WordPress导航主题VIK Git:一款比付费主题更像是付费主题的WordPress免费主题 千面家园wordpress多行业主题-免费版 自适应wordpress电影电视网站中文免费主题模板
推荐一款极简约的wordpress免费博客自媒体文艺主题下载WordPress免费博客杂志主题CX-MULTI
在线自动播放快手小姐姐视频MP4源码 全新美化多功能爱蜗影视v9.1完整APP源码 无后门+有后台 jQuery仿直播点赞喷射特效,简单特效~ 极简响应式拖拽阿里图床源码 舔狗日记网站在线版源码 个人工具箱前端模板素材大全
标签聚合
影视CMS wordpress主题 苹果模板 苹果cms 影视源码 Mac 导航 Typecho教程
最近评论
发布于 8 小时前(01月18日) Kaliteli işçilik ve hesaplı fiyatlarımız ile su de...
发布于 10 小时前(01月18日) <a href="http://propeciaff.com/">p...
发布于 10 小时前(01月18日) <a href="http://retinabuy.com/">wh...
发布于 10 小时前(01月18日) <a href="https://propeciaff.com/">...
发布于 10 小时前(01月18日) I'm amazed, I must say. Seldom do I come acro...
书签
  • 战东海
  • 海狸综合导航
  • 海狸网
  • 音乐搜索
小姐姐

COPYRIGHT © 2020 海狸网. ALL RIGHTS RESERVED.

THEME KRATOS MADE BY VTROIS

辽ICP备20001688号