改造好物页面,为WP博客增加闲置物品展示页面

很早以前看到其他博主发过好物的页面,最开始是typecho和hexo,后来终于看到了有大神制作出了WP插件,但是我的初衷是想要一个可以展示闲置物品的页面。

前段时间看钟MM发过一个WP的基于好物改造的设备页面,搜索了几天没搜到,以为她把文章删除了,昨天实在忍不住,就留言问了她,没想到很快回复了,感谢MM。

改造好物页面,为WP博客增加闲置物品展示页面-似水流年

基于MM提供的代码,经过昨天下午和今天上午的改造,我的闲置物品展示页面“焕旧坊”终于出炉了。整个界面符合我的预期,只剩下填充内容了。

现在放出完整代码,原则上WP都通用,可能样式需要根据自己的主题进行微调,已经努力做了手机和平板的自适应。

整个框架内容是:框架分左右两部分,左部分占宽25%,右部分占宽75%。其中左部分分上下2栏,上栏占高80%,用来显示商品图片,下栏占高20%,用来显示当前状态,已停售字体会自动显示红色,在售中字体会自动显示绿色;右部分分上中下3栏,上栏显示商品名称和官网网址,中栏显示具体描述,下栏显示测评网址和交易二维码。

官网网址Official_URL为空的话文字不显示“官网”两字,测评网址Ceping_URL为空的话显示“暂无测评”,交易二维码qr_code为空的话显示“自用不交易”。代码很简单,里面的汉字通俗易懂,添加和删除商品的话就参照里面提供的代码,都是统一的样式。

以我的PIX主题为例,打开主题目录下的page文件夹,新建huanjiufang.php,输入以下代码:

温馨提示: 此处为隐藏内容,需要评论本文后才能查看.
评论后请刷新一次页面,但注意不要清除缓存,否则还需要再次评论!

然后WP后台新建页面,连接随便取,模板选择焕旧坊(名字改成其他也可以,上面代码的前几行记得修改相应名称)。

PC电脑演示:

改造好物页面,为WP博客增加闲置物品展示页面-似水流年

手机模拟演示:

改造好物页面,为WP博客增加闲置物品展示页面-似水流年

平板模拟演示:

改造好物页面,为WP博客增加闲置物品展示页面-似水流年
Comments | 2 条评论
  • 似水流年

    Google Chrome 124 Google Chrome 124 GNU/Linux GNU/Linux 1中国 中国联通 ip address 2408:8220:5f15:22c0:*:*

    2024/10/23更新:当交易二维码为空不填写时,不再显示“去闲鱼交易”,而是显示“自用不交易”。

  • tangtang

    Microsoft Edge 129 Microsoft Edge 129 Windows 10 Windows 10 1中国–河南–漯河 联通 ip address 182.126.*.*

    这个看着不错。

消息盒子
# 您需要首次评论以获取消息 #
# 您需要首次评论以获取消息 #

只显示最新10条未读和已读信息