酱茄资讯小程序使用标签

追格资讯小程序（酱茄cms）和主题不兼容修改方法

把主题中的 inc/codestar-framework 文件整体复制到jiangqie-free-mini-program\admin文件下 替换就好了！

【资讯小程序Free】酱茄free小程序怎么在文章中插入音视频

文章编辑器切换成文本模式，点击编辑上面的Video、Audio即可插入以下音视频代码，按照说明操作。

<audio id="myAudio" poster="封面" name="歌名" author="歌手" src="mp3地址" controls loop></audio>

<video src="mp4视频地址" controls></video>

调整轮播图（单图/多图）带间距的方法

追格圈子小程序或追格资讯小程序（uniapp版）中，轮播图有单图展示，也有多图带间距展示两种形式。为了方便用户自由调整，我们将这种调整方式做以下简单介绍。

通过调整以下参数及css，即可变为多图带间距轮播，以追格圈子小程序中的“资讯模块”为例，如下图：

1、打开：/pages/cms/index/index.vue

代码部分在原有轮播标签中增加以下参数，设置轮播间距模式（间距可自由控制）

previous-margin="20rpx" next-margin="20rpx"

<swiper indicator-dots="true" autoplay="autoplay" circular="ture"
					previous-margin="20rpx" next-margin="20rpx"
					indicator-color="rgba(255,255,255, 0.3)" indicator-active-color="rgba(255,255,255, 0.8)"
					interval="5000" duration="150" easing-function="linear">

2、在css部分，增加新样式（用于调整轮播间距，该间距可以自由调整）

.jiangqie-article-swiper view {
		padding: 0 5rpx;
	}

反过来，即可将带间距的改为单图模式，如下图：

previous-margin="20rpx" next-margin="20rpx"

改为：

previous-margin="0rpx" next-margin="0rpx"

图片外容器的左右间距改为0 即可，参考之前例子

padding: 0 5rpx;

改为：

padding: 0 0rpx;

酱茄小程序开源版-常见问题

1、顶部滚动菜单文字颜色怎么修改？

路径/pages/index/index.wxss 搜索：248, 184, 184

2、首页顶部Banner红色背景图怎么修改？

路径/wp-content/plugins/jiangqie-api/public/images/id_bg.png

3、首页顶部搜索框颜色怎么修改？

路径/components/navbar/navbar.wxss 搜索：background: #d5544f;

---

4、首页顶部菜单栏颜色怎么修改？

路径/pages/index/index.wxml 搜索：224, 48, 31, 100

5、首页滚动菜单红色背景怎么修改？

路径/pages/index/index.wxss 搜索：background: #E0301F;

6、分类、热榜、我的顶部演示怎么改？

分类和热榜搜索#E6321D、我的在ucenter.json

---

7、我的顶部和LOGO规格是多少

顶部图：750px* 520px、logo：320px*120px

8、海报为什么生成失败？

未正式上线，海报是无法正常生成，生成的海报仅供演示用，如需修改二维码可到插件目录public/images

8.1、上线后方可生成；
8.2、设置服务器域名；
8.3、海报图片不能使用外链；
8.4、域名配置https；
8.5、云存储可自行研究。

9、海报二维码怎么让不显示在媒体库？

【重点】如果考虑用云存储，请勿注释；

插件路径：/jiangqie-api/public/rest/class-jiangqie-api-post-controller.php 注释以下代码

//同步到媒体库

$this->handle_import_file($qrcode);

---

10、文章ID、分类ID怎么获取？

一键直达教程：https://www.zhuige.com/jc/902.html

11、如何获取文章分类链接？

/pages/list/list?cat_id=分类ID&title=分类名称

12、如何获取Tag链接？

/pages/list/list?tag_id=TagID&title=Tag名称

---

13、如何获取文章链接？

/pages/article/article?post_id=文章ID

14、怎么获取页面链接？

/pages/viewhtml/viewhtml?page_id=页面ID

15、首页分类导航图标规格是多少？

128px*128px

---

16、怎么打开其他第三方小程序（Appid）？

后台 - 插件 - 可输入链接的地方输入Appid即可。

17、小程序不显示内容怎么办

17.1、先看看是否按照配置教程配置；

17.2、设置好wp固定链接（自定义结构如/%category%/%post_id%.html）；

17.3、检查在宝塔面板是否设置WordPress伪静态；

17.4、检查是否配置ssl（https）；

17.5、切换wp主题试试和关闭其他插件试试；

18、插件为什么安装失败？

18.1、本插件不能和同类小程序插件同步启用，建议先关闭其他插件试试；

18.2、还有问题可参考26、27。

---

19、导航菜单、活动区域图怎么连接到其他页

