『原创』『代码』Joe主题前台登录链接按钮

前言

自从Joe主题升级5.0以后，就没了登录按钮和链接，每次想登录或者进后台都要输入网址

对于我这种经常前后台切换的人来说，炒鸡炒鸡不方便 :@(抠鼻) :@(抠鼻)

然后给群主说了几次，群主都没加，还让我自己写 :@(中指)

那我只好自己写了，谁叫我用的人家的主题呢 :@(喷血)

成果展示

可以实现登录显示登录用户名，点击用户名可以直接进入后台，前后台切换方便多了 :@(鼓掌)

{tabs}
{tabs-pane label="PC端效果"}

{/tabs-pane}
{tabs-pane label="PE端效果"}

{/tabs-pane}
{/tabs}

教程分享

{tabs}
{tabs-pane label="PC端教程"}
{callout color="#ab74e4"}
经过群友的不懈努力， 懒猪 作者终于添加了PC端登录 :@(欢呼)
功能比我这个强大，各位根据自己的实际需求选择吧
{/callout}

下载以下代码，加入到 /Joe/public/header.php 188行-189行之间
{hide}

            <style>
            .joe_header__below-logon{margin-right:15px;margin-left: auto;color:var(--minor)}.joe_header__below-logon .item{color:var(--minor);height:45px;line-height:45px;transition:color 0.35s;white-space:nowrap}.joe_header__below-logon .item:hover{color:var(--theme)}
            </style>
            <nav class="joe_header__below-logon">
                <svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" style="width: 20px; height: 20px; margin-right: 8px;">
                <path d="m308.015694,158.686726c0,0 13.766173,-66.244882 0,-88.685099c-13.782387,-22.440218 -19.279128,-37.387781 -49.584165,-48.088877s-19.262913,-8.568426 -41.298518,-7.473782c-22.035605,1.075772 -40.406717,14.947563 -40.406717,22.421345c0,0 -13.766173,1.075772 -19.262913,7.492655c-5.512955,6.416883 -14.690403,36.312009 -14.690403,43.804664s4.588724,57.714202 9.177449,68.396425l-5.464311,2.13267c-4.588724,61.960669 18.354897,69.453323 18.354897,69.453323c8.253218,57.714202 16.52265,33.141314 16.52265,48.088877s-8.269432,9.625325 -8.269432,9.625325s-7.328987,23.497116 -25.683884,32.046669c-18.354897,8.53068 -120.247276,54.468014 -128.532923,64.093339c-8.285647,9.644198 -7.345202,54.50576 -7.345202,54.50576l436.934108,0c0,0 0.95666,-44.861562 -7.328987,-54.50576c-8.301862,-9.644198 -110.19424,-55.562659 -128.549138,-64.093339c-18.354897,-8.549553 -25.683884,-32.046669 -25.683884,-32.046669s-8.269432,5.322238 -8.269432,-9.625325s8.269432,9.625325 16.538865,-48.088877c0,0 22.927407,-7.492655 18.354897,-69.453323l-5.512955,0z" fill="var(--minor)"/>
                </svg>
                <?php if($this->user->hasLogin()):?>
                <a class="item" target="_blank" href="<?php $this->options->adminUrl(); ?>"><?php $this->user->screenName(); ?></a><span>丨</span>
                <a class="item" href="<?php $this->options->logoutUrl(); ?>">退出</a>
                <?php else : ?>
                <a class="item" style="color:var(--minor);" href=<?php $this->options->adminUrl('login.php'); ?> title="登录">登录</a><span>丨</span>
                <a class="item" style="color:var(--minor);" href=<?php $this->options->adminUrl('register.php'); ?> title="注册">注册</a>
                <?php endif;?>
            </nav>

{/hide}

这里加了点css，为了美观又设置了hover属性，当然你也可以把这段css放到 /Joe/assets/css/joe.global.min.css 里面

我又为了减少更新时加代码的工作，写到了header.php里了

{/tabs-pane}
{tabs-pane label="PE端教程"}
{callout color="#ab74e4"}
期望 懒猪 群主早日添加PE端登录
{/callout}

下载以下代码加入到/Joe/public/header.php 409行-410行之间（倒数第五行 算空的那行 ）
{hide}

<ul class="joe_header__slideout-menu panel-box" style="margin-top:15px; color:var(--minor);">
            <svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" style="width: 20px; height: 20px; margin-right: 8px;">
            <path d="m308.015694,158.686726c0,0 13.766173,-66.244882 0,-88.685099c-13.782387,-22.440218 -19.279128,-37.387781 -49.584165,-48.088877s-19.262913,-8.568426 -41.298518,-7.473782c-22.035605,1.075772 -40.406717,14.947563 -40.406717,22.421345c0,0 -13.766173,1.075772 -19.262913,7.492655c-5.512955,6.416883 -14.690403,36.312009 -14.690403,43.804664s4.588724,57.714202 9.177449,68.396425l-5.464311,2.13267c-4.588724,61.960669 18.354897,69.453323 18.354897,69.453323c8.253218,57.714202 16.52265,33.141314 16.52265,48.088877s-8.269432,9.625325 -8.269432,9.625325s-7.328987,23.497116 -25.683884,32.046669c-18.354897,8.53068 -120.247276,54.468014 -128.532923,64.093339c-8.285647,9.644198 -7.345202,54.50576 -7.345202,54.50576l436.934108,0c0,0 0.95666,-44.861562 -7.328987,-54.50576c-8.301862,-9.644198 -110.19424,-55.562659 -128.549138,-64.093339c-18.354897,-8.549553 -25.683884,-32.046669 -25.683884,-32.046669s-8.269432,5.322238 -8.269432,-9.625325s8.269432,9.625325 16.538865,-48.088877c0,0 22.927407,-7.492655 18.354897,-69.453323l-5.512955,0z" fill="var(--minor)"/>
            </svg>
            <?php if($this->user->hasLogin()):?>
            <a class="item" style="color:var(--theme);" href="<?php $this->options->adminUrl(); ?>"><?php $this->user->screenName(); ?></a><span>丨</span>
            <a class="item" style="color:var(--minor);" href="<?php $this->options->logoutUrl(); ?>">退出</a>
            <?php else : ?>
            <a class="item" style="color:var(--minor);" href=<?php $this->options->adminUrl('login.php'); ?> title="登录">登录</a><span>丨</span>
            <a class="item" style="color:var(--minor);" href=<?php $this->options->adminUrl('register.php'); ?> title="注册">注册</a>
            <?php endif;?>
        </ul>

{/hide}

{/tabs-pane}
{/tabs}

保存好后刷新以下你的网站，就可以点击登录进入后台登录了 :@(欢呼)
　
{dotted startColor="#a261e4" endColor="#1989fa"/}