# 主题列表预览（旧版）

**URL:** https://meta.discourse.org/t/topic-list-previews-legacy/101646
**Category:** Plugin
**Tags:** deprecated
**Created:** [2018年十一月9日 03:56 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646 "2018-11-09T03:56:38Z")
**Posts on this page:** 20
**Page:** 21

<div class="post-metadata">

### Author: ![davidkingham](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/davidkingham/32/119528_2.png) [@davidkingham](https://meta.discourse.org/u/davidkingham)
#### Post date: [2020年十一月8日 14:32 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1354 "2020-11-08T14:32:27Z")

</div>

我上次更新时间是 5 号。奇怪的是，三个网站的结果各不相同。以下是每个网站的设置：

> **第一个网站 - 未在“工作人员”中显示缩略图（预期如此）**
>
> ![image](https://global.discourse-cdn.com/meta/original/3X/4/e/4e490ab3045909b8a95726d22d62ecad05429a3d.png)

> **第二个网站 - 在“工作人员”中显示缩略图**
>
> ![image](https://global.discourse-cdn.com/meta/original/3X/a/8/a835ea9f28884c5e10b439c7dac837dd6ad47631.png)

> **第三个网站 - 在“工作人员”中显示网格**
>
> ![image](https://global.discourse-cdn.com/meta/original/3X/c/8/c8a533b3fc84da1706932c2b4004402ffea3960e.png)

---

<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: [2020年十一月9日 15:42 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1356 "2020-11-09T15:42:51Z")

</div>

David，你能提供一些可靠的复现步骤吗？

---

<div class="post-metadata">

### Author: ![CryptoRux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cryptorux/32/101297_2.png) [@CryptoRux](https://meta.discourse.org/u/CryptoRux)
#### Post date: [2020年十一月11日 21:33 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1357 "2020-11-11T21:33:37Z")

</div>

感谢您使用这个插件，它非常棒。

抱歉，能请您帮我看看如何在首页添加那些“精选”图片吗？

我该如何添加分类，以显示最近 4-5 篇带有图片和标题的文章？目前我有点迷茫 😃

---

<div class="post-metadata">

### Author: ![CryptoRux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cryptorux/32/101297_2.png) [@CryptoRux](https://meta.discourse.org/u/CryptoRux)
#### Post date: [2020年十一月13日 02:09 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1358 "2020-11-13T02:09:33Z")

</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: [2020年十一月13日 07:56 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1359 "2020-11-13T07:56:10Z")

</div>

例如：

 ![image](https://global.discourse-cdn.com/meta/original/3X/e/5/e545167c11b4c4473a3cd7c9bca1eaa918fe153e.jpeg)

最重要的是选择正确的标签，并确保主题已添加标签。

有两点需要注意：

1. 在插件中，此功能仅在桌面端生效（TC 版本也支持在移动设备上显示特色图片）。
2. 在插件中，您无法将图片列表限定为特定分类（在 TC 中可以实现）。

请注意“主题”（Topic）与“帖子”（Post）的区别：主题才是拥有缩略图的实体。

请确保浏览器控制台中没有 JavaScript 错误。如果有相关错误，请在此分享。特色图片功能最近已针对核心部分的破坏性变更进行了修复。

---

<div class="post-metadata">

### Author: ![CryptoRux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cryptorux/32/101297_2.png) [@CryptoRux](https://meta.discourse.org/u/CryptoRux)
#### Post date: [2020年十一月13日 18:24 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1360 "2020-11-13T18:24:43Z")

</div>

谢谢，已激活 🙂

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [2020年十一月16日 19:57 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1361 "2020-11-16T19:57:18Z")

</div>

能否将主题列表预览（精选）部分移至导航部分上方？

---

<div class="post-metadata">

### Author: ![davidkingham](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/davidkingham/32/119528_2.png) [@davidkingham](https://meta.discourse.org/u/davidkingham)
#### Post date: [2020年十一月16日 20:21 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1362 "2020-11-16T20:21:33Z")

</div>

> [@merefield](#):
>
> David，你能提供一些可靠的复现步骤吗？

我找不到复现的方法，这个问题也不紧急，所以我们先不管它了。

另外，我遇到了另一个问题，我之前好像提过，但找不到相关记录。当你访问一个话题然后返回分类页面时，它不会把你带回之前的位置。

https://www.loom.com/embed/bd117029a73748f3adc61d0dd0f6447d

我已经尝试禁用所有其他 TC，更换不同的浏览器，但结果都一样。我想在 [https://try.thepavilion.io/](https://try.thepavilion.io/) 上测试一下，但似乎没有启用 TLP 的分类。

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [2020年十一月21日 22:34 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1363 "2020-11-21T22:34:12Z")

</div>

我在添加 sidecar 插件时遇到了问题。我在 app.yml 中添加了以下行：

`- git clone https://github.com/merefield/discourse-topic-previews.git -b "theme_sidecar"`

当我运行 `launcher rebuild app` 时，出现了错误：

```
FAILED
--------------------
Pups::ExecError: cd /var/www/discourse/plugins && git clone - git clone https://github.com/merefield/discourse-topic-previews.git -b "theme_sidecar" failed with return #<Process::Status: pid 424 exit 129>
Location of failure: /pups/lib/pups/exec_command.rb:112:in `spawn'

```

## 更新

好的，看来这个插件与"Topic List Previews"插件冲突。因此，我移除了 topic list 仓库并重新添加了它。之后 `launcher rebuild` 成功运行。但在安装 theme\_sidecar 后，没有看到点赞按钮的选项？

有什么建议吗？

---

<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: [2020年十一月21日 23:21 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1364 "2020-11-21T23:21:22Z")

</div>

> [@bekircem](#):
>
> 好的，看来这个插件与“主题列表预览”插件冲突了。

二选一即可 🙂 如果您选择使用 TC，侧边栏插件会提供额外功能。您同时使用了该插件和 TC 侧边栏，这是行不通的。

> [@bekircem](#):
>
> 安装 theme\_sidecar 后，没有点赞按钮的选项？

请查看 TC 设置。您需要启用“主题列表操作”。

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [2020年十一月22日 01:18 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1365 "2020-11-22T01:18:05Z")

</div>

感谢您的回答。我已安装了 theme\_sidecar，但它在插件选项卡中显示为“主题列表预览”。

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

我已为标签启用了主题列表操作，但似乎没有任何变化。

另外，我目前仅使用该主题组件来实现精选帖子功能。我能否通过此插件，在显示的精选帖子方框中添加帖子的点赞数量？

---

<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: [2020年十一月22日 07:49 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1366 "2020-11-22T07:49:43Z")

</div>

> [@bekircem](#):
>
> 但它在插件选项卡中显示为“主题列表预览”。

是的，确实如此。插件设置总是出现在“设置”中。其余内容则会显示在 TC 本身的“自定义”中。这种设置是一种混合模式。

你的 TC 上的主题列表操作设置看起来是什么样的？

> [@bekircem](#):
>
> 我能否通过这个插件将主题的点赞数添加到显示为特色帖子的方框中？

不支持该功能。不过这是个很好的增强建议。尽管那里的空间已经非常局促，所以我认为实现起来会略显繁琐。如果你能有效利用现有空间，欢迎提交 PR。

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [2020年十一月22日 14:27 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1367 "2020-11-22T14:27:38Z")

</div>

我正在尝试。🙂

我想我们需要修改这个 hbs 文件？

```
<div class="featured-details">
  {{preview-unbound topic.thumbnails opts=(hash featured=true)}}
  <div class="content">
    <div class="title">
      {{topic.title}}
    </div>
    {{#if featuredExcerpt}}
      <div class="excerpt">
        {{{featuredExcerpt}}}
      </div>
    {{/if}}
    <span class="user">
      
      {{featuredUsername}}
      {{avatar featuredUser imageSize="small"}}
    </span>
  </div>
</div>

```

这些按钮？

```
{{raw 'list/topic-meta' likesHeat=likesHeat title=view.title topic=topic}}
      {{#if showActions}}
        {{raw "list/topic-actions" likeCount=likeCount topicActions=topicActions}}

```

---

<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: [2020年十一月22日 14:30 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1368 "2020-11-22T14:30:49Z")

</div>

您需要对 hbs 和 css 进行修改，可能还需要一些 JavaScript。我建议优先处理 TC（无论如何，TC 都更容易开发）。

请确保搭建好合适的开发环境，使用 fork 并进行整体测试 :)。如果您能产出高质量的结果，我会考虑接受您的 PR。

该功能需要通过设置项来启用，因为如果图片过小，将没有足够的空间显示，因此务必将其设为可选。

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [2020年十一月22日 14:52 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1369 "2020-11-22T14:52:18Z")

</div>

![image](https://global.discourse-cdn.com/meta/original/3X/e/6/e67c0a4421b1835ecca252d48c574140baecf830.jpeg)

好消息！我得到了想要的结果。不过，我无法在设置部分添加一个开关来启用或禁用此功能。我是 JavaScript 新手，正在努力学习。

我做的改动非常简单，只是进行了以下修改。您是否希望我仍然提交一个拉取请求（pull request）？

tlp-featured-topics.hbs

```
<div class="likecount">
  {{number topic.like_count}} {{d-icon 'heart'}}
</div>

```

common.scss

```
.likecount {
          position: absolute;
          bottom: 10px;
          left: 10px;
        }

```

您怎么看？

---

<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: [2020年十一月22日 15:26 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1370 "2020-11-22T15:26:42Z")

</div>

最好在提交 PR 时将此讨论移至线下并转到 GitHub 🙂

---

<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: [2020年十一月22日 21:48 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1371 "2020-11-22T21:48:36Z")

</div>

这在设置中无法实现。

在你的分支中，你可以更改连接器文件夹的位置。请使用插件接口 TC 来选择一个合适的位置。你可能还需要修改 CSS 以实现此功能。

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [2020年十一月22日 21:53 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1372 "2020-11-22T21:53:00Z")

</div>

你好

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

我应该查看这些控制器还是插件出口表达式？

---

<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: [2020年十一月22日 21:57 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1373 "2020-11-22T21:57:57Z")

</div>

我之前的建议不起作用吗？只需创建新文件夹并移动那两个文件即可。您无需触碰任何 JavaScript 代码。

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [2020年十一月22日 22:23 UTC](https://meta.discourse.org/t/topic-list-previews-legacy/101646/1374 "2020-11-22T22:23:51Z")

</div>

实际上，我无法理解你的建议。我是否应该将 hbs 文件移动到其他文件夹以更改它们的 UI 布局？我理解得对吗？

 ![image](https://global.discourse-cdn.com/meta/original/3X/7/4/7486669a89962cc782bae75a29bee3c77c073337.png)

我正尝试将精选帖子框移动到导航列表区域的顶部。

 ![image](https://global.discourse-cdn.com/meta/original/3X/7/8/7890a628f1f484a9c52bc8a1d869dd490e16b832.jpeg)

[上一頁](https://meta.discourse.org/t/topic-list-previews-legacy/101646.md?page=20)

[下一頁](https://meta.discourse.org/t/topic-list-previews-legacy/101646.md?page=22)
