窈窕淑女,君子好逑
www.sanjunx.com

常用代码样式分享

sanjunx阅读(412)

HTML常用~

文字对齐方式

<p align="right">文字居右</p>
<p align="left">文字居左</p>
<p align="center">文字居中</p>

文字对齐方式

<center>文集居中对齐</center>

文字对齐方式

text-align:center; 文字居中对齐
text-align:left; 文字左对齐
text-align:right; 文字右对齐

文字之间空格

<p>文本内容中的连续空格</P>

代码之间空格

<span>代码之间的连续空格</span>

文字之间空行

<p>文本中输入连续的空行


</P>

元素/标签空行

<span>代码之间的连续空格</span>


<span>代码之间的连续空格</span>

标签常用~

预格式化标签,空格/空行都适用。

<pre>
此处是内容之类的

</pre>

空格实体符号了解一下&nbsp;      可以用来代替空格,值得注意的是必须小写,除此之外还可用<br/>换行标签

WordPresss解决百度分享支持问题

sanjunx阅读(173)

说多了都是泪好多百度的产品都不支持HTTPS,还好百度分享问题已被热心的网友给解决了。

闲话不多说~

首先我们要使用百度分享就要去官网获取分享代码,获取代码后删除其中一部分代码即可删除代码如下。

删除:http://bdimg.share.baidu.com

紧接着我们要自建一个API,从此调用自己的来使用分享。下载后的文件丢进网站根目录,文件具体放哪里自己看着办,只要最后指向文件所在地就可以了。

文件:STATIC

WordPresss开启登录验证码小验证

sanjunx阅读(175)

有的时候你的网站可能会出现恶意注册或恶意评论,说白了就是用机器人来恶搞你的网站恶作剧是也。

闲话不多说~

将下面的代码复制后直接放进主题的FUNCTIONS.PHP文件里

//开启验证码机制
function myplugin_add_login_fields() {
//获取两个随机数, 范围0~9
$num1=rand(0,9);
$num2=rand(0,9);
//最终网页中的具体内容
echo "<p><label for='math' class='small'>验证码</label><br /> $num1 + $num2 = ?<input type='text' name='sum' class='input' value='' size='25' tabindex='4'>"
."<input type='hidden' name='num1' value='$num1'>"
."<input type='hidden' name='num2' value='$num2'></p>";
}
add_action('login_form','myplugin_add_login_fields');
function login_val() {
$sum=$_POST['sum'];//用户提交的计算结果
switch($sum){
//得到正确的计算结果则直接跳出
case $_POST['num1']+$_POST['num2']:break;
//未填写结果时的错误讯息
case null:wp_die('错误: 请输入验证码.');break;
//计算错误时的错误讯息
default:wp_die('错误: 验证码错误,请重试.');
}
}
add_action('login_form_login','login_val');

如果你想给评论区添加验证码的话,就是使用下方的调用验证插入评论区。(COMMENTS.PHP)

调用验证代码是:<p><?php myplugin_add_login_fields();?></p>

WordPress转换网站后台登录地址

sanjunx阅读(333)

网站前端已有用户中心页面,后台页面就没必要暴露出来了。如果你不习惯使用代码的话,建议使用插件更改后台登录地址,直接搜索LOGIN会显示一些插件。

闲话不多说~

将下面的代码复制后直接放进根目录下WP-LOGIN.PHP文件里(第一种方法)

<?php //此处需要去掉
if($_GET["A"]!="B"){ 
header('Location: https://www.sanjunx.com'); //该修改的地方记得修改
} 
?>//此处需要去掉

将下面的代码复制后直接放进主题的FUNCTION.PHP文件里(第二种方法)

add_action('login_enqueue_scripts','login_protection'); 
function login_protection(){ 
if($_GET['A'] != 'B')header('Location: https://www.sanjunx.com/'); 
}

后台唯一地址:https://www.sanjunx.com/wp-login?/A=B

WordPress输入QQ号获取相关信息

sanjunx阅读(17846)

给博客文章评论处添加一键获取信息后,可以减少用户在评论时需要输入信息的步骤。

闲话不多说~

将下面的代码复制后直接放进主题的GET_QQ_INFO.PHP文件里(文件自己创建)

<?php
 header('Content-Type: text/html;charset=utf-8');
 $QQ=$_GET["qq"];
 if($QQ!=''){
 $urlPre='http://r.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?g_tk=1518561325&uins=';
 $data=file_get_contents($urlPre.$QQ);
 $data=iconv("GB2312","UTF-8",$data);
 $pattern = '/portraitCallBack\((.*)\)/is';
 preg_match($pattern,$data,$result);
 $result=$result[1];
 echo $result;
 }else{
 echo "请输入qq号!";
 }
