Como configurar e usar – O MECANISMO CONSTRUTOR DE WEBSITES

Introdução

O que é o O MECANISMO CONTRUTOR DE WEBSITES é um script Javascript que permite aos usuários personalizar modelos HTML de maneira rápida e fácil. O MECANISMO permite a edição básica de conteúdo, permitindo que os usuários alterem o texto do link, cabeçalhos e outros conteúdos escritos.

O MECANISMO CONSTRUTOR HTML é executado (quase) totalmente no navegador. O único código do lado do servidor está na forma de um único arquivo PHP usado para exportar marcação HTML.

O que não é (!)
O MECANISMO não é um CMS (sistema de gerenciamento de conteúdo). Ele não fornece uma maneira para os usuários finais trabalharem em sites ao vivo e fazer alterações nesses sites.

ESCOLHA ABAIXO QUAL DAS CONFIGURAÇÕES PRECISA DE SUPORTE E VEJA OS PASSOS DE CADA CONFIGURAÇÃO.

Obs.: As demais explicações estão disponível no TREINAMENTO EXCLUSIVO DO MECANISMO DIGITAL USA NA EDUZZ CLIQUE AQUI e saiba mais sobre este FANTÁSTICO TREINAMENTO.

ATENÇÃO: este artigo não foi totalmente traduzido por motivos de configuração dos código aqui descritos, afim de que não altere seus dados, caso queira traduzir basta apenas navegar com o GOOGLE CHROME e clicar com o botão direito do seu mouse e traduzir para o Português.

Obrigado E QUE DEUS ABENÇOE SUA VIDA!

Arrastar e soltar

O MECANISMO CONSTRUTOR HTML Builder permite que os usuários arrastem elementos HTML para uma tela e soltem-nos onde gostariam que fossem exibidos. Uma vez colocada na tela, a posição pode ser alterada arrastando e soltando também. Os elementos podem ser excluídos individualmente ou todos os elementos da página atual podem ser excluídos de uma só vez.

Edição de conteúdo

O script O MECANISMO CONSTRUTOR HTML também pode ser usado para editar conteúdo escrito dentro de cada elemento (simplesmente definindo o “modo de construção” para “conteúdo”). O MECANISMO CONSTRUTOR usa um editor de rich text, permitindo fazer alterações no conteúdo escrito. Dependendo do tipo de elemento que você está editando, algumas opções serão desativadas no editor. Os elementos de texto editáveis ​​precisarão ser configurados por meio de “/js/builder.js” e, dependendo da configuração exata, determinados elementos de texto podem não ser editáveis.

Edição de estilo / detalhe

O script O MECANISMO CONSTRUTOR HTML também permite edição básica de CSS e edição de links. Usando o editor CSS integrado, os usuários finais podem personalizar os atributos CSS que o administrador do script configurou. Ao editar um link, o usuário final pode apontar o link para uma página interna ou uma URL (externa).

Edição de link

O script O MECANISMO CONSTRUTOR HTML permite que o usuário edite links também. Para poder editar links, primeiro os seletores de links precisarão ser adicionados à matriz “editableItems” no arquivo /js/builder.js . Para editar links na tela, primeiro selecione o modo de construção Details , isso permitirá que você selecione links. Quando selecionada, uma guia “link” ficará visível no painel esquerdo, permitindo que você escolha uma página para vincular ou inserir um URL manualmente.

Vinculando em uma única página
Ao criar um site de uma página, convém vincular a seções em uma única página, em vez de em uma página separada. Para fazer isso, basta editar o link e usar o segundo menu suspenso para escolher o bloco ao qual você deseja vincular. Os IDs aos quais podem ser vinculados, devem ser configurados dentro dos arquivos HTML do bloco, e o atributo ID deve ser atribuído ao primeiro elemento filho do container principal (por exemplo, dê uma olhada em qualquer um dos arquivos de bloco agrupados ).

Edição de imagem

