Cómo mover el nuevo botón de encabezado de tema y hacerlo más grande para dispositivos móviles

Billy · 18 Julio, 2025 23:21

¡Hola a todos! Busqué respuestas, pero no encontré ninguna. Me gustaría mover el nuevo botón de encabezado del tema (imagen adjunta, cambié el texto a “Haz tu pregunta”, botón en verde) a la izquierda del enlace de la categoría en el encabezado. Quiero que sea más visible tanto en dispositivos de escritorio como móviles. Además, me gustaría cambiar el tamaño en los dispositivos móviles para que se muestre el botón verde real.

¿Es esto posible? ¡Gracias por cualquier indicación!

NateDhaliwal · 19 Julio, 2025 00:02

Hola, puedes intentar hacer un fork y cambiar este outlet:

github.com/discourse/discourse-new-topic-button-theme-component

javascripts/discourse/initializers/initialize-header-new-topic-button.gjs

ab8b7edee


      
          import { apiInitializer } from "discourse/lib/api";
          import CustomHeaderTopicButton from "../components/custom-header-topic-button";
          
          export default apiInitializer("1.15.0", (api) => {
            api.renderInOutlet("before-header-panel", CustomHeaderTopicButton);
          });

a algo como:

api.renderInOutlet("bread-crumbs-left", CustomHeaderTopicButton);

Por ejemplo, puse el botón encima de la barra lateral aquí:

github.com/NateDhaliwal/discourse-new-topic-button-theme-component

javascripts/discourse/initializers/initialize-header-new-topic-button.js

f605192ee


      
          import { apiInitializer } from "discourse/lib/api";
          import CustomHeaderTopicButton from "../components/custom-header-topic-button";
          
          export default apiInitializer((api) => {
            api.renderInOutlet("before-sidebar-sections", CustomHeaderTopicButton);
            /*
            document.addEventListener("DOMContentLoaded", function() {
              const newTopicBtn = document.getElementById("new-topic-button");
              const sidebar = document.getElementById("d-sidebar");
              if (newTopicBtn && sidebar) {
                sidebar.insertBefore(newTopicBtn, sidebar.firstChild);
              }
            });
            */
          });

También probablemente puedas cambiar el botón usando algo de CSS (crea un nuevo tema y pon el CSS en la pestaña ‘mobile’ o en mobile.scss si estás usando un repositorio).

Billy · 19 Julio, 2025 19:28

¡Muchas gracias! Aprecio tu tiempo y ayuda. Lo intentaré.

Tema		Respuestas	Vistas
Move create topic to the top Feature	4	1110	5 Enero 2019
Mobile new topic button Support	0	49	6 Abril 2025
New Topic button hidden text Dev	1	61	7 Mayo 2025
How to move the New Topic button? Support	0	559	22 Octubre 2020
Floating "New topic" button Support	24	4348	10 Diciembre 2022

Cómo mover el nuevo botón de encabezado de tema y hacerlo más grande para dispositivos móviles

Temas relacionados