I want to have a carousel slider on top of my site homepage and category pages, some featured topics and images can be selected and designated through setting panel. Previously I wanted to have the following effect on both desktop and mobile devices :point_down: [carousel-cover-1200x900] This one gives a hint but the work is still in progress https://github.com/discourse/discourse-big-carousel-component So I took advice from @Moin to try Featured Tiles component. However there’s no carousel effect and not friendly to mobiles. I did some work to achieve this :point_down: Desktop Mobile However there are two issues on mobile end, When I go to homepage from topic page, the carousel effect fails, unless I click home button again, seems that javascript not loaded Uncaught TypeError occurs [image] Javascript I’m using :point_down: window.onload = function() { let slideshowInterval; function initSlideshow() { const container = document.querySelector(".featured-tiles-container"); const tiles = document.querySelectorAll(".featured-tile"); const slideWidth = tiles[0].offsetWidth; let currentIndex = 0; let canSlide = true; function slideLeft() { if (canSlide) { canSlide = false; currentIndex = (currentIndex + 1) % tiles.length; const offset = -currentIndex * slideWidth; container.style.transition = "transform 0.5s ease-in-out"; container.style.transform = `translateX(${offset}px)`; setTimeout(() => { canSlide = true; container.style.transition = "none"; }, 500); } } function startSlideshow() { slideLeft(); slideshowInterval = setInterval(slideLeft, 3000); } startSlideshow(); } function destroySlideshow() { clearInterval(slideshowInterval); } api.onPageChange((url) => { destroySlideshow(); if (url === "/" || url.indexOf("/c/") === 0) { initSlideshow(); } }); } @Arkshine @Lilly Any solutions or ideas?

Hello! :raising_hand_man: Thanks for the tip :raised_hands:, I’ll try to try your CSS version, I hope it helps :slightly_smiling_face:

Hello again :wave: I played around with CSS and liked the ability to control the background of the image in the carousel :ok_hand: . I was also hoping that CSS would solve my original problem. In the normal state, the images in the carousel change without problems, but as soon as I click on one of the latest, new or active buttons, when changing images and content in the carousel, their integrity is violated - the beginning appears at the end, and the end appears at first. Apparently this is a system error :pensive:

Thanks for the feedback; I will give it a try later. :+1:

Hi, I install your component successfully, but can’t show my images. I upload images into discourse shared folder and google drive. No results and only spinner loading [image]

You need at least two items in the settings, is that the case?

Hi,about this component,may I ask what’s the size of image I should upload?

Hey guys Regarding this TC here: GitHub - discourse/discourse-big-carousel-component: Work in progress · GitHub I see that it’s being worked on, but could not find anything about it on Meta? When I try to install it on “3.5.0.beta8-dev”, the TC is not being displayed (tested via tc preview)

It’s still a WIP by the looks of it. Did you modify the plugin_outlet setting?

Edit: never mind, just realized it only is displayed in the categories route…

[imagem] Arkshine: GitHub - Arkshine/discourse-big-carousel-component: Work in progress · GitHub How should I set it up if I want users to see the carousel as soon as they enter the homepage? Because your video seems to require clicking on the category to display the carousel, but I hope that users can see it as soon as they enter the homepage, rather than having to manually click on the category to see it, because some people may not be interested in the category.

Sliders de carrossel com componente de Tiles em destaque em celulares?

Dev

Elena (Elena) Outubro 13, 2024, 10:08am 24

Olá, sobre este componente, posso perguntar qual o tamanho da imagem que devo carregar?

What is the size of the uploaded image?

Tópico		Respostas	Visualizações
Featured Tiles Theme component official , featured-tiles	45	14308	22 de Janeiro de 2026
Homepage Feature Theme component official , homepage-feature	136	27374	9 de Julho de 2026
Topic List Previews (TLP) Theme component	749	44374	31 de Agosto de 2026
Featured Topics Theme component	72	8655	29 de Outubro de 2026
Topic List Thumbnails Theme component official , topic-list-thumbnails	160	38280	13 de Agosto de 2026

Sliders de carrossel com componente de Tiles em destaque em celulares?

Tópicos relacionados