トピックリストプレビュー (TLP)

@merefield

Topic List Previews (TLP) プラグインをインストールしましたが、検索結果ページにトピックのサムネイルプレビューを表示したいのですが、うまくいきません。トピックのタイルと抜粋のみが表示されます。ただし、サムネイルは /new や /latest などの他のページでは機能します。TLP の設定を変更してみましたが、どれも成功しませんでした。このページで別のプラグイン (discourse-topic-previews-sidecar) について言及していることに気づき、それをインストールしていないことが問題の原因だと疑いました。しかし、そのプラグインをインストールした後も、検索結果ページにはサムネイルが表示されません。

いくつか質問があります。

  1. 検索結果ページにサムネイルプレビューを有効にするには、TLP のみのインストールで十分ですか、それとも TLP と discourse-topic-previews-sidecar の両方が必要ですか?

  2. 検索結果に特別な TLP 設定が必要ですか?私の設定が効果を発揮しないのはなぜですか?

  3. このウェブサイトのように、検索結果ページにサムネイルプレビューを表示したいです。どのように設定すればよいですか?主要な設定手順を詳しく説明していただけますか?

現在の設定のスクリーンショットを添付します。

TLP 設定

[
	{
		"setting": "topic_list_tiles_topic_lists",
		"value": "latest|new|unread|top|tag|activity-topics|activity-portfolio|latest-mobile|new-mobile|unread-mobile|top-mobile|tag-mobile|activity-topics-mobile|activity-portfolio-mobile"
	},
	{
		"setting": "topic_list_tiles_categories",
		"value": ""
	},
	{
		"setting": "topic_list_tiles_tags",
		"value": ""
	},
	{
		"setting": "topic_list_thumbnails_topic_lists",
		"value": "latest|new|unread|top|tag|suggested|agenda|activity-topics|activity-portfolio|latest-mobile|new-mobile|unread-mobile|top-mobile|tag-mobile|suggested-mobile|agenda-mobile|activity-topics-mobile|activity-portfolio-mobile"
	},
	{
		"setting": "topic_list_thumbnails_categories",
		"value": "42"
	},
	{
		"setting": "topic_list_thumbnails_tags",
		"value": ""
	},
	{
		"setting": "topic_list_excerpts_topic_lists",
		"value": "latest|new|unread|top|tag|suggested|agenda|activity-topics|activity-portfolio|latest-mobile|new-mobile|unread-mobile|top-mobile|tag-mobile|agenda-mobile|activity-topics-mobile|activity-portfolio-mobile"
	},
	{
		"setting": "topic_list_excerpts_categories",
		"value": ""
	},
	{
		"setting": "topic_list_excerpts_tags",
		"value": ""
	},
	{
		"setting": "topic_list_actions_topic_lists",
		"value": "latest|new|unread|top|tag|suggested|agenda|activity-topics|activity-portfolio|latest-mobile|new-mobile|unread-mobile|top-mobile|tag-mobile|agenda-mobile|activity-topics-mobile|activity-portfolio-mobile"
	},
	{
		"setting": "topic_list_actions_categories",
		"value": ""
	},
	{
		"setting": "topic_list_actions_tags",
		"value": ""
	},
	{
		"setting": "topic_list_set_category_defaults",
		"value": false
	},
	{
		"setting": "topic_list_dominant_color_background",
		"value": "tiles only"
	},
	{
		"setting": "topic_list_show_like_on_current_users_posts",
		"value": true
	},
	{
		"setting": "topic_list_tiles_larger_featured_tiles",
		"value": true
	},
	{
		"setting": "topic_list_tiles_wide_format",
		"value": false
	},
	{
		"setting": "topic_list_portfolio",
		"value": true
	},
	{
		"setting": "topic_list_portfolio_filter_type",
		"value": "tag"
	},
	{
		"setting": "topic_list_portfolio_filter_parameter",
		"value": ""
	},
	{
		"setting": "topic_list_default_thumbnail",
		"value": ""
	},
	{
		"setting": "topic_list_default_thumbnail_fallback",
		"value": false
	},
	{
		"setting": "topic_list_thumbnail_resolution_level",
		"value": 3
	},
	{
		"setting": "topic_list_thumbnail_width",
		"value": 150
	},
	{
		"setting": "topic_list_thumbnail_height",
		"value": 100
	},
	{
		"setting": "topic_list_thumbnail_width_mobile",
		"value": 50
	},
	{
		"setting": "topic_list_thumbnail_height_mobile",
		"value": 60
	},
	{
		"setting": "topic_list_thumbnail_first_x_rows",
		"value": 0
	},
	{
		"setting": "topic_list_featured_images",
		"value": false
	},
	{
		"setting": "topic_list_featured_images_resolution_level",
		"value": 2
	},
	{
		"setting": "topic_list_featured_images_category",
		"value": false
	},
	{
		"setting": "topic_list_featured_images_from_current_category_only",
		"value": true
	},
	{
		"setting": "topic_list_featured_images_tag",
		"value": ""
	},
	{
		"setting": "topic_list_featured_images_tag_show",
		"value": true
	},
	{
		"setting": "topic_list_featured_images_count",
		"value": 0
	},
	{
		"setting": "topic_list_featured_images_order",
		"value": "latest"
	},
	{
		"setting": "topic_list_featured_width",
		"value": 0
	},
	{
		"setting": "topic_list_featured_height",
		"value": 250
	},
	{
		"setting": "topic_list_featured_height_mobile",
		"value": 150
	},
	{
		"setting": "topic_list_featured_title",
		"value": ""
	},
	{
		"setting": "topic_list_featured_excerpt",
		"value": 100
	},
	{
		"setting": "topic_list_featured_details_always_show",
		"value": "only on hover"
	},
	{
		"setting": "topic_list_test_image_url_timeout",
		"value": 5000
	},
	{
		"setting": "topic_list_fps_search_grid",
		"value": true
	},
	{
		"setting": "topic_list_fps_search_blurb",
		"value": true
	},
	{
		"setting": "topic_list_fps_search_author",
		"value": true
	}
]