O script HTML Builder permite ao usuário editar imagens também. Para editar imagens na tela, selecione primeiro o   modo de construção Detalhes , isso permitirá selecionar imagens. Quando selecionada, a guia “imagem” ficará visível no painel esquerdo, permitindo que você faça o upload de uma imagem ou insira um URL manualmente.
– Para alterar a imagem, insira o novo url da imagem dentro do url (), por exemplo:
url (yourdomain.com/image.png)
– Para remover a imagem, basta digitar “url ()”


* Para tornar o paralaxe da imagem de fundo, defina o “background-size to cover” e “background-attachment to fixed”.

Vídeo de fundo

Para alterar o vídeo em segundo plano da seção, abra o código-fonte da seção e insira o URL do vídeo no atributo src da tag de origem e insira uma imagem alternativa (pôster) que seja exibida em dispositivos móveis em vez do vídeo no atributo poster tag de vídeo.

Clonando itens

Itens que foram configurados no array “editableItems” em  /js/builder.js  podem ser clonados. Mude para o modo de construção “Detalhes”, selecione o item que você deseja clonar e, finalmente, clique no botão clone no painel esquerdo. Por favor, note que os itens clonados serão inseridos na tela ao lado do item original.

Exportar HTML

Sempre que o usuário estiver satisfeito com o resultado final, a marcação criada pode ser exportada clicando no botão verde de exportação. O recurso de exportação irá pegar todos os elementos HTML usados ​​para cada página criada. Depois que todas as páginas forem concluídas, todos os arquivos HTML serão empacotados em um arquivo ZIP junto com outros recursos externos, como folhas de estilo, arquivos Javascript e imagens que serão baixadas pelo usuário final. 

Exportar & Importar projetos .pixbuilder

Você pode, a qualquer momento, exportar uma cópia do projeto da página de aterrissagem em que está trabalhando como um arquivo “project.pixbuilder”, que pode ser importado posteriormente para o construtor e continuar a edição.
Para exportar ou importar um projeto, abra a barra lateral esquerda e clique no botão “Exportar e Importar” na parte inferior da barra lateral.
* Nota: após o processo de importação, todas as páginas de destino atuais serão excluídas! Portanto, certifique-se de fazer uma cópia do seu trabalho atual, exportando-o a partir do botão de exportação acima dele no mesmo arquivo window (project.pixbuiledr).

Visualizar HTML

Para pré-visualizar uma página, clique no botão de pré-visualização na barra superior, só pode pré-visualizar uma única página; links para outras páginas não funcionam. Quando você fizer alterações em sua página, o recarregamento da visualização não funcionará, em vez disso, você terá que usar o botão “Visualizar” novamente.

Páginas

O script HTML Builder permite que os usuários criem várias páginas de uma só vez. Para adicionar uma nova página, basta clicar no botão verde “+ Adicionar” logo abaixo da lista de páginas atual. Você também pode alterar os nomes das páginas (por favor use nomes sem a extensão .html, estes são adicionados automaticamente durante a exportação). Ao exportar a marcação, as páginas usarão os mesmos nomes. Para excluir uma página, basta clicar no pequeno ícone de exclusão ao lado da página que você deseja excluir. 

Popups

Se você quiser adicionar um pop-up à sua página de destino, o script do pop-up deve ser incluído no código da página para funcionar, mas caso você esteja usando uma das seções pop-up predefinidas no construtor, aqui não é necessário adicione o script do pop-up à página, porque ele já existe na fonte da seção, e se você quiser adicionar este pop-up a outros links e botões na página, basta alternar para o modo Detalhes, pressionar o link ou o botão e o  #popup_id  no campo de link, por exemplo,  # popup_1 .

Você pode assistir a este vídeo para Edição e personalização de pop-ups predefinidos do O MECANISMO CONSTRUTOR HTML:
COLOCAR O VIDEO AQUI