插件设置 - 首页设置 - 导航/活动区域图 按要求填写，链接获取参考问题11、12、13、14；

20、“我的”菜单怎么添加WordPress自建的页面？

插件设置 - 我的设置 - 添加 - 类型选择“自定义页面” - 类型选择自建页面，其他信息按提示编辑。

21、分类和热榜顶部图和标题及描述怎么设置

插件设置 - 进入分类和热榜设置，按提示编辑；

---

22、“我的”菜单怎么添加、修改、删除项目

插件设置 - 我的设置 - 添加 - 选择类型，按提示编辑或删除；

23、怎么在文章中添加音频、视频？

文章编辑器切换成文本模式，点击编辑上面的Video、Audio即可插入以下音视频代码，按照说明操作。

<audio id="myAudio" poster="封面" name="歌名" author="歌手" src="mp3地址" controls loop></audio>

<video src="mp4视频地址" controls></video>

24、底部菜单“分类”里的图片、描述怎么设置？

WordPress后台 - 文章 - 分类目录 - 按提示编辑。

---

25、小程序底部4个菜单的小图标怎么修改？

小程序代码：/client/images

26、启用插件提示/jiangqie-api/includes/categories-images.php 错误

插件文件：jiangqie-api.php找到下行代码删除或注释

plugin_dir_path（__ FILE__）。'includes / categories-images.php';

27、启用插件提示/jiangqie-api/includes/class-jiangqie-api.php on line 15 错误

插件文件：includes/class-jiangqie-api.php 找到下行代码：

public const POSTS_PER_PAGE = 10; 把前面的public删除。

---

28、无效链接怎么解决？

链接获取方式参考问题8、9、10、11，链接前面加 /

29、怎么判断网站有没有禁用 REST API 接口？

访问：你的域名/wp-json/jiangqie/v1/posts 或 你的域名/wp-json/jiangqie/v2

如有数据输出说明API正常，无数据或404等异常情况说明该API可能被禁用。

30、我的怎么自定一个“关于我们”页面？

30.1、wp后台-页面-新建一个“关于我们”；

30.2、酱茄Free小程序-我的设置-类型“自定义页面”-下面类型选择“关于我们”；

30.3、其他字段按需填写即可。

追格资讯小程序（uniapp版）如何在编辑器上添加按钮

在编辑器“文本模式”下添加快速按钮，小编拿引用块按钮示例，效果图如下：

1、文件/wp-content/plugins/小程序插件名称/admin/js/jiangqie-cms-edit-extend.js

2、在文件中插入以下代码：

QTags.addButton( 'jq-netdisk', '追格引用', '\n<blockquote style="margin: 0; padding: 10px 0 10px 5px; background: #f5f5f5; border-left: 3px solid #dbdbdb;">内容</blockquote>\n', '');

3、编辑器“文本模式”添加引用块，然后文本或可视化模式下编辑内容即可：

4、其他按钮的添加方式基本一致，比如水平线的代码：

QTags.addButton( 'jq-netdisk', '追格水平线', '\n<hr style="border: 1rpx solid #f2f2f2;" />\n', '');

追格资讯小程序（uniapp专业版）视频固定高度修改方法

文章详情"视频"如何固定高度，修改方法如下，若无需求请忽略。

小程序前端代码：/components/mp-html/mp-html.vue

video {
	width: 100%;
}

改成：

video {
 width: 100%;
 height: 1160rpx;
}

ps：1160改成自己所需高度即可。

追格资讯小程序（uniapp专业版）页面路径

WordPress怎么查看分类、文章分类、页面、用户、标签的ID，详见：https://www.zhuige.com/bbs/21.html

追格资讯小程序（uniapp版）页面路径

分类：/pages/type/type

指定文章分类：/pages/list/list?cat_id=888&title=分类名称（888为分类id）

指定文章：/pages/view/view?post_id=888（888为文章id）

榜单/排行榜：/pages/ranking/ranking

用户认证：/pages/certification/certification

我的：/pages/mine/mine

关于我们（单页）：/pages/viewhtml/viewhtml?page_id=888（888为单页面id）

搜索页：/pages/search/search

指定关键词搜索：/pages/list/list?title=关键词&search=关键词

标签聚合页：/pages/tags/tags

指定标签：/pages/list/list?title=WordPress&tag_id=888（888为标签id）

积分商城：/pages/store/store

积分商城指定产品：/pages/goods/goods?goods_id=888（888为产品id）

积分记录：/pages/integral/integral?tab=record

积分兑换记录：/pages/record/record

积分任务：/pages/integral/integral

购买记录（文章）：/pages/order_list/order_list

浏览记录：/pages/history/history?track=views

我的点赞：/pages/history/history?track=likes

我的收藏：/pages/history/history?track=favorites

