如何添加文章文末二维码?给文章文末添加二维码的代码是什么?

zhezhongyun 2025-03-19 18:35 71 浏览

导读：在文章文末增加二维码也是网站常见的功能，一般在自己的文章文末添加本站的微信公众号二维码，微信二维码、QQ二维码、QQ群二维码等，那样阅读过本文的网友，如果需要交流的话，可以迅速的可以通过QQ、QQ群、微信、微信群来相互交流。

本文就以站长在线使用的mip建站系统为例，来教大家怎么在自己的网站的文章末尾添加两张二维码。

要想实现文末添加二维码，有两个部分需要添加：一个是css里面添加该代码的css，一个是在网站模板里面添加HTML代码。

一、在当前页面的css文件里面添加css：

.wmewm {width:300px; height: 150px;}
.wxewm {width:150px; height: 150px; float:left;clear:left;}
.gzhewm {width:150px; height: 150px; float:right;clear:right;}

自定义.wmewm就是文末二维码的简写，宽度为300px，高度为150px，当然这个自定义的名称和高度，宽度自己随意。

自定义.wxewm 就是微信二维码的简写，宽度为150px，高度为150px,当然这个自定义的名称和高度，宽度自己随意。

自定义.gzhewm就是公众号二维码的简写，，宽度为150px，高度为150px,当然这个自定义的名称和高度，宽度自己随意。

上面的意思就是，一个大的div里面，有两个并排的小div，大的div高是150，宽是300，而两个小的div的宽和高都是150.

二、在网页模板里面添加html代码：

这个文末二维码，实际上也就是一个广告位而已，添加代码的步骤如下：

2.1、后台--插件--广告管理--添加广告

2.2、添加内容是：

2.2.1、名称：文末二维码

2.2.2、别名：wmewm

2.2.3、代码：


加入官方2000人QQ群一起交流



关注官方微信公众号[站长在线]

2.2.4、复制调用代码{mipjz:ad name='wmewm' /}到文章详情页模板articleDetail.html里面的 {$itemInfo['mipContent']}后面，上一篇下一篇的前面即可。

注：站长在线的diy模板，在模板制作的时候，已经写入了，文末二维码的调用代码了和css代码了，只需要在后台添加这个广告即可。

上面讲的MIP建站系统的代码，如果是传统的dedecms、WordPress、phpcms、帝国等非mip的网站的话，把mip-img的标签改成img标签即可，即：


加入官方2000人QQ群一起交流



关注官方微信公众号[站长在线]

这样添加以后，前台的文末就会显示你添加的两张二维码了，当然如果你这是想添加一张文末图片的话，那就简单得多啦！不需要写css规则，直接在模板文件里面添加一张图片的HTML代码即可：

mip的网站代码是：

普通的如WordPress、dedecms、phpcms就是在模板页面里面添加：

当然，图片还是可以带上链接的，我这里就不带链接了。

正在阅读的你，学会了如何添加网站文章文末二维码了吗？有自己网站的赶快去实践体验一下哦，建站的经验，全部来自于实践，赶快动手吧！欢迎关注站长在线的官方头条号【站长快递】，一起交流学习，共同进步！

标签

上一篇：一文带你理清同源和跨域（跨域同源策略）
下一篇：简单了解CSS3的all属性（css3所有属性）

如何添加文章文末二维码?给文章文末添加二维码的代码是什么?

相关推荐

HTML标签速查手册?别死记硬背了，带你从原理上掌握它!

用node.js实现一个网页爬虫（nodejs爬虫模拟浏览器）

旧手机新玩法，MacroDeck进阶指南

推荐36种免费React模板和主题「干货」

免费领取→可编辑危废标签模板首发!

业余无线电UV段几种常见天线（uv段最强天线）

今年最常见的前端面试题，你会做几道?

GitHub和码云上，7个h5页面制作工具推荐

BarTender10.1条码软件如何制作模板标签

顶级Javaer，常用的 14 个类库