Se você não estiver usando qualquer uma das secções pop-up pré-definidos no construtor, então você tem que adicionar o código do pop-up para a página, e para isso basta copiar o código do pop-up a partir do  artigo da base de conhecimento  e colá-lo  em fonte de qualquer seção  na construtor após o código existente e o pop-up funcionará em toda a página, para adicionar o pop-up a links e botões, basta alternar para o   modo Detalhes , pressionar o link ou o botão e, em seguida, colocar o  #popup_id  no campo link exemplo  # popup_1 .

Para editar o pop-up, basta alternar para o   modo de conteúdo , pressionar o link ou botão do pop-up, alternar para o   modo Detalhes e personalizar o estilo de pop-up normalmente.

Para obter mais informações, consulte nosso artigo da base de conhecimento sobre como adicionar novos pop-ups à sua página de destino:
https://omecanismousa.com/suporte-builder-pop-ups/

 

Configurando Formulários

Configurando Formulários no Construtor

Para configurar todos os formulários usados ​​dentro do construtor, basta escolher o serviço de correio fornecido (Tipo de Formulário) ao clicar no botão de exportação dentro do construtor e, em seguida, preencher as informações necessárias para o serviço de email que você escolheu (as informações para os outros provedores de serviços de email não são necessárias).

Tipo de formulário:

1- E-mail personalizado:

Quando você escolher “E-mail personalizado” como um tipo de formulário em sua página de destino, receberá todas as assinaturas enviadas diretamente no e-mail que escolheu no campo de e-mail. Também deverá inserir o assunto dos e-mails recebidos no assunto campo.

2- MailChimp:

Para enviar a data de envio para sua conta do MailChimp, você deve inserir as seguintes informações:
Sua chave de API aqui –  http://admin.mailchimp.com/account/api
Lista de identificação exclusiva daqui –  http://admin.mailchimp.com / lists /
E você deve certificar-se de que cada campo do formulário tem o mesmo nome na sua conta mailchimp, para alterar o nome do campo basta alternar o construtor para o modo “Detalhes”, clicar nos campos e abrir a guia “Construtor de Campo”. e aqui você pode alterar o nome do campo, o marcador de posição e a alteração, se for necessário ou não.

3- Monitor de Campanha:

Para enviar a data de envio para sua conta do Campaign Monitor, você deve inserir as seguintes informações:
Sua chave de API (altere seu nome de usuário com seu próprio nome de usuário) – https://your-username.createsend.com/admin/account/
ID de lista de aqui –  https://www.campaignmonitor.com/api/getting-started/#listid
E você deve certificar-se de que cada campo do formulário tenha o mesmo nome em sua conta do Campaign Monitor, para alterar o nome do campo simplesmente alterne o construtor para o modo “Detalhes”, em seguida, clique nos campos e, em seguida, abra a guia “Construtor de Campo” e aqui você pode alterar o nome do campo, o marcador de posição e a alteração, se necessário ou não.

4- GetResponse:

Para enviar a data de envio para sua conta da GetResponse, você deve inserir as seguintes informações:
Sua chave de API aqui –  https://app.getresponse.com/my_api_key.html
Nome da campanha aqui –  https://app.getresponse.com/ campaign_list.html
E você deve certificar-se de que cada campo do formulário tenha o mesmo nome na conta da GetResponse, para alterar o nome do campo basta alternar o construtor para o modo “Detalhes”, clicar nos campos e abrir a guia “Construtor de Campo”. e aqui você pode alterar o nome do campo, o marcador de posição e a alteração, se for necessário ou não.

5- AWeber:

Para enviar a data de envio para sua conta AWeber, você deve inserir as seguintes informações:
Your Authcode from here –  https://auth.aweber.com/1.0/oauth/authorize_app/647b2efd
Nome da lista aqui –  https: //www.aweber .com / users / autoresponder / manage
E você deve se certificar de que cada campo do formulário tem o mesmo nome em sua conta AWeber, para alterar o nome do campo basta alternar o construtor para o modo “Detalhes”, clicar nos campos e abrir Aba “Field Builder” e aqui você pode alterar o nome do campo, o marcador de posição e a alteração, se for necessário ou não.

