Month December 2021

最近一个朋友的网站遇到一个问题，记录一下解决问题的经过。 他的网站突然无法全屏了，处于一个Boxed的状态，就是elementor配置Page的时候的一个Boxed状态。但由于网站正在使用，安装了40多个插件，不好直接排查。 然后我就搭了一个测试环境，用测试环境去调试。所有就有了这篇迁移VPS和换域名的过程https://ensky.tech/migrate-website-and-change-domain/，实际上不迁移，在他的VPS上搭一个测试环境就可以了，只换个域名就可以。 但是他的网站很脆弱，没做啥就突然这样了，没敢用，还是用我的环境比较放心。 测试环境搭建好以后，首先一步步的禁用插件，然后刷新前端观看效果。直到禁用到Kirki Customizer Framework这个插件的时候，发现可以全屏了，但是颜色都变了，网站之前设计的颜色没有了。因为这个插件是Shoptimizer的一个必备插件。 然后我就想是不是Kirki Customizer Framework被升级了呢？果然如此，与我网站正在用的对比了对比，版本比我的高。然后我就把我的插件打压缩包，覆盖了测试环境下的Kirki Customizer Framework，然后测试环境就正常了。 随之，又把生产环境的替换了一下，他的网站就正常了。 切记：以后不要勾选Auto-Update，插件自动更新可能会更出莫名其妙的问题。

如何从一个VPS迁移到另一个VPS，并且更换域名。 步骤#01：新域名配置DNS服务器，配置一个A记录指向新的VPS的IP地址。 步骤#02：将旧网站的数据打包，使用宝塔的备份功能。 那么备份的文件哪里去了呢？ 备份的文件分为两部分： 1：网站源文件，源代码，HTML，PHP文件一类，这些文件在根目录/www/backup/site里面。 2：备份的数据库文件，位于：根目录/www/backup/database 找到最新的一个备份，然后将这两个文件下载好，上传到新的VPS中。 步骤#03：上传旧网站的备份到新的VPS 可以先在旧的VPS中将网站文件和数据库文件下载到本地，然后上传到新的VPS。但是如果VPS在国外，比如在美国的话，下载速度可能比较快，但上传你就会比较慢。 这个时候，我们就可以使用一个新的指令wget，直接从VPS到VPS的复制。 例如： wget https://ensky.tech/wordpress-3.1-zh_CN.zip 我们只需要将我们要复制的文件放到网站的根目录去，就可以这样复制了。比如我的备份文件是wordpress-3.1-zh_CN.zip，然后我的网站是ensky.tech。那么将wordpress-3.1-zh_CN.zip文件复制到网站的根目录中，就可以直接使用wget https://ensky.tech/wordpress-3.1-zh_CN.zip来复制文件了。 步骤#04：宝塔后台创建新的网站 就像创建新网站一样去创建，域名使用新的域名，数据库可以创建一个新的。 步骤05：将旧网站的HTML等文件放到新网站的文件夹中 将我们之前打包的网站文件（HTML、PHP文件一类），复制到如下目录中，然后解压缩。 需要删除自带的404.html和index.html 解压缩的时候需要保持文件结构和之前的旧网站一致 解压缩后： 解压以后需要保证wp-config.php这个文件处于根目录中。如图所示： 步骤#06：恢复数据库文件 菜单：宝塔后台——数据库——找到自己创建的数据库，然后点击导入，选择本地上传的方式，把旧网站的数据库上传上去。 然后点击导入，导入刚才上传的文件。 步骤#07：网站配置 比如原来网站使用了SSL，那么先把SSL开启。 还有伪静态，如果以前开启了，那么也把伪静态打开。 例如： 步骤#08：更新WP-Config.php文件的数据库名字和密码 在网站根目录中，找到wp-config.php文件，就能看到文件中有如下三行代码，这个需要替换为新的。也就是我们刚开始创建网站的时候的用户名和密码。 define( ‘DB_NAME’, ‘ensky.tech’ ); define( ‘DB_USER’, ‘ensky.tech’ ); define(… Continue Reading →

步骤#01：进入Firebase官网 官网地址： https://firebase.google.com/ 然后点击Create Project 步骤#02：填写一个Project Name 填入一个项目名字，名字随便起 步骤#03：集成Google Analytics 直接默认就可以，会创建一个GA 步骤#04：GA账号创建中 步骤#05：进入首页选择Hosting 步骤#06：Install Firebase CLI 步骤#07：进入本机或者VPS安装firebase CLI 步骤#08：Initialize your project 步骤#09：登录Goolge.com然后授权Firebase 如果使用的是VPS，不需要使用上图给出的指令。如果是本机安装或者VPS是带有桌面系统的，可以使用指令firebase login. 不带GUI的VPS使用指令：firebase login –no-localhost 输入这个指令以后，会弹出一串URL，然后将URL复制到浏览器中，本机浏览器就可以，选择google账户登录，然后授权以后，会得到一串代码。将代码复制到命令行中。就会出现登录成功的提示。 步骤#10：执行Firebase init 输入命令：firebase init hosting –debug what do you wang to use… Continue Reading →

