# 主题列表预览（TLP）

**URL:** https://meta.discourse.org/t/topic-list-previews-tlp/209973
**Category:** Theme component
**Created:** [2021年十一月23日 12:25 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973 "2021-11-23T12:25:59Z")
**Posts on this page:** 20
**Page:** 3

<div class="post-metadata">

### Author: ![Decorbuz](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/decorbuz/32/235124_2.png) [@Decorbuz](https://meta.discourse.org/u/Decorbuz)
#### Post date: [2022年一月14日 02:28 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/41 "2022-01-14T02:28:38Z")

</div>

我可以通过 #Customization > Theme component 实现类似 [这个](https://crazyaboutstartups.com/) 的效果吗？

 ![](https://global.discourse-cdn.com/meta/original/3X/8/1/81de7905c7c478846d0b14e5cd59c0e388e6a684.jpeg)

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年一月14日 08:08 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/42 "2022-01-14T08:08:34Z")

</div>

是的，您需要：

- 使用 CSS 修改标准主题列表的最大宽度  
例如：

- 安装类似 [Layouts 插件](https://meta.discourse.org/t/custom-layouts-plugin/55208?u=merefield) 的东西来添加侧边栏（但应该适用于其他侧边栏组件）。

一切都相对简单。

但是我不确定 3 列以上是否容易理解，这是否包括侧边栏？

---

<div class="post-metadata">

### Author: ![Decorbuz](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/decorbuz/32/235124_2.png) [@Decorbuz](https://meta.discourse.org/u/Decorbuz)
#### Post date: [2022年一月14日 17:23 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/43 "2022-01-14T17:23:45Z")

</div>

> [@merefield](#):
>
> 不过我不确定 \>3 列是否易于消化，这包括侧边栏吗？

是的，我可能需要稍微缩小一点…… 🤔

非常感谢！

---

<div class="post-metadata">

### Author: ![4ong](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/4ong/32/186618_2.png) [@4ong](https://meta.discourse.org/u/4ong)
#### Post date: [2022年一月19日 22:17 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/44 "2022-01-19T22:17:17Z")

</div>

你好 @merefield  
如果你知道的话——我该如何禁用主题摘要中的图片？  
这是我遇到的问题的示例 -

 ![image](https://global.discourse-cdn.com/meta/original/3X/7/2/721f5eedcd80c5aa026816b776897fc942d3a1c9.jpeg)

我将鼠标悬停在摘要中的图片上（它显示为空白）。  
我想完全移除它，只在主题下的短形式中保留文本——因为我已经有一个大图作为缩略图了。

这样做有什么更好的方法吗？

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年一月20日 09:18 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/45 "2022-01-20T09:18:57Z")

</div>

摘录的内容归 Discourse 所管。

这种行为有点令人惊讶，因为通常不包含图片？

你能给我链接到论坛帖子吗？我或许可以快速看一下。（欢迎给我发私信）。

作为比较，这个主题有一张图片，但它没有包含在摘录中：[List of Gameloops (WIP) - StarZen: The Unofficial Star Citizen Community](https://starzen.space/t/list-of-gameloops-wip/2541)

---

<div class="post-metadata">

### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [2022年一月20日 10:01 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/46 "2022-01-20T10:01:02Z")

</div>

只是猜测，但这种情况（摘录中包含图片）是否可能源于网店链接？那么 Discourse 就会看到一个也包含图片的内容片段。

---

<div class="post-metadata">

### Author: ![4ong](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/4ong/32/186618_2.png) [@4ong](https://meta.discourse.org/u/4ong)
#### Post date: [2022年一月20日 13:29 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/47 "2022-01-20T13:29:41Z")

</div>

感谢 @merefield 的提议。  
我发现摘录在不用于标题时可以正常工作。  
问题出在“display: grid;”样式上。  
这可能是我其他主题组件中的问题。我会进一步调查。

再次感谢！

---

<div class="post-metadata">

### Author: ![4ong](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/4ong/32/186618_2.png) [@4ong](https://meta.discourse.org/u/4ong)
#### Post date: [2022年一月20日 13:30 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/48 "2022-01-20T13:30:47Z")

</div>

“图像”是一个视觉上损坏的头像 🙂 是我自己的样式问题——我在上一条评论中描述了它是什么。感谢你的猜测！

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年一月20日 13:58 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/49 "2022-01-20T13:58:29Z")

</div>

您似乎安装了主题侧边栏插件。

您能否尝试启用此设置（在插件设置中）：

![image](https://global.discourse-cdn.com/meta/original/3X/3/b/3bac68abd94ae7540bb9d302fe92d8f630925613.png)

我刚才尝试在文本中使用表情符号，如果您使用此设置，确实会进行一次很好的清理。

---

<div class="post-metadata">

### Author: ![4ong](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/4ong/32/186618_2.png) [@4ong](https://meta.discourse.org/u/4ong)
#### Post date: [2022年一月20日 14:06 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/50 "2022-01-20T14:06:51Z")

</div>

不，我没有使用侧边栏插件。  
这是我的通用页面视图。它将很快公开发布。

 ![image](https://global.discourse-cdn.com/meta/original/3X/7/1/71ae5d526a05a04056942585f149c33207bbf100.jpeg)

平铺的摘要在此 CSS 下看起来不错

```plaintext
.tiles-style .topic-details {
 display: block !important;
}

```

## 示例

 ![image](https://global.discourse-cdn.com/meta/original/3X/4/0/40d906d7ee8570795bdf347eec7a91424dd51605.jpeg)

 ![image](https://global.discourse-cdn.com/meta/original/3X/2/2/221c3305f45aed0e2dfb3d6da61a30c44018fc74.jpeg)

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年一月20日 14:13 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/51 "2022-01-20T14:13:30Z")

</div>

看起来不错！背景很棒 👍

请注意，我说的是“sidecar”插件 🙂

---

<div class="post-metadata">

### Author: ![4ong](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/4ong/32/186618_2.png) [@4ong](https://meta.discourse.org/u/4ong)
#### Post date: [2022年一月20日 14:16 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/52 "2022-01-20T14:16:18Z")

</div>

啊，抱歉——我完全忘了“sidecar”插件  
`- git clone https://github.com/merefield/discourse-topic-previews.git -b "theme_sidecar"`

谢谢！也会尝试用它。干杯！

---

<div class="post-metadata">

### Author: ![Allted](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/allted/32/163947_2.png) [@Allted](https://meta.discourse.org/u/Allted)
#### Post date: [2022年一月31日 22:39 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/53 "2022-01-31T22:39:13Z")

</div>

您好，很喜欢这个组件，用标签制作画廊效果很棒！

这次更新似乎取消了从主题中选择缩略图的功能。我不确定我是否描述正确。以前在编辑主主题标题时，可以选择帖子的缩略图，但现在我只有一个勾号和一个“X”。如果您能提供帮助，将不胜感激。如果需要，这是我的论坛链接：[MPCNC Portable/Storable Build - Your Builds - V1 Engineering Forum](https://forum.v1engineering.com/t/mpcnc-portable-storable-build/30577)

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年二月1日 00:00 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/54 "2022-02-01T00:00:46Z")

</div>

您是否安装了 sidecar 插件？这是必需的。组件本身无法实现这一点，因为它需要对 API 进行更改，而这需要一个插件……请参阅 [Pavilion](https://thepavilion.io/t/which-one-to-install-plugin-or-tc/3996?u=merefield)

---

<div class="post-metadata">

### Author: ![Allted](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/allted/32/163947_2.png) [@Allted](https://meta.discourse.org/u/Allted)
#### Post date: [2022年二月1日 00:20 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/55 "2022-02-01T00:20:18Z")

</div>

但我没有看到它，但它以前已经工作了很长时间。

我会尝试的，谢谢你的帮助。

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [2022年二月8日 08:08 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/56 "2022-02-08T08:08:41Z")

</div>

sidecar 插件在启用了 Ember CLI 的最新测试通过中损坏。

`Uncaught Error: Could not find module preload-store imported from discourse/plugins/discourse-topic-list-previews/discourse/initializers/preview-route-edits`

如果我更懂前端的话，我会提交一个 pull request，但我不知道从哪里开始。

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年二月8日 08:11 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/57 "2022-02-08T08:11:03Z")

</div>

谢谢你，理查德，我会尽快查看。

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年二月8日 08:13 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/58 "2022-02-08T08:13:11Z")

</div>

顺便说一句，这有点奇怪，因为 sidecar 插件中不应该有任何 javascript。你能仔细检查一下你是否使用了 sidecar 分支吗？它还没有合并到 master。master 分支包含已弃用的插件和警告。我很快就会处理这个问题，但它部分地留在那儿是为了提醒管理员进行切换。

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [2022年二月8日 08:21 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/59 "2022-02-08T08:21:56Z")

</div>

你说得对，我们的插件部署出现了一个回归错误，导致它第一次无法检出正确的分支。抱歉我没有仔细检查！

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022年二月8日 08:48 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/60 "2022-02-08T08:48:11Z")

</div>

没问题，理查德，这确实有点不寻常。

[上一頁](https://meta.discourse.org/t/topic-list-previews-tlp/209973.md?page=2)

[下一頁](https://meta.discourse.org/t/topic-list-previews-tlp/209973.md?page=4)