6- ActiveCampaign:

Para enviar a data de envio para sua conta da ActiveCampaign, insira as seguintes informações:
URL da sua API Vá para Minhas configurações ->
Chave da API de desenvolvedores : vá para Minhas configurações ->
Lista de desenvolvedores id
E certifique-se de que cada campo do formulário tenha o mesmo nome na sua conta da ActiveCampaign, para alterar o nome do campo simplesmente mude o construtor para o modo “Detalhes”, clique nos campos, abra a guia “Construtor de Campo” e aqui você pode alterar o nome do campo, marcador e alterar se for necessário ou não.

7- MailerLite:

Para enviar a data de envio para sua conta MailerLite, você deve inserir as seguintes informações:
Sua chave de API aqui –  https://app.mailerlite.com/integrations/api/
ID da lista aqui –  https://app.mailerlite.com / integrações / api /
E você deve certificar-se de que cada campo do formulário tenha o mesmo nome em sua conta MailerLite, para alterar o nome do campo basta alternar o construtor para o modo “Detalhes”, clicar nos campos e abrir “Construtor de Campo”. “guia e aqui você pode alterar o nome do campo, o marcador de posição e a alteração, se for necessário ou não.

7- FreshMail:

Para enviar a data de envio para sua conta FreshMail, você deve inserir as seguintes informações:
Sua chave de API aqui –  https://app.freshmail.com/en/settings/integration/
Segredo da API a partir daqui –  https: //app.freshmail .com / pt / settings / integration /
ID da lista: Ir para a lista -> Parâmetros
E certifique-se de que cada campo do formulário tenha o mesmo nome na sua conta FreshMail, para alterar o nome do campo simplesmente mude o construtor para “Detalhes “mode, em seguida, clique nos campos e, em seguida, abra a aba” Field Builder “e aqui você pode alterar o nome do campo, o titular do espaço e alterar se for necessário ou não.

8- Sendloop:

Para enviar a data de envio para sua conta do Sendloop, você deve inserir as seguintes informações:
Sua chave de API: Vá para Configurações -> Configurações da API
Seu subdomínio
ID da lista: Ir para a lista -> Parâmetros
E certifique-se de que cada campo do formulário tenha o mesmo nome na sua conta Sendloop, para mudar o nome do campo simplesmente mude o construtor para o modo “Detalhes” e então clique nos campos, abra a aba “Construtor de Campo” e aqui você pode alterar o nome do campo, marcador e alterar se for necessário ou não.


Usando vários provedores de serviço de e-mail na mesma página:

Se você quiser usar vários provedores de serviços de e-mail na mesma página, basta alternar o construtor para o modo “Detalhes”, clicar em cada formulário e abrir a guia “Form Builder” e escolher “Tipo de formulário” para este formulário.
Não esqueça de inserir as informações requeridas para o provedor de serviços de email antes de exportar a página de entrada (clique no botão de exportação no construtor e preencha as informações necessárias no HTML de exportação).

Adicionando novos campos ao formulário:

Para adicionar novos campos aos formulários simplesmente mude o construtor para o modo “Detalhes” e então clique em qualquer campo e então clique no botão “clone”, depois disso você pode clicar no novo campo generted e mudar suas opções (nome, espaço reservado, …)

Você pode assistir a este vídeo para adicionar novos campos ao formulário:
COLOCAR O CAMPO DO VIDEO DE EDITANDO FORMULÁRIOS AQUI

Configuração de após a exportação e em páginas predefinidas

