上海WordPress网站建设、微信小程序开发、H5页面设计制作

置顶文章:这些年来我们已经积累了几十家客户,两百多个由我们独立完成的项目案例。JennyStudio作为一家正规建站公司,团队虽小,能量却很大,我们把每一个项目当作自己的孩子一样培育。长期承接外包项目,若你有WordPress相关的建站需求,微信小程序开发需求、H5页面设计制作需求,请移步JennyStudio上海网站建设

我们尤其专长基于WordPress的各种类型的网站开发,和大部分靠WordPress吃饭的公司不同的是: 查看详细 »

WordPress无插件开发文章Tag的排序功能,为分类、标签等后台管理添加快速编辑功能

之前有介绍过如何自定义WordPress文章列表的快速编辑“Quick Edit”栏(链接:WordPress后台开发,无插件添加列表页快速编辑(Quick Edit)自定义字段),今天我再来介绍一下如何在分类列表中也实现自定义的快速编辑功能。

这次我要开发一套可以给博客的标签做自定义排序的功能,你当然可以用插件Custom Taxonomy Order快速实现这个功能,但是本着深入研究WordPress的目的以及尽可能少用插件的开发原则,让我们尝试自己把他开发出来吧。

Tag其实就是WordPress的一种分类形式,它和文章的分类“Category”没有本质区别,实现了Tag的排序,你只要稍加修改,也可以应用到任何其他的分类形式中去。

实现这个排序功能,主要分以下几步:
1. 为Tag这个分类法新增一个记录排序序号的字段sort_idx,能够在后台保存修改它;
2. 在后台的Tag列表里增加一列sort_idx的显示,并且能让它参与自动排序,方便用户管理;
3. 在后台的Tag列表里增加sort_idx的Quick Editor字段,进一步方便用户管理。
4. 在后台的Post列表里,增加Tag的筛选项,再进一步方便用户管理
1-3体现在界面就是如图这样:
WordPress无插件开发文章Tag的排序功能,为分类、标签等后台管理添加快速编辑功能
查看详细 »

2024年了,如何在浏览器里无广告地查看Flash?

