以下のような簡単な方法があります:ボタンに sign-up-button クラスを付与します。
クリックすると登録ポップアップが開きます。a: href はサインアップ を使用する代わりにです。
api.decorateWidget('post: after', helper を使用しました。
ただし、記事の末尾にコードスニペットを挿入するには、NAME:LOCATION が一意である必要があります。
あるいは、NAME:LOCATION を探す場所です。
以下のような簡単な方法があります:ボタンに 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','ようこそ、Thư Viện Mua Sămへ!'),
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’} を使用しましたが、ボタンをクリックするとページが再読み込みされ、すぐに登録フレームが表示されません。
コードを共有いただきありがとうございます ![]()
ログイン/サインアップモーダルを直接表示させたい場合は、組み込みの 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:
現在、新規ユーザーの体験を向上させたいと考えており、具体的なアクションが必要です。
現在はPCでのみ動作します。
ユーザーが「非表示」をクリックした際にクッキーを非表示にするための方法を、関連記事を探して確認しています。
私のミントテーマのどこにこのコードを配置すればよいですか?
新しいテーマコンポーネントを作成し、テーマにアタッチできます。
管理画面 → カスタマイズ に移動します。
「インストール」ボタンをクリックします。
次に、テーマにアタッチして「CSS/HTMLの編集」ボタンをクリックします。
「Head」セクションにコードを追加します。
お役に立てれば幸いです。![]()
ミントテーマでは、このコードをどこに配置すればよいですか?
@Arkshine が提供した手順を試しましたか?
リモートテーマは編集できないため、独自のテーマコンポーネントを作成し、それをミントテーマに追加するのが最善です。
console.error(“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>
コンソールで「API または showLogin 関数が利用できません。」というエラーが出ています。