Se você estiver usando uma das páginas de destino predefinidas ou exportou a página de entrada do construtor e desejar editar o provedor de serviços de e-mail para os formulários na página, simplesmente siga estas etapas:

  1. Abra a pasta “pix_mail”.
  2. Abra o arquivo “config.php”.
  3. No número da linha (2), insira o provedor de serviços de e-mail que você deseja usar da seguinte maneira:
    • “ce” para o email personalizado.
    • “mc” para Mailchimp.
    • “cm” para o Campaign Monitor.
    • “gr” para GetResponse.
  4. Para o provedor de serviços de e-mail usado, insira as informações necessárias da seguinte forma:
    • Linhas de configuração de e-mail personalizadas (4 e 5), insira seu endereço de e-mail e o assunto do e-mail.
    • Linhas de configuração do Mailchimp (12 e 13), insira sua chave de API e ID de lista.
    • Linhas de configuração do Monitor de Campanha (16 e 17), insira sua Chave de API e ID de lista.
    • Linhas de configuração da GetResponse (20 e 21), insira seu nome de chave e campanha da API.
  5. Salve o arquivo e seu formulário estará pronto para uso.

Configurar o reCAPTCHA em formulários

Passo 1

Primeiro, precisamos de uma chave de API. Por isso, acesse https://www.google.com/recaptcha/admin. Para ter acesso a esta página, você precisa estar logado em uma conta do Google. Ser-lhe-á pedido para registar o seu site, por isso, atribua-lhe um nome adequado e, em seguida, liste os domínios (por exemplo, tutsplus.com) onde este reCAPTCHA específico será utilizado. Os subdomínios (como webdesign.tutsplus.com e code.tutsplus.com) são automaticamente considerados.

Passo 2

Com isso feito, você receberá uma chave de site e sua chave secreta de parceiro:

etapa 3

Abaixo das teclas, você verá alguns trechos para incluir o reCAPTCHA na sua página. Primeiro, há o JavaScript:

<script src = ‘https: //www.google.com/recaptcha/api.js’> </ script> 

Você também pode definir quais dos 40 idiomas suportados, adicionando um parâmetro à string. Aqui estamos adicionando as opções que nos fornecerão um reCAPTCHA em espanhol:

<script src = ‘https: //www.google.com/recaptcha/api.js? hl = es’> </ script> 

Coloque essa tag de script no pé da sua página (ou abaixo do formulário em que o reCAPTCHA será exibido, dependendo de como você prioriza o carregamento do seu material).

Passo 4

O próximo item é o marcador de espaço que você precisará adicionar à sua marcação de formulário, sempre que desejar que o reCAPTCHA apareça:

<div class = “g-recaptcha” data-sitekey = “6LcePAATAAAAAGPRWgx90814DTjgt5sXnNbV5WaW”> </ div> 

Este é um exemplo de um formulário com código recaptcha:

Depois disso, o reCAPTCHA estará pronto para uso.


Configurar formulários do PayPal

Para editar o Paypal depois de adicioná-lo à sua página de destino através do construtor, primeiro alterne o construtor para o modo “Detalhes”, clique no formulário e abra a guia “PayPal Builder” na barra lateral do ledt. Depois disso, você pode facilmente altere os valores dos campos (seu e-mail paypal, nome do item, preço do item, URL de retorno bem-sucedido, URL de retorno cancelada e URL de notificação).

Configurar e-mails de notificação do PayPal
1. Encontre seu URL de notificação

Depois de exportar a página de destino e enviá-la para o seu servidor, você deve encontrar o URL completo do arquivo “paypal_ipn.php” que está dentro da pasta “pix_mail”, por exemplo, se você fez o upload da página de destino para o diretório raiz URL será:
http://www.yourdomain.com/pix_mail/paypal_ipn.php
E se você enviar a página de destino para um subdiretório, o URL será: http://www.yourdomain.com/landing_page/pix_mail/ paypal_ipn.php

2. Configure sua conta do PayPal

