Открыть всплывающее окно входа или вызвать событие при нажатии кнопки

Существует простой способ: кнопка имеет класс sign-up-button

При нажатии открывается всплывающее окно регистрации. Вместо использования a: href является ссылкой на регистрацию


Я использовал api.decorateWidget ('post: after', helper

Но есть NAME:LOCATION, которое уникально для вставки фрагмента кода в конец статьи.

Или место, где можно найти NAME: LOCATION

post:after должен работать, если вы хотите добавить новые элементы в конец поста. Обратите внимание, что у вас есть пробел между post: и after.

Думаю, это связано с тем, что вы пытаетесь сделать.

Если у вас всё ещё есть проблемы, пожалуйста, опубликуйте остальной код, который вы используете.

Спасибо за вашу помощь (особенно для новичков)
Вот весь код

<script type="text/discourse-plugin" version="0.8.25">
    const user = api.getCurrentUser();
    if (!user) {
    api.decorateWidget('post:after', helper => {
	let h = helper.h, attrs = helper.attrs;
	// console.log(attrs);
	return helper.h('div.fixed-bottom-bar.d-none.d-lg-block',
		[
		    helper.h('div.wrapper',
		        [
		        	helper.h('div.logo',
			        	helper.h('img', {
		                    src: 'https://thuvienmuasam.com/uploads/default/original/1X/776142524c0d5c0430a603fde63a8bad2f77b267.svg',
		                    alt: 'ThuVienMuaSam'
		                })
		        	),
		            helper.h('div.content.d-flex.justify-content-between.ml-1',
		            	[

			        		helper.h('div.float-left',
			         		[
			        			helper.h('span.title','Добро пожаловать в Библиотеку покупок!'),
								helper.h('br'),
								helper.h('span.text',
			         			[
			         				helper.h('span','Начните '),
									helper.h('a.text-primary.cursor-pointer.sign-up-button',{ href: '/signup'},
										helper.h('strong','регистрацию аккаунта TVMS')
									),
									helper.h('span',' чтобы получить больше интересных постов от '),
									helper.h('a',{ href: '/u/'+helper.attrs.username },
										helper.h('strong',""+helper.attrs.username),
									),
								])
							]),
							helper.h('div.float-right.d-flex.align-items-center',
								helper.h('button.btn-primary.btn',{type:'button'},
									helper.h('a', { href: '/signup'},
										helper.h('span.d-button-label','Присоединиться')
									),
								)

							),
						]
			        ),
		        ]
		    )
		]
	);
    });
}
</script>

Я использовал helper.h(‘a’, { href: ‘/signup’}, но при нажатии на кнопку страница перезагружается вместо того, чтобы сразу отобразить фрейм регистрации.

Спасибо за ваш код :+1:

Если вы хотите, чтобы модальные окна входа / регистрации отображались сразу, вам следует использовать встроенные действия showLogin и showCreateAccount.

Так что вместо этого

helper.h(
  "button.btn-primary.btn",
  { type: "button" },
  helper.h(
    "a",
    { href: "/signup" },
    helper.h("span.d-button-label", "Присоединиться")
  )
)

для модального окна регистрации лучше использовать что-то вроде этого:

helper.attach("button", {
  label: "sign_up",
  className: "btn-primary btn-small sign-up-button",
  action: "showCreateAccount"
})

или вот так, если вам нужно модальное окно входа:

helper.attach("button", {
  label: "log_in",
  className: "btn-primary btn-small login-button",
  action: "showLogin",
  icon: "user"
})

Также хочу отметить, что добавление баннера — для анонимных пользователей — под каждым сообщением с кнопками регистрации / входа, на мой взгляд, очень неудобно для пользователя, и я не рекомендую так делать. Однако я не знаю деталей вашего конкретного случая. Не рассматривали ли вы возможность разместить баннер / изображение в верхней части вашего сайта вместо того, чтобы добавлять его к каждому сообщению?

Спасибо, что вернулись и решили все вопросы :smile:

Теперь я хочу улучшить работу с новыми пользователями, поэтому мне нужно действовать.
В настоящее время это работает только на ПК.
Я изучаю статьи о куки-файлах, чтобы иметь возможность скрывать уведомление или скрывать его, когда пользователи нажимают «Скрыть».

где разместить этот код в моей теме mint?

Вы можете создать новый компонент темы и подключить его к вашей теме.

  • Перейдите в Администрирование → Настроить

  • Нажмите кнопку Установить

  • Затем подключите его к вашей теме и нажмите кнопку Изменить CSS/HTML

  • Добавьте код в секцию Head:

Надеемся, это поможет. :+1:

В теме Mint, куда поместить этот код?

Вы пробовали шаги, которые предоставил @Arkshine?
Поскольку вы не можете редактировать удалённые темы, лучше всего создать свой собственный компонент темы и добавить его в тему Mint.

Я получаю ошибку в консоли: “API или функция showLogin недоступны.”

Я выполнил шаги, но при переходе на страницу входа модальное окно не открывается автоматически.

<script type="text/discourse-plugin" version="0.8.25">
    // Функция для проверки, является ли текущая страница страницей входа
    function isLoginPage() {
        return window.location.pathname === "/login";
    }

    // Запуск действия входа при загрузке страницы
    document.addEventListener("DOMContentLoaded", function() {
        console.log("Событие DOMContentLoaded сработало.");
        
        // Проверка, является ли текущая страница страницей входа
        if (isLoginPage()) {
            console.log("Текущая страница — это страница входа.");
            
            // Запуск действия входа
            if (typeof api !== "undefined" && typeof api.showLogin === "function") {
                console.log("API и функция showLogin доступны.");
                api.showLogin();
            } else {
                console.error("API или функция showLogin недоступны.");
            }
        } else {
            console.log("Текущая страница не является страницей входа.");
        }
        
        // Получение элемента кнопки входа
        const loginButton = document.getElementById("loginButton");

        // Имитация клика по кнопке входа для открытия модального окна
        if (loginButton) {
            loginButton.click();
        }
    });
</script>

В консоли появляется ошибка: console.error(“API или функция showLogin недоступны.”).