?>

将下面的代码复制后直接放进你想放的地方(脚本调用API)

/** 获取QQ号相关信息 */
function fn_qqinfo(){
    var qq_num=$('#qqinfo').val();
    if(qq_num){
        if( !isNaN(qq_num)){
        $.ajax({
        url:"https://www.sanjunx.com/文件放在什么地方就指向什么地方/get_qq_info.php",  //http或https
        type:"get",
        data:{qq:qq_num},
        dataType:"json",
            success:function(data){
                $("#email").val(qq_num+'@qq.com');
                $('#comment').focus();
                if(data==null){
                $("#author").val('QQ游客'); 
                }else{
                $("#author").val(data[qq_num][6]==""?'QQ游客':data[qq_num][6]);
                } 
            },
            error:function(err){
                $("#author").val('QQ游客');
                $("#email").val(qq_num+'@qq.com');
                $('#comment').focus();
            }
        });
        }else{
            $("#author").val('请输入正确的QQ号码');
            $("#email").val('请输入正确的QQ号码');
        } 
    }else{
         $("#author").val('请输入您的QQ号');
         $("#email").val('请输入您的QQ号');
    }
}

将下面的代码复制后直接放进主题的COMMENTS.PHP文件里(配置显示框架)

<input class="你主题的对应样式" type="text" name="qqinfo" id="qqinfo" maxlength="12" value="" tabindex="5" placeholder="输入QQ号快速填写信息" onblur="fn_qqinfo()" /><span class="你主题的对应样式" >Q Q(选填)</span>

WordPress发布文章后显示新标识

sanjunx阅读(268)

给新发布的文章打上专有标记还是不错的嘛,方便了自己也方便了别人视觉上的冲击杠杠的。

闲话不多说~

将下面的代码复制后直接放进主题的EXCERPT.PHP文件里(主题通用代码)

<?php //如果出现问题,文件里已存在,这里就不要了
date_default_timezone_set('PRC'); //调整默认时区为中国
$t1=$post->post_date;
$t2=date("Y-m-d H:i:s");
$diff=(strtotime($t2)-strtotime($t1))/3600;
if($diff<24){echo "<em>New</em>";} //数字24表示文章发布24小时内的添加标记
else{echo "";} //如果超过设定的时间则显示为空白
?>//如果出现问题,文件里已存在,这里就不要了

上面是文字版代码,下面是图标版代码。(此处效果图省略)

<?php //如果出现问题,文件里已存在,这里就不要了
date_default_timezone_set('PRC'); //调整默认时区为中国
$t1=$post->post_date;
$t2=date("Y-m-d H:i:s");
$diff=(strtotime($t2)-strtotime($t1))/3600;
if($diff<24){echo "<img src='new.gif' />";} // new.gif为你上传的NEW图标地址,图片自己从网上下载就可以了
else{echo "";}
?>//如果出现问题,文件里已存在,这里就不要了

如果你的主题是DUX主题的话,那么就可以利用主题自带的样式。(效果图见当前站)

 date_default_timezone_set('PRC');
           $t1=$post->post_date;
           $t2=date("Y-m-d H:i:s");
           $diff=(strtotime($t2)-strtotime($t1))/3600;
            if($diff<72){
               echo '<span class="new-icon">NEW</span>';
            }

将下面的代码复制后直接放进主题的MAIN.CSS文件里(自行测试别的主题)

/** 修正摘要列表定位方式 */
.excerpt {
    position: relative;
}
/** NEW 图标文字版样式 **/
.excerpt .new-icon{
    position: absolute;
    right: -45px;
    top: -20px;
    display: block;
    width: 120px;
    height: 24px;
    line-height: 24px;
    background: #4caf50;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    transform: rotate(36deg);
    transform-origin: 0% 0%;
}

/** 置顶图标文字版样式 **/
.sticky-icon {
    position: absolute;
    padding: 0;
    right: -45px;
    top: -20px;
    display: block;
    width: 120px;
    height: 24px;
    line-height: 24px;
    background: #ff5e52;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    transform: rotate(36deg);
    transform-origin: 0% 0%;
}
@media (max-width:640px){
    .excerpt-sticky header{text-indent:0px;position: unset;}
    .sticky-icon {
        position: absolute;
        padding: 0;
        right: -45px;
        left: auto;
        top: -20px;
        display: block;
        width: 120px;
        height: 24px;
        line-height: 24px;
        background: #ff5e52;
        color: #fff;
        font-size: 16px;
        font-weight: 500;
        text-align: center;
        transform: rotate(36deg);
        transform-origin: 0% 0%;
    }
}