Para configurar o IPN (Notificação de pagamento instantâneo), você precisará ter uma conta empresarial. Depois disso, siga estas etapas:

  1. Entre na sua conta do Paypal.
  2. Clique em “Profil”.
  3. Clique em “Perfil e configurações”.
  4. Na barra lateral esquerda, clique em “Minhas ferramentas de venda”.
  5. Clique no botão “atualizar” ao lado de “Notificações de pagamento instantâneo”. E clique em “Escolher configurações IPN” depois disso.
  6. Após a entrada a URL do arquivo “paypal_ipn.php” (que está dentro da pasta “pix_mail”) no campo URL da notificação e escolha a opção “Receber mensagens IPN”, e clique em salvar depois disso.
  7. O PayPal deve estar funcionando agora, em cada compra você receberá um e-mail com todos os detalhes e status do oreder, e o comprador receberá também um e-mail com os detalhes do seu pedido para confirmar sua compra.
Para mais informações, você pode verificar esses links úteis:

Como verificar se as Notificações IPN estão funcionando no seu site:
  • Depois de exportar a página de destino, abra o arquivo “/pix_mail/paypal_ipn.php” e altere o “USE_SANDBOX” na linha 13 para 1:
    define ("USE_SANDBOX", 0);

    Então será:

    define ("USE_SANDBOX", 1);
  • Em seguida, faça o upload dos arquivos da landing page para o seu servidor, depois você deve encontrar o URL completo do arquivo “paypal_ipn.php” que está dentro da pasta “pix_mail”, por exemplo se você carregou a landing page para o seu diretório raiz URL será:
    http://www.yourdomain.com/pix_mail/paypal_ipn.php
    E se você enviar a página de destino para um subdiretório, o URL será: http://www.yourdomain.com/landing_page/pix_mail/ paypal_ipn.php
  • Depois disso, vá para:  https://developer.paypal.com/developer/ipnSimulator/
  • Em seguida, faça o login na sua conta (a partir do botão de login no canto superior direito).
  • Depois disso insira o URL de notificação no primeiro campo “IPN handler URL”.
  • Você pode escolher qualquer tipo de transação para testar com seu site, por exemplo, escolha “eCheck – complete”.
  • No “receiver_email”, insira seu endereço de e-mail.
    Na entrada “payer_email”, qualquer outro endereço de e-mail que você testará como e-mail do comprador.
  • Em seguida, clique no botão “Enviar IPN” e você deverá receber dois e-mails sobre os endereços de e-mail do vendedor e do comprador.

Como editar e adicionar campos de preço do PayPal complexos

Você pode usar o formulário simples do PayPal na sua página de destino, que tem um preço usando o campo “valor” no formulário:

<input type = "hidden" name = "quantidade" valor = "15.00">

Se você quiser adicionar um formulário complexo do PayPal (vários preços), primeiro adicione o código “select” para permitir que o cliente escolha um plano para fazer o pedido:

<select name = "os0" required = "" aria-required = "true">
	<option value = ""> Escolha um plano </ option>
	<option value = "Normal"> Normal $ 9.99 USD </ option>
	<option value = "Premium"> Premium $ 14.99 USD </ option>
	<valor da opção = "Pro"> Pro $ 24.99 USD </ option>
</ select>

Onde o valor de cada opção é o nome do plano.
Depois disso você adiciona este código dentro do formulário, para cada opção que você adicionou no código anterior que você adicionou (“option_select” com o valor do nome) e (“option_amount” com o valor do preço da opção), adicionando o pedido (número) no final do nome do campo.

<input type = "hidden" name = "option_select0" value = "Normal">
<input type = "hidden" name = "option_amount0" value = "9,99">
<input type = "hidden" name = "option_select1" value = "Premium">
<input type = "hidden" name = "option_amount1" value = "14,99">
<input type = "hidden" name = "option_select2" value = "Pro">
<input type = "hidden" name = "option_amount2" value = "24.99">
<input type = "hidden" name = "option_index" value = "0">

