使用webP格式图片提高Drupal 8/9网站的页面加载速度

By 大伟哥 | 2022-05-17,周二, 19:06

为你的网站启用WebP图像,可以为每个页面加载节省数百万字节的数据!这听起来有点夸张,或者说有点俗气。但这是真的。如果网络环境较慢的,这会带来相当不同的结局:页面秒开,访客留下来阅读你的页面;或者经过漫长时间的等待仍然加载不出来,访客只能沮丧地按下浏览器菜单上的叉号。

什么是WebP?

WebP是一种新的图像格式,能够以更小的文件尺寸呈现更高质量的图像。它还支持一些很酷的功能,如透明度(一般用PNG图像处理)和动画(一般用GIF动画或视频处理)。

在Drupal 9中启用响应式图片支持

By 大伟哥 | 2022-05-17,周二, 10:43

最佳的用户体验是网站开发追求的一个重要方面,而其中的关键是保证正确的图像尺寸。大分辨率的图片一股适用桌面显示器,而如果有些访问者使用的是移动设备,那么加载这些非常大的图片反而不是最佳选择。

确保为正确的设备提供正确大小的图像就是所谓的 "响应式图像"。

响应式图像有助于提高加载速度,节省带宽,并给访问者带来更好的整体体验。

这篇文章将重点介绍在Drupal 9中设置响应式图片。

对于Drupal 9,启用响应式图片支持的的关键步骤如下:

Drupal Barrio: popper.min.js no such file error

By 大伟哥 | 2022-05-06,周五, 10:16

安装并启用 Drupal 的 Barrio 主题后,细心的朋友在调试的时候可能会发现,Barrio 导入的一个js文件  popper.min.js 并没有正确加载。

Barrio 主题和子主题里定义的 popper.min.js 路径是 /libraries/popper.js/dist/umd/popper.min.js,但没有附带这个文件,也没有定义下载的路径。实际上popper.min.js已经存在于 Drupal 核心里了,它的路径是 :/core/assets/vendor/popperjs/popper.min.js。

Drupal 9 Barrio 自定义子主题显示异常的表现及解决方法

By 大伟哥 | 2022-05-02,周一, 19:26

Barrio是一个基于Bootstrap 4/5的主题,同时支持Drupal 8和 Drupal 9。这个主题使用标准的 Bootstrap 4/5 标记完全重写了Drupal的twig 模版,使它可以只使用 Bootstrap 的CSS样式,外加少量的自定义CSS样式。对Bootstrap涵盖的部分,Barrio 主要是基于 Flex.

按照模块的文档安装完成主题并创建子主题后,无论如何调试,效果都不能和 Barrio 自带的子主题一样,主要表现在两点: