---
title: Listmonk
description: Conecte o Listmonk auto-hospedado para campanhas de e-mail para participantes
order: 4
source_hash: ceca5cb6f21f
---

# Listmonk

[Listmonk](https://listmonk.app/) é um gerenciador de newsletters e listas de e-mails auto-hospedado que os organizadores podem usar internamente para enviar e-mails informativos aos participantes.

O Listmonk pode ser instalado no seu próprio servidor ou configurado rápida e facilmente na nuvem.

Aqui estão algumas nuvens onde você pode configurar rapidamente o sistema Listmonk:

<center>
  
| Serviços de Nuvem |
| :-: |
| [![One-click deploy on Railway](https://camo.githubusercontent.com/d07713342bc583232f8752c33a6a24e5f367d73725183a63f2f5fdd7c00606a3/68747470733a2f2f7261696c7761792e6170702f627574746f6e2e737667)](https://railway.app/new/template/listmonk) |
| [![Deploy on Elestio](https://github.com/elestio-examples/wordpress/raw/main/deploy-on-elestio.png)](https://dash.elest.io/deploy?soft=Listmonk&amp;id=237) |
| [![Deploy on PikaPod](https://www.pikapods.com/static/run-button.svg)](https://www.pikapods.com/pods?run=listmonk) |

</center>

O painel do Listmonk se parece com isto:

[![splash.png](https://listmonk.app/static/images/splash.png)](https://listmonk.app/static/images/splash.png)

Para conectar o Listmonk, vá para Configurações do Clube -> "Integrações".

As configurações do clube podem ser encontradas no canto inferior esquerdo.

![](/static/img/integrations/listmonk/image-1715233033231-34-49.png)

Em integrações, encontre o Listmonk e clique em "Conectar".

![](/static/img/integrations/listmonk/image-1715233117621-37-25.png)

Para conectar o Listmonk, os seguintes campos devem ser preenchidos:

![](/static/img/integrations/listmonk/image-1715233169267-38-53.png)

Após preencher os campos e pressionar "Salvar", o sistema tentará conectar-se ao Listmonk e verificar se a conexão está funcionando.

Uma vez estabelecida a conexão, você pode escolher um design de e-mail e realizar as seguintes ações:

1. Escolher o design de e-mail que é enviado quando uma adesão é paga com sucesso.
2. Realizar a sincronização de eventos.
3. Sincronizar e-mails dos membros.
4. Enviar um "E-mail de compra" de teste.

#### Sincronização de eventos (competições ou desafios)

Cada evento do organizador cria uma nova lista de e-mails no Listmonk, permitindo que os participantes sejam vinculados a uma lista de e-mails específica para que o organizador possa enviar e-mails apenas para os participantes daquele evento específico.

Ao pressionar o botão "Inicializar Sincronização Completa de Eventos", todos os eventos são criados no Listmonk.

Todos os eventos serão salvos no seguinte formato: "Ano - Nome da Competição".

Ao adicionar um novo participante ao Listmonk, o sistema verifica se o evento específico foi criado; se não, ele é criado.

#### Sincronização de participantes

Cada vez que uma compra é feita (pagamento de adesão), uma solicitação é enviada ao Listmonk e os e-mails dos participantes são adicionados. Tanto o "e-mail de cobrança", que o comprador deve preencher, quanto todos os e-mails anexados aos participantes são adicionados.

Cada participante é adicionado à lista de competição específica e os seguintes atributos são anexados:

![](/static/img/integrations/listmonk/image-1715234635829-03-44.png)

* Eventos - contém uma lista de todos os eventos nos quais o participante participou.
* Marketing - contém informações sobre as preferências de "marketing" marcadas durante a etapa de compra.

Essas informações podem ser usadas para filtrar participantes e adicioná-los a novas listas de e-mails.

Por exemplo, para encontrar todos os participantes que indicaram que desejam receber notícias, a seguinte consulta pode ser usada: `(subscribers.attribs->'marketing'->>'News')::BOOLEAN = true`.

![](/static/img/integrations/listmonk/image-1715234734703-05-26.png)

Executar essa consulta selecionará todos os participantes que indicaram que desejam receber notícias.

#### Sincronização inicial de participantes

Para realizar a sincronização inicial de participantes, você deve pressionar o botão "Inicializar Sincronização Completa de Dados com Listmonk". Observe que isso pode demorar mais se o número de participantes for grande.

#### E-mail de confirmação de compra

O DistantRace envia um e-mail automático do sistema quando um participante paga pela inscrição, mas os organizadores podem criar seu próprio design de e-mail.

É importante incluir o seguinte no e-mail:

* O que está sendo pago e os valores
* O valor total pago
* Um link para a confirmação da compra

Como criar um e-mail e conectá-lo ao DistantRace?

1. Crie um e-mail de confirmação de compra.

No Listmonk, é possível criar designs de e-mail "Transacionais". Crie um novo design para confirmação de compra.

![](/static/img/integrations/listmonk/image-1715235145934-11-18.png)

Aqui está um exemplo simplificado para o e-mail:

```
<!doctype html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
        <base target="_blank">

        <style>
            body {
                background-color: #F0F1F3;
                font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, sans-serif;
                font-size: 15px;
                line-height: 26px;
                margin: 0;
                color: #444;
            }

            pre {
                background: #f4f4f4f4;
                padding: 2px;
            }

            table {
                width: 100%;
                border: 1px solid #ddd;
            }
            table td {
                border-color: #ddd;
                padding: 5px;
            }
            table th {
                border-color: #000;
                padding: 5px;
                text-align: left;
            }

            .wrap {
                background-color: #fff;
                padding: 30px;
                max-width: 525px;
                margin: 0 auto;
                border-radius: 5px;
            }

            .button {
                background: #0055d4;
                border-radius: 3px;
                text-decoration: none !important;
                color: #fff !important;
                font-weight: bold;
                padding: 10px 30px;
                display: inline-block;
            }
            .button:hover {
                background: #111;
            }

            .footer {
                text-align: center;
                font-size: 12px;
                color: #888;
            }
                .footer a {
                    color: #888;
                    margin-right: 5px;
                }

            .gutter {
                padding: 30px;
            }

            img {
                max-width: 100%;
                height: auto;
            }

            a {
                color: #0055d4;
            }
                a:hover {
                    color: #111;
                }
            @media screen and (max-width: 600px) {
                .wrap {
                    max-width: auto;
                }
                .gutter {
                    padding: 10px;
                }
            }
        </style>
    </head>
<body style="background-color: #F0F1F3;font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, sans-serif;font-size: 15px;line-height: 26px;margin: 0;color: #444;">
    <div class="gutter" style="padding: 30px;">&nbsp;</div>
    <div class="wrap" style="background-color: #fff;padding: 30px;max-width: 525px;margin: 0 auto;border-radius: 5px;">
        <p>Hello {{ .Subscriber.Name }}</p>
        <p>
            <strong>Order number: </strong> {{ .Tx.Data.orderNumber }}<br />
            <strong>Created date: </strong> {{ .Tx.Data.createdAt }}<br />
        </p>
        <br />
        <table>
        <tr><th>Name</th><th>Price</th></tr>
        {{range .Tx.Data.products}} <tr><td>{{.title }}</td><td>{{.price}} {{ .Tx.Data.currency }}</td></tr>{{end}} 	
        </table>
        Total price: {{ .Tx.Data.orderSum }} {{ .Tx.Data.currency }}
        <br />
        <p>
            <a href="{{ .Tx.Data.orderUrl }}">Open Order</a>
        </p>
    </div>
    
    <div class="footer" style="text-align: center;font-size: 12px;color: #888;">
        <p>{{ L.T "public.poweredBy" }} <a href="https://listmonk.app" target="_blank" rel="noreferrer" style="color: #888;">listmonk</a></p>
    </div>
</body>
</html>
```

Visualmente, este HTML se parece com isto:

![](/static/img/integrations/listmonk/image-1715235241196-13-48.png)

2. Uma vez que o design esteja preparado, o template específico deve ser selecionado na integração Listmonk do DistantRace:

![](/static/img/integrations/listmonk/image-1715235304204-14-55.png)

Se o design não estiver disponível, pressione o botão "Atualizar" (pressionar este botão atualiza a lista de designs) e reabra a integração.

3. Uma vez que o design esteja selecionado e salvo, você pode testar como o design fica enviando um e-mail de teste. Pressione o botão "Testar E-mail de Pedido (se o template estiver configurado)".

É isso - a partir deste momento, se um participante pagar pela inscrição, apenas o seu e-mail projetado será enviado.

Aqui está um exemplo com as informações que são enviadas ao Listmonk para enviar o e-mail:

```

{
        "subscriber_email": email,
        "template_id": template_id,
        "data": {
            "orderID": "36902",
            "orderNumber": 36902,
            "firstName": first_name,
            "lastName": last_name,
            "cartID": "36902",
            "orderUrl": "https://distantrace.com/en/cart/d5949dac-b7d9-4e93-a874-34946286c006/",
            "currency": "EUR",
            "orderSum": 30.0,
            "createdAt": "2024-05-02 15:50",
            "updatedAt": "2024-05-02 16:36",
            "paymentMethod": "payment with card",
            "paymentStatus": "paid",
            "tags": ["Competition Name"],
            "products": [
                {
                    "cartProductID": 85268,
                    "productID": "607",
                    "variantID": "432",
                    "variantTitle": "Distance Name",
                    "title": "Participant Name - Competition Name, Distance Name, Additional products",
                    "vendor": "Competition Name",
                    "quantity": 1,
                    "price": 15.0,
                },
                {
                    "cartProductID": 85268,
                    "productID": "607",
                    "variantID": "432",
                    "variantTitle": "Distance Name",
                    "title": "Participant Name - Competition Name, Distance Name, Additional products",
                    "vendor": "Competition Name",
                    "quantity": 1,
                    "price": 15.0,
                },
            ],
        },
        "content_type": "html",
    }

```