代码所放位~

EXCERPT.PHP文件就放在下方所示代码下方

echo '<h2><a'._post_target_blank().' href="'.get_permalink().'" title="'.get_the_title().get_the_subtitle(false)._get_delimiter().get_bloginfo('name').'">'.get_the_title().get_the_subtitle().'</a></h2>';

SINGLE.PHP文件就放在下方所示代码下方

<?php the_title(); ?>

INDEX.PHP文件所放位置就不在做说明了哈

WordPress文章隐藏内容评论可见

sanjunx阅读(396)

评论后可见感觉有点小套路的意味,评论越多文章的影响度也就越大,评论后可见样式见文章底部最下方。

闲话不多说~

将下面的代码复制后直接放进主题的FUNCTIONS.PHP文件里(添加评论后方可见功能)

// 文本隐藏内容评论后可见
function reply_to_read($atts, $content=null) {   
        extract(shortcode_atts(array("notice" => '<div style="text-align:center;border:1px dashed #FF9A9A;padding:8px;margin:10px auto;color:#FF6666;>
<span class="reply-to-read">温馨提示: 此处内容需要 <a href="#respond" title="评论本文">评论本文</a> 后 <a href="javascript:window.location.reload();" target="_self">刷新本页</a> 才能查看!</span></div>'), $atts));   
        $email = null;   
        $user_ID = (int) wp_get_current_user()->ID;   
        if ($user_ID > 0) {   
            $email = get_userdata($user_ID)->user_email;   
            //对博主直接显示内容   
            $admin_email = "sanjunx@aliyun.com"; //博主Email   
            if ($email == $admin_email) {   
                return $content;   
            }   
        } else if (isset($_COOKIE['comment_author_email_' . COOKIEHASH])) {   
            $email = str_replace('%40', '@', $_COOKIE['comment_author_email_' . COOKIEHASH]);   
        } else {   
            return $notice;   
        }   
        if (empty($email)) {   
            return $notice;   
        }   
        global $wpdb;   
        $post_id = get_the_ID();   
        $query = "SELECT `comment_ID` FROM {$wpdb->comments} WHERE `comment_post_ID`={$post_id} and `comment_approved`='1' and `comment_author_email`='{$email}' LIMIT 1";   
        if ($wpdb->get_results($query)) {   
            return do_shortcode($content);   
        } else {   
            return $notice;   
        }   
    }   
    add_shortcode('reply', 'reply_to_read');

将下面的代码复制后直接放进主题的FUNCTIONS.PHP文件里(添加评论可见快捷按钮)

//添加评论可见快捷标签按钮
function appthemes_add_reply() {
?>
<script type="text/javascript">
if ( typeof QTags != 'undefined' ) {
QTags.addButton( 'reply', '评论可见', '此处填写调用方法','此后填写调用方法' );
} 
</script>
<?php 
}
add_action('admin_print_footer_scripts', 'appthemes_add_reply' );

调用方法下~

【 reply】评论后可见的内容【 /reply】

【reply notice=”自定义的提示信息”】评论后可见的内容【/reply】

温馨提示: 此处内容需要 评论本文刷新本页 才能查看!

WordPress网站底部显示运行时间

sanjunx阅读(338)

网站底部显示时间是一个不错的想法,给人的感觉怎么说呢有点那啥的感觉在其中,时间显示所呈现的效果见当站底部最下方。

闲话不多说~

将下面的代码复制后直接放进主题的FOOTER.PHP文件里

 <!--以下为计时功能代码-->
            <script language="javascript">
            function tick() {
                var years,days,hours, minutes, seconds;
                var openday = new Date('2o18/02/28 00:00');//这里填写建站时间
                var today = new Date(); //获取系统当前时间
                var total = (today.getTime()-openday.getTime())/1000;
                years=Math.floor(total/31536000);
                total=total-years*31536000;
                days=Math.floor(total/86400);
                total=total-days*86400;
                hours=Math.floor(total/3600);
                total=total-hours*3600;
                minutes=Math.floor(total/60);
                total=total-minutes*60;
                seconds=Math.floor(total);
                timeString = "网站运行:"+years+"年"+days+"天"+hours+"时"+minutes+"分"+seconds+"秒";
                document.getElementById("Clock").innerHTML = timeString;
                window.setTimeout("tick();", 1000);
            }
            window.onload = tick;
            </script>
            <span id="Clock"></span>
            <!--以上为计时功能代码-->