侧边栏壁纸

搭建小程序 || 爱搞点前端

2026年01月11日 85阅读 0评论 1点赞

刚建站的时候就说要搭建小程序,因为懒一直没弄。
契机是部署memos。部署完memos想把它弄个小程序端,尝试了之后发现要443端口才能弄到小程序上。但我的443端口指向的是我的这个blog站。好像能改,但我觉得太费劲了,主要是不懂,就算了。灵机一动,正好,把blog部署到小程序上,完成最后一块拼图也未尝不可。
说干就干,还是老一套,浩哥提供的资源哈哈。哼哧哼哧的调插件,总算弄好了。
优化之前
已经对显示的内容上做了一些微调但总感觉不美观,于是想对前端做一些修改。虽然本科的时候学过前端,但说实话全忘了。所以都用Gemini改的,我只会微调一些参数。过程就不赘述了,差别还是很大的,总之改完的效果我还挺满意。
优化之后

喜欢的几个功能:
1、海报生成。有那味!!很喜欢,是自己的小心思哩。
2、搜索的空白页。用CSS硬搓出来的小box和小放大镜。好看!不得不说css搓出来的就是比贴图好看!感恩AI,我自己可手搓不出来!
3、轮播图。比之前的好太多了。

这次踩的几个坑:
1、两个插件要反复调试,同时起作用。而且要填上微信小程序的Appid和密钥。
2、HbuildX上调好了,小程序端不一定。
3、小程序端手机上不显示图片,但在开发者工具和的时候显示,是因为域名白名单的问题!!一定要放行www的域名。或者说要和你api配置的域名保持一致,如果加了www,就一定要把www域名加入白名单。
4、做好备份!!容易改坏!!

还没改的几个bug:
1、网站不定义缩略图的时候,小程序端的封面会显示空白,且生成海报的功能用不了。尝试了和网页端一样的逻辑,比如拉去第一张图作为封面、自定义CSS画一张封面。第一种方法要改后端,不会调,放弃了;第二种方法HbuildX上好使,一编译就出错。。。还差点没改回来。备份!!!
2、小程序拉去的内容格式有点问题。目前发现了三个,已经修改了两个。发现的三个是:每段不会换行、带波浪号的后面段落显示成删除的样式、网页端定义的彩色线等格式小程序端时别不了。前面两个都改了,但是都是用正则化修改弄的,有点指标不治本。发现第三个的时候已经有点麻了,不想改了,先这样!
3、图片后面的空白有点大。不知道啥原因呢。我还是感觉是内容拉取的时候有问题。前端可能解决不掉了,只能改下后端拉取内容的代码了。这涉及到我的盲区了,等后面有兴趣再改吧。

后面还想改进的点:
1、色彩不统一,颜色有点多,有的又有点空了。比如文章页面,有点空空的,后面可以写点小样式、小动画,增加一点美观度。
2、还是文章内容和格式。有的还是有点奇怪,比如网页端文章中用了标题的话,字会很大,比本来的标题还大。这个还是感觉涉及到后端的内容拉取了,后面忍不了了再改好了。

断断续续的改前端改了几天,总体来说其实挺有意思的。

1

—— 评论区 ——

昵称
邮箱
网址
取消
博主栏壁纸
39 文章数
3 标签数
15 评论量