Wordpress中Md文章添加图片点击放大效果

在 Wordpress 中写文章我更喜欢使用 Markdown 语法写文章，轻松方便。所以我装了 WP Editor.md 这个插件，它可以让我们在 Wordpress 中用 Markdown 写文章

我在 Typora 中写好文章之后，直接粘贴到 Wordpress 中，就可以直接发布文章了。

在 Markdown 中插入图片的语法为：

![baidu](https://www.baidu.com/img/bd_logo1.png)

直接将其复制到 Wordpress 中，虽然图片可以显示，但是不能点击进行放大。对于一些尺寸比较大的图片来说，图片会被压缩，看起来不清楚。后来我想给图片添加点击放大的功能。

上网查阅，安装了 Responsive Lightbox & Gallery 这个插件，可以添加图片灯箱效果

不过插件默认是英文的，操作起来不是很友好，上网查阅在 https://wpfanyi.com/ 网站找到了该插件的汉化包

以下内容转自 https://wpfanyi.com/plugins/responsive-lightbox

通过 FTP 手动上传该汉化包

点击下载 responsive-lightbox-zh_CN.zip 即最新版的 Responsive Lightbox & Gallery 响应式灯箱画廊 中文语言包，解压后可得到两个文件，

responsive-lightbox-zh_CN.po
responsive-lightbox-zh_CN.mo

请上传到您网站的安装目录，路径为

/wp-content/languages/plugins

这是基于 WordPress 的系统语言路径，注意，要能正常使用，需要看下语言文件是否正确，文件名必须是 responsive-lightbox-zh_CN.mo 才行。

如下，上传后的完整路径。

/wp-content/languages/plugins/responsive-lightbox-zh_CN.mo

操作完毕后，到网站后台的 Responsive Lightbox & Gallery 响应式灯箱画廊 设置页面刷新即可看见变化。

---

安装好插件之后却发现图片还是无法点击放大，后来仔细观察发现，想让图片可以点击放大，你的图片要包含在一个 <a> 标签内，且链接地址是图片源地址才行，如下：

<a  href="https://www.baidu.com/img/bd_logo1.png" >
    <img src="https://www.baidu.com/img/bd_logo1.png" alt="">
</a>

而 Markdown 中的图片语法会自动转成如下内容：

<img src="https://www.baidu.com/img/bd_logo1.png" alt="baidu">

那这样该怎么办呢？我们可以给图片嵌套一个超链接，如下：

[![baidu](https://www.baidu.com/img/bd_logo1.png)](https://www.baidu.com/img/bd_logo1.png)

这样就会自动生成符合要求的 HTML 内容了。我们将图片修改好回到 Wordpress 中，发现图片确实可以点击放大了

而且图片的替代文字 baidu 也在下面下面显示出来了，不过这个横条好像去不掉（也可能是我不会关）有时候还是很影响查看图片的，所以干脆就不加替代文字

[![](https://www.baidu.com/img/bd_logo1.png)](https://www.baidu.com/img/bd_logo1.png)

这样图片就没有下面一个横条了，看起来也舒服多了

至此在 Wordpress 中 Md 文章添加图片点击放大效果也完成了。

不过有时候一篇文章里有很多图片，每个图片都这样写未免太过麻烦，所以我用 python 写了一个自动转换程序，只需要将正常写好的 Markdown 文件命名为 dd.md 放到桌面上，运行程序就会自动读取 dd.md 文件，将图片格式通过正则表达式转化后在桌面上生成一个 (转化后)dd.md 文件，图片的格式就被自动修改好了

python 代码如下，有需要的自取

import re


# 修改规则
def modify(m):
    # 获取图片源地址
    url = m.group(2)  
    head = '[![]'
    
    # 修改后的Markdown语法
    return head + '(' + url + ')' + ']' + '(' + url + ')'  


if __name__ == '__main__':
    # 读取的文件名
    file_name = "dd.md"

    # 桌面路径，需要修改为你的桌面路径
    desktop = r"C:/Users/你的用户名/Desktop/"

    # 桌面路径 + 文件名 = 文件路径
    path = desktop + file_name

    # 以只读，UTF-8编码打开文件
    f = open(path, 'r', encoding='utf-8')

    # 读取文件内容，然后关闭文件
    string = f.read()
    f.close()

    # 正则表达式
    rule = r'!\[(.*?)\]\((.*?)\)'

    # 通过正则表达式 rule 和修改规则 modify 来修改文件内容
    # 返回修改后的文件内容
    file_content = re.sub(rule, modify, string)

    # 创建转化后的文件路径
    path = desktop + "(转化后)" + file_name

    # 以只写，UTF-8编码打开文件，没有文件会自动创建新文件
    f = open(path, 'w', encoding='utf-8')

    # 将修改后的内容写入文件，然后关闭文件，打印 OK!
    f.write(file_content)
    f.close()
    print("OK!")