Para mais informações, por favor verifique:

Variáveis ​​HTML para o padrão de pagamentos do PayPal

Como adicionar um campo de quantidade ao PayPalform

Para adicionar campo de quantidade ao seu formulário do PayPal, você precisa adicionar um campo de “seleção” com o valor das opções de quantidade e seus títulos visíveis:

<select name = "quantity" required = "" aria-required = "true">
	<option value = ""> Escolher quantidade </ option>
	<valor da opção = "1"> 1 Bilhete </ option>
	<option value = "2"> 2 Bilhete </ option>
	<option value = "3"> 3 Bilhete </ option>
</ select>

Para mais informações, por favor verifique:

Variáveis ​​HTML para o padrão de pagamentos do PayPal

Configuração Eventbrite

Para adicionar o pop-up Eventbrite à página de destino, siga estas etapas:

  1. Abra sua conta no  Eventbrite .
  2. Clique em “Gerenciar Eventos”.
  3. Clique em “Gerenciar” no evento que você deseja adicionar.
  4. Clique nos “Widgets” da barra lateral esquerda (sob a seção “Convidar e promover”).
  5. Clique em “Formulário de Ticket”.
  6. Copie o código do “iframe” apenas (sem o div).
    então o código “antes” deveria se parecer com:

    <div style = "width: 100%; text-align: esquerdo;" > <iframe src = "// eventbrite.com/tickets-external?eid=21069420203&ref=etckt" 
    frameborder = "0" altura = "260" largura = "100%" vspace = "0" hspace = "0" marginheight = "5" marginwidth = "5" rolagem = "auto" 
    allowtransparency = "true"> </ iframe> <div style = "família da fonte: Helvetica, Arial; tamanho da fonte: 10px; preenchimento: 5px 0 5px; 
    margem: 2px; largura: 100%; alinhamento de texto: esquerdo; " > <a class = "powered-by-eb" style = "cor: #dddddd; 
    text-decoration: nenhum;" target = "_ blank" href = "http://www.eventbrite.com/r/etckt"> Desenvolvido por Eventbrite </a> </ div> </ div>

    E você copia apenas o “iframe”, que deve ser parecido com:

    <iframe src = "// eventbrite.com/tickets-external?eid=21069420203&ref=etckt" frameborder = "0" altura = "260" largura = "100%" 
    vspace = "0" hspace = "0" marginheight = " 5 "marginwidth =" 5 "scrolling =" auto "allowtransparency =" true "> </ iframe>
  7. Depois disso, cole o código do iframe dentro deste código (diretamente após o texto do comentário):
    <div id = "popup_2" class = "bem pix_popup pop_style_1 pop_hidden light_gray_bg pix_builder_bg">
            <div style = "width: 700px; alinhamento de texto: esquerdo;" >
    
                <! - O CÓDIGO IFRAME AQUI ->
    
    	</ div>
    </ div>

    Então o código deve ficar assim:

    <div id = "popup_eventbrite" class = "bem pix_popup pop_style_1 pop_hidden light_gray_bg pix_builder_bg">
    	<div style = "width: 700px; alinhamento de texto: esquerdo;" >
    
                    <! - O CÓDIGO IFRAME AQUI ->
                    <iframe src = "// eventbrite.com/tickets-external?eid=21069420203&ref=etckt" 
    frameborder = "0" height = "260" width = "100%" vspace = "0" hspace = "0" marginheight = "5" marginwidth = "5" 
    rolagem = "auto" allowtransparency = "true"> </ iframe>
    
    	</ div>
    </ div>
  8. Depois disso, você pode colar esse código em sua página de destino (em qualquer lugar, por exemplo, no final da página), e você pode abrir o pop-up eventbrite alterando o link de qualquer botão para “#popup_eventbrite”.
    O link do botão deve ser assim:

    <a href="#popup_eventbrite"> EventBRite POPUP BUTTON </a>