我的评论：/pages/history/history?track=comments

视频号和视频号视频的链接获取和添加教程

1、打开视频号pc网站：https://channels.weixin.qq.com 扫码登录

2、视频号ID和视频号视频ID获取方法

 

---

3、打开视频号（首页）链接格式：finder:视频ID

4、打开视频号（指定视频）链接格式：finder:88888;feedId:99999

重要提示：88888为视频ID、99999为视频号视频链接

 

5、追格小程序-各类详情页打开视频号视频，如下图

ps：本功能仅追格小程序（代码下载）有，其他版本请忽略。

追格资讯小程序（开源版）首页热门推荐界面样式修改教程

追格资讯小程序Free首页的热门推荐，界面样式调整，修改前如下图：

修改后如下图：

1、index.vue中搜索 .jiangqie-hot-scroll-box 修改为：

	.jiangqie-hot-scroll-box {
		width: 440rpx;
		height: 290rpx;
		margin-left: 20rpx;
		display: inline-block;
		position: relative;
		overflow: hidden;
		border-radius: 16rpx;
	}

2、index.vue中搜索.jiangqie-hot-scroll-image 修改为：

	.jiangqie-hot-scroll-image {
		width: 440rpx;
		height: 290rpx;
		border-radius: 16rpx;
		box-shadow: 5rpx 5rpx 20rpx rgba(0, 0, 0, 0.2);
		margin-bottom: 10rpx;
	}

3、index.vue中搜索.jiangqie-hot-scroll-title 修改为：

	.jiangqie-hot-scroll-title {
		font-size: 28rpx;
		color: #333;
		font-weight: 300;
		line-height: 76rpx;
		height: 76rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		word-break: keep-all;
		white-space: nowrap;
		position: absolute;
		z-index: 9;
		width: 100%;
		background: rgba(0,0,0,0.5);
		bottom: 0;
		border-radius: 0 0 16rpx 16rpx;
		color: #FFFFFF;
	}

【教程】追格资讯小程序开源版（酱茄free）文章列表右图变左图

index.vue中修改以下几点即可

 

1、padding-right 改为 padding-left

.jiangqie-news-block { position: relative; padding: 30rpx 0; min-height: 160rpx; border-bottom: 1rpx solid #DDD; padding-right: 260rpx; }

2、float: right 改为 float: left

3、margin-right 改为 margin-left

.jiangqie-news-image { float: right; height: 160rpx; width: 240rpx; margin-right: -260rpx; border-radius: 20rpx; box-shadow: 5rpx 5rpx 20rpx rgba(0, 0, 0, 0.2); }

4、padding-right 改为 padding-left

.image-wide { padding-right: 0;}

【教程】追格资讯小程序开源版（酱茄free）底部菜单颜色修改

底部菜单（tabBar）换色整体都在pages.json文件调整，同时根据自己需求换对应的图片文件即可

1、默认tab颜色 "color": "#bfbfbf",

2、选中tab颜色 "selectedColor": "#e6372f",

3、菜单背景色 "backgroundColor": "#FFFFFF",

默认tab图片地址 "iconPath": "/static/images/tabbar/index_gray.png",

选中tab图片地址 "selectedIconPath": "/static/images/tabbar/index_active.png"

详见下图：

蓝色箭头对应选择文本色

红色箭头对应需要换色的选中图标路径

 

【教程】追格资讯小程序开源版（酱茄free）各位置颜色修改

page.json中根据下列索引找到对应的颜色，替换为自己需要的颜色即可

1、调整全局顶部背景:

搜索 "globalStyle"，globalStyle大括号内的

"navigationBarBackgroundColor": "#E6321D",

2、各页面顶部背景，搜索以下几项：

"backgroundColorTop": "#DA2A1A",

"navigationBarBackgroundColor": "#DA2A1A",

"backgroundColorBottom": "#DA2A1A",

3、article.vue文件：

backgroundColor: '#E6372F'

教程】追格资讯小程序（开源版）列表"浏览量/tag标签/时间"开启与关闭

追格资讯小程序开源版（酱茄free）在首页资讯列表中提供了资讯的3个信息，分别是：发布时间，浏览量，tag

通过简单修改css即可控制3个参数的显示与关闭，不需要修改模板结构，在index.vue文件中搜索：

.jiangqie-news-cmt 对应 浏览量

.jiangqie-news-tag 对应 tag

.jiangqie-news-time 对应 发布时间

1、隐藏模块信息：

在对应的css中增加：display: none;

2、控制模块的显示与否：

不需要修改模板结构，详情见下图对应的结构和css部分

追格资讯小程序开源版（酱茄free）海报红色背景修改教程

找到下面代码，然后按需修改即可：

backgroundColor: '#E6372F',