创建一个FAQs页面有好多个方法，介绍几个常用的方法 使用RankMath的FAQ Schema创建FAQs页面 步骤#01：首先安装RankMath插件 插件是这个： 安装完以后，默认配置即可。 步骤#02：安装TOC插件 安装这个Table of Contents Plus插件就可以了 TOC安装以后，选中POST，默认只有Page页面。 菜单：WordPress后台——>Setting——>TOC+ 步骤#03：创建一个POST页面 注意：是Post页面，不是Page页面 在POST页面左侧输入faq，会看到FAQ by rank math，点击这个插件。 添加问题，可以添加Image,Image添加以后是在文本末尾显示的，无法在正文添加image. 创建以后的效果： 这个时候在标题下有一个Contens，随便点击一个问题，就会跳到答案部分。 直接使用Post页面创建FAQs 由于使用rankmath FAQ schema创建问答页面，会有显示，比如想做一个图文结合的页面，那么它就做不到，这个时候可以直接使用POST，就像写文章一样创作问答页面。 每一个答案设置为一个标题，比如设置为2级标题。只要安装了TOC插件，文旦超过TOC的默认数量，就会在顶部显示菜单。 使用Elementor Page创建FAQs页面 还有一个使用Elementor Page页面创建问答的，比如toggle功能。 使用Page创建的，可以看这个视频

对于做B2B的外贸网站，有一个询盘的需求，比如产品图片下面放一个按钮，点击按钮，弹出一个窗口，可以让客户输入联系信息。如何实现呢？ 这个需要使用到Elementor的Popup功能。 安装方法分为两个方式，一个是使用WPForm插件的方式，另一个不适用WPForm的方式。如果不使用WPFrom，请跳过第一个步骤。 步骤#01：安装WPForms插件 （如果不想使用WPFrom，请进入下一个步骤） WPForms是一个很出名的报表提交软件，如果您正好使用了这款软件，那正好可以套用这个模板，就不需要自己创建模板了。 WordPress后台安装插件WPForms 直接搜索WPForms就看到了。 创建一个WPForms模板 菜单：WordPress后台——>WPForms——>Add New 选择一个模板，我这里选择simple contact form，在Name your form这个地方填好名字，或者选择了form以后再改名字也可以，这里我填写的是”contact form 2b2″ 创建好报表以后，点击Save。 步骤#02：Elementor创建模板 菜单：WordPress后台——>点击Templates——>点击Popups 点击Add New，然后选择popup，并且给模板设置一个名字，然后点击“create template” 我们会看到弹出来的是一个选择模板的页面，但是只有Pro才能用，所以我们关闭这个窗口 关闭以后，就是一个普通的页面设计网页了 然后点击Drage widget，点击最大的这个框 使用WPFrom创建模板： （如果在第一个步骤没有安装WPForm插件，请忽略本步骤，进入”使用Elementor内嵌的Form创建模板“的步骤） 然后点击左侧的Elemetor菜单，搜到wpforms，将WPforms拖动到主页面中。 在我们拖动WPForms到page中时，elementor左侧菜单会显示WPForms的配置。在Form这个地方选择之前自己创建的Form。可以勾选Display form name，如果勾选了，就会在Page中显示。 还有一个Title，这个地方填写的也会显示在Page上。 最后点击Publish，Publish Setting中，默认都是灰色，都未勾选，直接Next、Next结束就可以了。 使用Elementor内嵌的Form创建模板 首先在左侧输入Form，会看到一个内嵌的Form。然后可以将其拖动到正文中 我在拖动Form之前，添加了一个header，命名为Contact… Continue Reading →

Transposh是一款免费的WordPress小语种自动翻译插件，插件官网地址：https://wordpress.org/plugins/transposh-translation-filter-for-wordpress/ 这款插件翻译使用的二级目录的方式，不支持二级域名。 步骤#01：安装插件transposh 安装完以后，会在WordPress后台的菜单中显示一个“transposh”的菜单。 步骤#02：基本功能设置 开启”allow upgrading to full version”，允许升级到全功能版本，如果不升级，只允许选择5种语言。勾选这里，然后去WordPress后台，Dashboard这个地方有个Update，点击Update找到这个插件，点击升级。或者直接去安装插件的地方，找到Transposh这个插件，会看到Update的按钮。 如果看不到这个升级，请将网页都关闭，重新登录网站后台，然后重新设置一遍，应该是缓存有影响。 选择谁可以翻译网页，在who can translate这个菜单中选择，选中Administrator（允许管理员具有翻译权限）。 可以允许匿名翻译，不需要任何权限即可，勾选Anonlymous即表示允许匿名翻译。 启用Rewrite URLs的功能。勾选“Rewrite URLs”这个地方。 启用将脚本放到代码末尾的功能，勾选“Push Transposh scripte”这个地方，提速用的，也能有反作用，就是用户看到了未经翻译的文本，如果使用提速插件压缩了JS，延迟启用，就可能会出现这个情况。 启用Detect language based on the ACCEPT_LANGUAGES http header，可以自动失败语言，比如我们在中国打开网页，那么会自动显示中文。 最后点击保存，在末尾有保存按钮。 步骤#03：选择要翻译的语言 WordPress后台—>Transposh菜单—>点击“language”，然后点击你要翻译的语言，比如需要翻译法语，那么就点击法语。 最后点击保存，默认会自动开始翻译。 步骤#04：允许用户设置默认语言 在Widgets Setting这一栏，勾选“Allow user to set current… Continue Reading →