Nenhum JavaScript adicionado às suas ilhas
Este não é um componente de framework, portanto não precisa de client:load e nunca aparece em suas estatísticas de pacote. A tag de script faz seu trabalho no navegador, após seu HTML.
Você não precisa de um pacote de integração, uma diretiva de cliente ou uma ilha. O botão é HTML simples que navega com sua compilação estática, que é a coisa mais moldada por Astro que um widget de pagamento pode ser.
Coloque a tag de script no cabeçalho de seu layout base, src/layouts/Layout.astro na maioria dos projetos. Cada página que usa o layout pode renderizar botões a partir de então.
---
// src/layouts/Layout.astro
---
<html lang="en">
<head>
<meta charset="utf-8" />
<title>{title}</title>
<script src="https://sdk.coinmoebius.com/latest/sdk.global.js"
crossorigin="anonymous"
defer></script>
</head>Abra seu projeto, mude para a aba Produtos e adicione o produto: uma referência que você escolhe, um nome, um preço, uma moeda. A partir daqui, o painel escreve ambos os blocos nesta página com seu ID de projeto real. O que você vê abaixo é a forma.
Cole o botão no corpo de qualquer página ou componente .astro. Astro o transmite para o HTML construído intacto.
<coin-moebius-buy
project-id="proj_YOUR_ID_HERE"
product-id="t-shirt-medium"
label="Buy a t-shirt">
</coin-moebius-buy>Publicar. O botão renderiza com a página e o seletor de pagamento carrega a primeira vez que um comprador o clica. Cada produto adicional é o mesmo bloco com uma referência e rótulo diferentes.
Este não é um componente de framework, portanto não precisa de client:load e nunca aparece em suas estatísticas de pacote. A tag de script faz seu trabalho no navegador, após seu HTML.
Páginas renderizadas através do layout já têm o script. Para vender de dentro do conteúdo MDX, cole o mesmo botão HTML diretamente no arquivo.
O botão não se importa com a maneira como o HTML foi produzido. Se a página chegar a um navegador, ela vende.
Grátis cobre 150 transações por mês. Sem cartão para se inscrever.