月度归档: 2021 年 9 月

  • swiper修改轮播图箭头的大小和颜色

    swiper修改轮播图箭头的大小和颜色

    遇到的问题

    写响应式页面时需要将swiper的箭头按需要缩小到一定的比例。

    解决

    修改箭头的大小

    划重点:一定要在原css中就写上去,不然单独写到媒体查询里没有用。

    .swiper-button-prev:after, .swiper-button-next:after{
            font-size: 25px!important;
    }

    写到原css样式中,再写到媒体查询对应的地方,即可。

    修改箭头的颜色

    这个不用写到原生css样式中,直接在style中写就可以。

    .swiper-button-next, .swiper-button-prev{
            color: #FFFF00!important;
    }
  • WordPress Advanced Custom Fields(ACF)获取 自定义分类法 自定义字段

    WordPress Advanced Custom Fields(ACF)获取 自定义分类法 自定义字段

    在WordPress的模板主题插件开发中,我们使用Advanced Custom Fields(ACF)插件设置自定义分类法的自定义字段时,在模板或插件中可以使用如下代码来获取值

    get_field('bg_img', $term->taxonomy.'_'.$term->term_id);
  • ul在div中居中显示

    ul在div中居中显示

    ul在div中居中显示,不啰嗦了直接上css代码:

    .nav {
        text-align: center;
    }
    .nav ul {
        display: inline-block;
        height: 15px;
        vertical-align: top;
    }
    .nav ul li {
        display: inline-block;
    }

  • WordPress 分类法 get_terms 函数 自定义字段排序

    WordPress 分类法 get_terms 函数 自定义字段排序

    我们在实际WordPress模板插件开发中,可能需要用到分类法的自定义字段的排序,这里我们使用get_terms函数,自定义字段名:ranking

    不管ranking有没有值,都能出所有的对应分类结果,下面我们记录一下代码段:

    $taxonomy_name = 'products';
    $args = array(
        'taxonomy' => $taxonomy_name,
        'orderby' => 'meta_value_num',
        'order' => 'DESC',
        'hide_empty' => false,
        'hierarchical' => false,
        'parent' => 0,
        'meta_query' => array(
            'relation' => 'OR',
            array(
                'key' => 'ranking',
                'type' => 'NUMERIC',
            ), array(
                'key'           =>  'ranking',
                'compare'      => 'NOT EXISTS',
            )
        ),
    );
    $terms = get_terms($args);

  • vscode 跳转到指定的行数的快捷键

    vscode 跳转到指定的行数的快捷键

    vscode 跳转到指定的行数的快捷键:Ctrl + G

    vscode 搜索:Ctrl + F

    vscode 搜索的css调到指定html:Ctrl + D

    vscode 删除光标所在的一行:Ctrl + X

  • Module 模块化多功能WordPress企业主题

    Module 模块化多功能WordPress企业主题

    Module是一款多功能的wordpress主题,正如其名字一样,我们首次将首页所有内容全部模块化,并可配合我们Themer框架的可视化工具实现模块的自由拖拽组合,构建不同风格的网站。除了模块化的突破,在多语言切换的支持上我们也下了功夫,Module主题可以完美兼容WPML插件实现多语言切换功能,兼容WooCommerce插件实现在线商城功能,支持Ultimate Member插件实现会员注册登录功能。

    购买地址:https://www.jiloc.com/go/wpcom

    主题简介

    1. 响应式设计,兼容手机和平板等移动设备;
    2. 首页幻灯片大图,可设置是否全屏、是否置顶(与头部融合)、高度等;
    3. 自主开发Themer框架,支持后台自定义面板设置;
    4. 可视化页面布局拖拽生成工具(可视化页面拖拽生成工具使用教程);
    5. (新)支持WooCommerce插件,可实现商城功能;
    6. (新)支持Ultimate Member插件,可实现会员注册登录功能;
    7. (新)一键导入演示数据(查看详情);
    8. (新)缩略图片延迟加载(lazyload),提高页面加载速度;
    9. (新)未设置特色图片自动获取文章首张图片作为缩略图(图片需为本地上传的图片);
    10. (新)支持第三方社交登录:QQ登录和微博登录;
    11. 主题颜色风格自定义设置,可以随意设置网站配色风格;
    12. 首页模块选择,目前支持的模块:
      • 全屏模块;
      • 栅格布局;
      • 百度地图;
      • 自定义内容;
      • 客户案例;
      • 文字简介;
      • 特色介绍;
      • 热门产品;
      • 图文混排;
      • 新闻动态;
      • 产品展示;
      • 客户评价;
      • 服务内容;
      • 幻灯滑块;
      • 视频;
      • Slider Revolution(需Slider Revolution插件支持)
    13. (新)强大的SEO优化功能,可自定义标题、描述和关键词,也可支持懒人模式自动获取;
    14. 融入FontAwesome字体图标库,支持多达600+个字体图标;
    15. 自带多种小工具(持续增加中);
    16. 文章页面相关文章/产品展示;
    17. 页面自定义banner设置;
    18. 支持首页页脚友情链接显示;
    19. 支持在线客服/微信二维码/分享/返回顶部悬浮层;
    20. (新)菜单显示位置设置,可以设置靠左还是靠右显示;
    21. 支持自定义CSS样式设置;
    22. 支持谷歌字体链接和头像链接替换,加快网站打开速度;
    23. 产品缩略图自动智能裁剪功能;
    24. 无限页面边栏添加;
    25. 三级下拉菜单支持;
    26. 依赖插件一键安装和更新功能;
    27. 文章评论功能(可选择开启或关闭);
    28. 文章分类模板可选择(产品模板、产品模板(无边栏)、列表模板、默认模板);
    29. 页面模板选择(无边栏、评论模板、自定义页面模板);
    30. 产品列表多种显示风格设置;
    31. 产品详情图片放大器、参数详情功能;
    32. 支持文章段落缩进设置;
    33. 基于Bootstrap前端框架开发;
    34. 文章组件添加功能(基于shortcode开发);
    35. (新)手机端底部固定浮动栏,可添加拨号联系等选项;
    36. 主题兼容IE8+,Chrome,Firefox,Safari,360浏览器等国内主流浏览器,针对Mac OS X优化显示;
    37. 浏览器兼容提示,针对低版本IE浏览器会显示升级提示;
    38. 新版本实时推送,在线一键更新,享受WordPress官方主题库的升级体验;
    39. 针对响应式网站的移动端SEO优化;
    40. HTTPS优化,全面支持HTTPS网站;
    41. 支持子主题扩展;
    42. 支持语言包,内置中英文语言,可以通过编辑语言包支持更多语言,适合外贸网站使用;
    43. 支持WPML多语言切换功能;
    44. 主题使用在线文档;
    45. 一次购买,享受永久更新服务。

    运行环境

    • PHP 5.2+,兼容PHP 7.x
    • MySQL 5.0+

    主题截图

    默认首页:

    主题设置:

  • 如何设置vscode使其自动识别编码格式 

    如何设置vscode使其自动识别编码格式 

    首先打开用户设置,在搜索框中输入encoding,然后勾选Auto Guess Encoding选项即可,如图:

    这样就可以自动识别文件的编码了。当你打开GBK和UTF8编码的带中文的文件时,就不用手动切换编码了。

  • 关闭WordPress新用户注册邮件通知

    关闭WordPress新用户注册邮件通知

    WordPress自带有邮箱重置密码以及新用户注册邮件通知功能,但很多时候我们并不想要这些个鸡肋的功能。这里我们通过WordPress的Hook机制很轻松关闭它们。

    新用户注册邮件通知

    注册时的邮件通知,一共两封邮件:一个是向管理员发邮件通知,一个向用户发邮件通知。随着网站时间的推移,站长对注册用户也没啥太在意的。管理员邮件是没必要的存在故关闭之,如果没加验证遇到机器人垃圾注册,会被这些通知邮件撑爆邮箱,对于个人博客这个功能是安心关闭的。向用户发邮件通知这个功能其实也无所谓,如果自己有花时间专门做了欢迎邮件模板,想要好一点的体验的话,也可以保留。

    通过邮箱重置密码

    站长是个人博客忘记了密码,走邮箱找回密码很鸡肋有木有?同时存在邮箱账号被盗导致整站被黑的安全隐患,作为有权限直接操作数据的个人站长为啥要走一波邮件这种绕弯路的操作?让我们把对外开放会导致整站沦陷,却可有可无的功能直接屏蔽掉吧!

    关闭WordPress邮箱重置密码以及新用户注册邮件通知的代码实现

    //关闭新用户注册通知站长的邮件
    add_filter( 'wp_new_user_notification_email_admin', '__return_false' );
    //关闭新用户注册用户邮件通知
    add_filter( 'wp_new_user_notification_email', '__return_false' );
    //禁止用户密码重置
    apply_filters( 'allow_password_reset', '__return_false' );
    

    代码使用方法

    复制以上代码直接扔进当前WoresPress主题的 function.php 文件中即可。

  • php array_push 与 $arr[]=$value 性能比较

    php array_push 与 $arr[]=$value 性能比较

    array_push方法

    array_push 方法,将一个或多个元素压入数组的末尾。

    int array_push ( array &$array , mixed $var [, mixed $... ] )

    array_push() 将array当成一个栈,并将传入的变量压入array的末尾。array的长度将根据入栈变量的数目增加。 
    与下效果相同:

    <?php
    $arr[] = $value;
    ?>

    比较array_push与 $arr[]=$value性能

    使用array_push压入1000000个元素

    <?php
    $starttime = get_microtime();
    $arr = array();
    for($i=0; $i<1000000; $i++){
        array_push($arr, $i);
    }
    $endtime = get_microtime();
    printf("run time %f ms\r\n", ($endtime-$starttime)*1000);
     
    function get_microtime(){
        list($usec, $sec) = explode(' ', microtime());
        return (float)$usec + (float)$sec;
    }
    ?>

    执行时间:2735.545158 ms

    使用$arr[] = $value压入100000个元素

    <?php
    $starttime = get_microtime();
    $arr = array();
    for($i=0; $i<1000000; $i++){
        $arr[] = $i;
    }
    $endtime = get_microtime();
    printf("run time %f ms\r\n", ($endtime-$starttime)*1000);
     
    function get_microtime(){
        list($usec, $sec) = explode(' ', microtime());
        return (float)$usec + (float)$sec;
    }
    ?>

    执行时间:417.458057 ms

    结果:每次压入一个元素,使用$arr[]=$value比使用array_push方法快7倍。 

    同时压入多个元素比较

    使用array_push方法,压入100000个元素,每次压入50个元素

    <?php
    $starttime = get_microtime();
    $arr = array();
    for($i=0; $i<1000000; $i=$i+50){
        array_push($arr, $i,$i+1,$i+2,$i+3,$i+4,$i+5,$i+6,$i+7,$i+8,$i+9,$i+10,
            $i+11,$i+12,$i+13,$i+14,$i+15,$i+16,$i+17,$i+18,$i+19,
            $i+21,$i+22,$i+23,$i+24,$i+25,$i+26,$i+27,$i+28,$i+29,
            $i+31,$i+32,$i+33,$i+34,$i+35,$i+36,$i+37,$i+38,$i+39,
            $i+41,$i+42,$i+43,$i+44,$i+45,$i+46,$i+47,$i+48,$i+49);
    }
    $endtime = get_microtime();
    printf("run time %f ms\r\n", ($endtime-$starttime)*1000);
     
    function get_microtime(){
        list($usec, $sec) = explode(' ', microtime());
        return (float)$usec + (float)$sec;
    }
    ?>

    执行时间:250.149012 ms

    结果:使用array_push一次压入多个元素,比多次使用$arr[]=$value压入快。array_push一次压入的元素越多,则效率越高。 

    总结:

    如果是压入一个元素,使用$arr[]=$value效率高,因为可以节省调用函数的额外负担。 
    如果同时压入多个元素,使用array_push效率高,因为不用重复获取文件尾的指针。

  • 数据库中的共享锁与排他锁

    数据库中的共享锁与排他锁

    共享锁,又称为读锁,获得共享锁之后,可以查看但无法修改和删除数据。

    排他锁,又称为写锁、独占锁,获得排他锁之后,既能读数据,又能修改数据。

    为什么要加锁

    很多人都知道,锁是用来解决并发问题的,那么什么是并发问题呢?并发情况下,不加锁会有什么问题呢?

    拿生活中的洗手间举例子,每个洗手间都会有一个门,并且是可以上锁的,当我们进入洗手间之后会把门反锁,当我们出来之后再把锁打开。

    当门被锁上之后,其他人只能在门外等待。洗手间之所以要有门锁,就是为了保护隐私的,避免出现多个人同时进入洗手间的情况。

    这和数据库中的锁其实是一样的,为了避免多个事务同时操作数据库导致数据异常,一般会通过锁机制解决。

    在介绍共享锁和排他锁之前,我们先来大个比方,前面已经用了一个洗手间的例子,那么就继续这个例子。一般情况下,我们进入洗手间有可能做一下几件事:洗手、化妆、上厕所等,其实只要上厕所这件事是极度隐私的,而其他事没有那么隐私。

    我们可以认为洗手间就是一个数据库表,而洗手间内部的设施就是数据库表中的数据。我们每个想要进入洗手间的人都是一个事务,简单的洗手、化妆等操作可以认为是读操作,而上厕所操作可以认为是写操作。

    共享锁

    前面简单介绍了数据库与洗手间之间的类比关系,那么接下来继续分析什么是共享锁。

    有些时候,如果我们进入洗手间只是想洗手的话,我们一般不会锁门。而其他人也可以进来洗手、化妆等。但是,其他人是不可以进来上厕所的。

    这就是共享锁,也叫读锁。就是我们对数据进行读取操作的时候,其实是不会改变数据的值的。

    所以我们可以给数据库增加读锁,获得读锁的事务就可以读取数据了。当数据库已经被别人增加了读锁的时候,其他新来的事务也可以读数据,但是不能写。

    也就是说,如果事务T对数据A加上共享锁后,则其他事务只能对A再加共享锁,不能加排他锁。获准共享锁的事务只能读数据,不能修改数据。

    用法

    在查询语句后面增加LOCK IN SHARE MODE,Mysql会对查询结果中的每行都加共享锁。

    SELECT ... LOCK IN SHARE MODE;

    当没有其他线程对查询结果集中的任何一行使用排他锁时,可以成功申请共享锁,否则会被阻塞。其他线程也可以读取使用了共享锁的表,而且这些线程读取的是同一个版本的数据。

    排他锁

    介绍完了共享锁后,在来说说互斥锁。

    如果我们进入洗手间只是想洗手,那么我们可以允许其他人也进来洗手。但是,如果我们进入洗手间是为了上厕所,那么任何人不能再进来做任何事。

    这就是排他锁,也叫写锁。就是我们对数据进行写操作的时候,要先获得写锁,获得写锁的事务既可以写数据也可以读数据。但是,如果数据库已经被别人增加了排他写锁,那么后面的事务是无法在获得该数据库的任何锁的。

    也就是说,如果事务T对数据A加上排他锁后,则其他事务不能再对A加任何类型的封锁。获准排他锁的事务既能读数据,又能修改数据。

    用法

    在查询语句后面增加FOR UPDATE,Mysql会对查询结果中的每行都加排他锁

    SELECT ... FOR UPDATE;

    当没有其他线程对查询结果集中的任何一行使用排他锁时,可以成功申请排他锁,否则会被阻塞。

    加锁原则

    拿MySql的InnoDB引擎来说,对于insert、update、delete等操作。会自动给涉及的数据加排他锁;

    对于一般的select语句,InnoDB不会加任何锁,事务可以通过以下语句给显示加共享锁或排他锁。

    共享锁:SELECT ... LOCK IN SHARE MODE;

    排他锁:SELECT ... FOR UPDATE;

  • Linux 下 显示僵尸进程

    Linux 下 显示僵尸进程

    #!/bin/bash
    processes=$(ps ax -o user,pid,ppid,pgid,args,stat,start,time)
    zombies=$(echo -e "${processes}" | grep -E "\s(Z|z|Z.*)\s")
    if [ $? == 1 ]; then
      echo "no zombie processes exists on machine"
    else
      echo -e "${processes}" | head -1
      echo "$zombies"
    fi

    本脚本来自腾讯云

  • Linux下使用Shell命令查看CPU占用率高的进程脚本

    Linux下使用Shell命令查看CPU占用率高的进程脚本

    Linux下使用Shell命令查看CPU占用率高的进程脚本

    #!/bin/bash
    TOPK={{topk}}
    SECS={{samplingTime}}
    INTERVAL={{interval}}
    STEPS=$(( $SECS / $INTERVAL ))
    TEMP_FILE_PREFIX="/tmp/tat_public_cpu_usage"
    echo Watching CPU usage...
    for((i=0;i<$STEPS;i++))
    do
      ps -eocomm,pcpu | tail -n +2 >> $TEMP_FILE_PREFIX.$$
      sleep $INTERVAL
    done
    echo
    echo CPU eaters :
    cat $TEMP_FILE_PREFIX.$$ | \
    awk '
    { process[$1]+=$2;}
    END{
      for(i in process) {
        printf("%-20s %s\n",i, process[i]) ;
      }
    }' | sort -nrk 2 | head -n $TOPK
    rm $TEMP_FILE_PREFIX.$$
    参数名参数值描述
    topk前k个进程
    samplingTime采样时间, 单位秒
    interval采样间隔时间, 单位秒

    本脚本来自腾讯云

WeChat
↑