Flash早已是互联网的过去式了,我本人也已经有至少10年没有再接触过需要用Flash的开发项目。但前几天突然有一位客户咨询我如何在现代的浏览器中访问带Flash的页面,确切来说就是要解决在现代浏览器中如何重新启用控件的问题。Flash控件在2020年末的时候已经被各大主流浏览器彻底移除了,于是我的这篇文章(https://blog.brain1981.com/2106.html)中的方法也已过时。

有人曾建议用“Flash中心”,但它是个国产软件,这个你们懂的,不“加料”的免费国产软件现在几乎是不存在的,不想被广告或者其他垃圾东西骚扰就不要轻易尝试。

也有人会用带有Flash插件的浏览器,但那些都是要装一个新的浏览器的,也不是最好的解决办法。 查看详细 »

WordPress简单输出菜单/子菜单的内容列表

在定制网站的时候,高效利用菜单可以节约很多开发时间。比如要输出一系列的相关页面,我们可以新建一个菜单,把这些页面都放到菜单里,然后用“wp_nav_menu”方法输出这些菜单项,比如这样。

1
2
3
wp_nav_menu( array(
	'theme_location' => 'menu-top'
) );

wp_nav_menu是一个已经高度封装的输出函数,你可以通过注入参数自定义各种标签和样式,具体可以查看官方文档(https://developer.wordpress.org/reference/functions/wp_nav_menu/),本文就不赘述了。但有一个问题它没有办法解决,也就是只输出特定的子菜单项,而不是整个菜单的菜单树。

假如我通过wp_nav_menu方法可以输出以下这个菜单,我需要在某些地方只输出圈出的这块子菜单,有什么方法可以做到吗?
WordPress简单输出菜单/子菜单的内容列表
查看详细 »

一行简单的CSS强制开启打印模式下的背景图片、背景颜色渲染

如果你留意过网页的打印模式,也就是在网页窗口按下Ctrl+P开启打印对话框预览网页,你会发现有很多的页面区块在打印模式下是不显示图片和颜色的,比如这样:

上图中,可以看到不仅仅是顶部banner的背景图片没有显示,连按钮的颜色都不显示。这是因为这些元素都是背景着色,无论是背景图片还是背景颜色,打印机会默认忽略这些着色部位以省油墨。用img标签的图片则通常不受影响(也有例外,这个文末再说)。

我们可以这样设置打印,强制开启如图的选项,这样这些着色点就可以正常打印出来了。 查看详细 »

星之海、双截龙外传、塔博尔幽灵…世界上还有哪些游戏公司用WordPress做自己的网站 – 之二

在自己研究WordPress开发技术的同时,我也一直都很关注网络上不断出现的WordPress知名案例,尤其是游戏行业的。因为在国外,这个行业的中小型开发公司非常多,往往结合成本和时间上的要求,他们都会选择用WordPress建立自己的团队官网和产品官网。继上一篇 “除了“愤怒的小鸟”,还有哪些游戏公司和游戏作品用WordPress建了官方网站”后,让我们继续看更多游戏公司的WordPress的网站吧。

Rogue Side,这家工作室的作品很二次元,有美漫、合金弹头、黑帮等各种风格的融汇,很有味道
Rogue Side - WordPress游戏网站
URL:https://www.rogueside.com
查看详细 »

给WooCommerce变量产品添加属于变量的自定义字段

WooCommerce二次开发中,我们经常需要根据业务需要,给产品添加自定义字段,这在我很久以前的一篇博客中详细介绍过。不过那篇文章中我们添加的是产品本身的自定义字段,对于可变产品(Variable Product),如果需要为其每个变量(很多人喜欢称作SKU)各自添加自定义字段,以下这篇文章能教你如何实现。

给WooCommerce变量产品添加属于变量的自定义字段

如上图,这是一个可变产品下的一个变量,我为其添加了一个名为“New Custom Meta”的字段。同时这个字段框会出现在这个产品的所有变量下供店主编辑。WooCommerce默认已经为可变产品提供了价格、尺寸、重量、库存、描述等一系列字段,但它仍然无法满足所有要求,比如我的每个SKU都会有不同的材质、保质期等等,我就需要添加新的字段去描述它们。 查看详细 »

可能是最好用的WordPress/PHP本地环境搭建工具 – DevKinsta

经常用WordPress开发网站的人,在本地搭建开发/测试环境,通常会使用PHPStudy或者WNMP之类的集成工具包;亦或者先搭建本地Linux虚拟机,在虚拟机里安装LNMP或宝塔面板。总之,搭建环境这件事,虽然有以上工具包帮你把Nginx/Apache、PHP、MySQL这些软件快捷集成了,绕开逐个编译安装的麻烦步骤,但对于新手来说仍然会因为各种设置问题,或者漏掉某些关键操作,不断踩坑。

今天我要介绍一款安装步骤极少、没有设置分支、极不容易踩坑的WordPress开发环境架设工具,它是基于Docker的集成Linux环境,帮你一键安装Nginx、MySQL、PHP并自动部署WordPress的软件。如果你是一名不使用WordPress的PHP开发者,你也可以用它快速搭建本地PHP环境,只需要几分钟即可,堪称神器。

神器的名称叫做DevKinsta

经常看我文章的人,知道我一直推崇建跨境网站用Kinsta的服务器。DevKinsta一看就和Kinsta有关,但这一篇不是Kinsta的软文,我会忍住不贴Kinsta的推广链接。

DevKinsta确实是Kinsta家开发的,但他完全是助力WordPress开发者的软件,不管你用不用Kinsta服务器,他都是免费给开发者下载的。下载地址在此:https://kinsta.com/devkinsta/

它提供Windows、Mac和Ubuntu三个版本,我们自然是用Windows版了。
可能是最好用的WordPress/PHP本地环境搭建工具 - DevKinsta
查看详细 »

WordPress自动给图片增加fetchpriority属性的作用和控制方法

在WordPress升级到近期版本6.3以后,官方为了进一步提升WP的SEO表现,即在Largest Contentful Paint (LCP)方面的表现,会自动给一些图片添加一个新属性 – fetchpriority。字面意思可以理解为元素加载的优先级。参考文档点这里(https://www.searchenginejournal.com/wordpress-6-3-will-improve-lcp-seo-performance/491691/)。

我自己的WordPress博客,正文中就发现有一部分图片由原本WP自动给与的懒加载属性(loading=lazy)变成了这个优先加载属性(fetchpriority=high)。

通常这个属性会被添加在多图文的第一张图片中,如果第一张图片是一张小图片,则会顺延至后面的图片。这个过程不需要博客编写者参与,WP会自动完成这项它自认为的优化工作,但对于代码敏感的开发者,就有一点难受了。 查看详细 »

关于网站图片的渐进式加载和懒加载的实现

衡量一个网站SEO做得好不好的一个重要指标,是页面的打开速度,而影响一张网页打开速度的一个很重要的因素,是加载图片的大小。目前网络上流行的两个优化图片的概念,分别是渐进式加载懒加载。一个好的网站,需要同时对图片都做到渐进式加载和懒加载这两种处理。

懒加载,意思是浏览器加载页面的时候先不加载图片,视窗滚动到能显示图片的位置的时候,图片再自动加载。这样可以避免打开页面的同时因为要加载图片,导致的页面打开时间变长的问题。目前主流浏览器已经都可以不用JS实现了,只要给图片加上loading=”lazy”的属性即可。WordPress基本已经替我们自动实现了,只要是通过content或者thumbnail相关的函数调用的图片,WP自动会给它们加上这个属性:

查看详细 »

WordPress安全运维,后台记录用户注册、最后登录的IP地址

WordPress用户必然会碰到的一个问题,是各种注册、评论机器人会扫描你的网站,并试图发布垃圾评论和文章。而对于多用户的网站,我偶尔会碰到一些有发布权限的用户被泄露了账号密码后,账号就被这些机器人利用起来,在网站发布广告、甚至是违禁内容,如果不是第一时间发现并清理,还可能导致网站被搜索引擎甚至监管部门惩罚,后果严重。通常对于比较重要的网站,我会劝说客户把站点放到Kinsta服务器上,以获得较为可靠的安全庇护。你也可以安装Wordfence插件获取一定的保护,但这会牺牲一些服务器资源,导致网站变慢。

除此之外,我推荐的一个比较有效的方式是屏蔽那些会在你网站发布垃圾内容的IP地址,把这些IP地址通过服务器的iptables或者服务商后台的IP黑名单(比如加入阿里云的云盾)来屏蔽。那么问题来了,怎样获取这些IP地址呢?

对于发布垃圾评论的IP地址,这是比较容易的,WordPress后台会记录每条评论发出的IP地址。
查看详细 »