こんにちは

問題はTLPに関連していると思いますが、確信がありません。昨日Discourseを最新バージョンにアップデートしたのですが、それ以来、モバイルでは左側ではなく一番上にサムネイルが表示されるようになりました(モバイルのみで、開発者ツールでは再現できませんでした)。

フォーラム:cwowd
(以前の「バグ」とは関係ないかもしれませんが、Glimmerモードが自動または有効に設定されていても違いはありません)

「いいね!」 1

「トピックリスト」設定をクリアすると、不要な機能をオフにできるようになります。たとえば、

サムネイル、抜粋、アクションなどのためのオプションがあります。

再現できません。最新のTLPでは、フォーマットは完璧です。他のすべてのテーマ/テーマコンポーネントを削除して、再試行してください。

他のものがアクティブで競合している可能性が非常に高いです。

または、モバイルサムネイルのサイズが大きすぎる可能性があります。

試してくれてありがとう :wink:

サムネイル画像のサイズ:試してみたところ、左側に…幅12pxで正しく表示されました。この場合、見えないことは言うまでもありません。

私の理解が正しければ、左側に列が「追加」され、最後のメッセージの作成者のアイコンが表示されます(本来はトピックに割り当てられたサムネイルが表示されるべきです)。そして、意図したとおりに左揃えにするスペースがないため、サムネイルはトピックタイトルの上に配置されてしまいます。

「いいね!」 1

このようになります。しかし、Google(私の場合は)はこれだけの幅しか与えてくれませんでした😅

より大きな画像が必要な場合は、モバイルでタイル表示に切り替えてください。

長年、私の大きな満足のために、そのように機能していました :wink:

3.5.0.beta2-devへのアップデートで何かが壊れましたが、何が壊れたのか、なぜこのf** author列が戻ってきたのか(開発者ツールからは何も助けが得られませんでした。モバイル表示をエミュレートしているときはすべて問題ありません)わかりません。

サムネイルがない場合はアバターが表示されるはずです。

最新版では問題は見られませんか?(サムネイルが十分に小さい限り :))

実際、これはテンプレートの置き換えに依存せず、オーバーライド用の新しい公式APIを使用できるようになったため、以前よりも安定すると予想しています。

すべてのモバイルページでTLPを削除する必要がありました。

サイドの問題は、開発者ツールが実際のモバイルページをエミュレートしないことです(たとえば、私の開発者ツールでは「モバイルビュー」でもサムネイルが表示されていますが、TLPはデスクトップページにのみ適用されます)。

理由を要約していただけますか? 私はそこにある不動産で最善を尽くしているのですが?

以前にも述べたように (Topic List Previews (TLP) - #594 by Thierry_Trégaro)、前回のDiscourseアップデート以降、サムネイルがモバイルでタイトルの上に表示されるようになり(左ではなく)、左側に大きすぎる空白ができています。
残念ながら、メンバーピクチャにダウングレードするしかありません。

このビューのタイルを一時的にオフにしました。問題は見当たりません。このサイトは昨日現在で最新の状態です。

Pixel 6a

サムネイルがアバターと似たようなサイズでなければ、すべてが正しく配置されないのは理にかなっています…

…または、タイルビューに切り替えてください。

開発者ツールを使用できました。例として、モバイル最新版で再度有効化を試したところ、以下のようになりました。

サムネイルを10pxに設定すると。

左側の列を表示しない方法が見つかりません…

テーマ3の設定を上書きしていますか?

いずれにしても、あなたのセットアップには何か奇妙な点があります。

同じテンプレートを使用していないようです。

同じ寸法のスターゼンを以下に示します。

ああ!バグかもしれません、申し訳ありません!

「デフォルト画像」を無効にすると問題が発生します。関連しているのでしょうか?

承知いたしました。このアップデートをお試しください。

Topic List Previewsが素晴らしいと思っていただけたら、コーヒーをご馳走してください :coffee:

お待ちいただきありがとうございます!新しいAPIと今後の制限のために完全な書き直しが必要だったため、いくつかの新しいバグが発生しました。

変更が見られません。参考までに、これはライトテーマに追加された他のコンポーネントなしの状態です。

ラップトップビュー

モバイルビュー

あなたの投稿を読んだ後、私もデフォルトの画像(ionicのもの)で試しましたが、実際には何も変わりませんでした(作者の画像が正しく削除されたこと以外)。

左側に表示を揃えることができます(CSSに以下があります)。

.mobile-view .topic-list .right {
    margin-left: 60px !important;
}

見た目は良くなりましたが、まだサムネイルがタイトルの上にあります。

編集:いいえ
これを理解した後、CSSグリッドを少し使って問題を解決しました。完璧ではありませんが、大丈夫です。


ちなみに、リクエストが1つあります。新しいトピック(またはフォーラムが好むもの^^)に抜粋を追加できると嬉しいです。

問題の再現ができません。サムネイルの幅を90pxにしても同様です。

(ただし、これは日付やカウントには広すぎます。)

他に干渉しているコンポーネントがアクティブになっていないか確認していただけますか?

TLPは、非常に狭い場合でも、そのまま動作します。

問題の原因を突き止め、修正しました。デフォルトのサムネイルロジックにエラーがありました。

「いいね!」 2

PreviewsThumbnail のインスタンス化の一部に @url がないようですが、これは意図したものでしょうか?

「いいね!」 1