{"id":12932,"date":"2022-03-31T16:32:16","date_gmt":"2022-03-31T23:32:16","guid":{"rendered":"https:\/\/membermouse.com\/?p=12932"},"modified":"2024-09-18T12:53:51","modified_gmt":"2024-09-18T16:53:51","slug":"plugin-de-associacao-elementor","status":"publish","type":"post","link":"https:\/\/membermouse.com\/pt\/marketing\/elementor-membership-plugin\/","title":{"rendered":"Como criar seu site com o MemberMouse e o Elementor"},"content":{"rendered":"<!-- wp:paragraph -->\n<p>O design \u00e9 uma das etapas mais importantes da cria\u00e7\u00e3o de um site de associa\u00e7\u00e3o. Quer esteja come\u00e7ando do zero ou j\u00e1 tenha um site, voc\u00ea quer criar uma experi\u00eancia bonita, agrad\u00e1vel e funcional para seus membros.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Sabemos disso porque quase todas as semanas recebemos perguntas de nossos clientes sobre como estilizar os elementos principais de seus sites, como p\u00e1ginas de checkout, pain\u00e9is de controle de membros, \u00e1reas de fornecimento de conte\u00fado e muito mais.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>While MemberMouse is an incredibly powerful membership tool, it's essentially design agnostic. That means it works \"behind the scenes\" to handle everything that goes into running a membership site and lets your WordPress theme determine how things look. And unless you're a WordPress developer or have some serious design chops, it can be frustrating to get your site to look exactly the way you want.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>\u00c9 por isso que os criadores de p\u00e1ginas se tornaram t\u00e3o populares. Essas s\u00e3o ferramentas maravilhosas que permitem que voc\u00ea crie visualmente, em vez de usar c\u00f3digo. E, de todos os criadores de p\u00e1ginas do mercado, o que mais me chamou a aten\u00e7\u00e3o foi o fato de que eles s\u00e3o muito mais f\u00e1ceis de usar, <a href=\"https:\/\/membermouse.com\/pt\/elementor\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Elementor<\/a> \u00e9 definitivamente um dos mais proeminentes.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>(N\u00e3o se preocupe se voc\u00ea usar o Divi - n\u00f3s temos <a href=\"https:\/\/membermouse.com\/pt\/integracao\/pacote-de-layout-divi-membermouse\/\" target=\"_blank\" rel=\"noopener noreferrer\">a coisa perfeita para voc\u00ea<\/a>)<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Para ajud\u00e1-lo a criar um site com \u00f3tima apar\u00eancia e que funcione bem, criamos este v\u00eddeo tutorial detalhado. Nele, mostraremos a voc\u00ea como criar seu site usando o Elementor e o MemberMouse. Voc\u00ea aprender\u00e1 a usar a funcionalidade principal de ambas as ferramentas para que saiba como faz\u00ea-las funcionar para o seu neg\u00f3cio. Estamos muito empolgados em compartilhar isso com voc\u00ea e esperamos que ajude a tornar o design do seu site muito menos problem\u00e1tico.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Pronto para mergulhar de cabe\u00e7a? Clique em reproduzir o v\u00eddeo abaixo.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:embed {\"url\":\"https:\/\/youtu.be\/EAZ1DZh0fG4?feature=shared\",\"type\":\"video\",\"providerNameSlug\":\"youtube\",\"responsive\":true,\"className\":\"wp-embed-aspect-16-9 wp-has-aspect-ratio\"} -->\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\nhttps:\/\/youtu.be\/EAZ1DZh0fG4?feature=shared\n<\/div><\/figure>\n<!-- \/wp:embed -->\n\n<!-- wp:paragraph -->\n<p><script src=\"https:\/\/fast.wistia.com\/embed\/medias\/sigybc5eik.jsonp\" async=\"\"><\/script><script src=\"https:\/\/fast.wistia.com\/assets\/external\/E-v1.js\" async=\"\"><\/script><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:html -->\n<div id=\"section-highlights\" class=\"section-content-area\">\n<h3 class=\"title-budicon\"><i class=\"budicon-task-love color-blue\"><\/i> Vis\u00e3o geral do v\u00eddeo<\/h3>\n<table class=\"table table-detail\">\n<tbody>\n<tr>\n<th class=\"column-timestamp color-dark\">0:00<\/th>\n<td>Intro &amp; Overview<\/td>\n<\/tr>\n<tr>\n<th class=\"column-timestamp color-dark\">2:50<\/th>\n<td>Criando a p\u00e1gina inicial do membro com o MemberMouse<\/td>\n<\/tr>\n<tr>\n<th class=\"column-timestamp color-dark\">13:34<\/th>\n<td>Como trabalhar com SmartTags de dados de membros para criar uma experi\u00eancia personalizada<\/td>\n<\/tr>\n<tr>\n<th class=\"column-timestamp color-dark\">24:42<\/th>\n<td>Como usar a SmartTag de decis\u00e3o do membro para exibir conte\u00fado de forma din\u00e2mica<\/td>\n<\/tr>\n<tr>\n<th class=\"column-timestamp color-dark\">46:52<\/th>\n<td>Como projetar uma p\u00e1gina de checkout<\/td>\n<\/tr>\n<tr>\n<th class=\"column-timestamp color-dark\">54:00<\/th>\n<td>Concluindo<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<!-- \/wp:html -->\n\n<!-- wp:heading {\"level\":3,\"className\":\"title-budicon\"} -->\n<h3 class=\"wp-block-heading title-budicon\"><i class=\"budicon-star color-blue\"><\/i> <strong>O que voc\u00ea aprender\u00e1 neste v\u00eddeo<\/strong><\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Neste tutorial, mostraremos a voc\u00ea como combinar o poder do MemberMouse e do Elementor. Depois de assisti-lo, voc\u00ea saber\u00e1 como usar os recursos avan\u00e7ados do MemberMouse e criar um site que voc\u00ea adora. Neste exemplo, come\u00e7aremos criando uma p\u00e1gina inicial de membro do zero.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2022\/03\/1f12ab21-member-homepage.png\" alt=\"exemplo de p\u00e1gina inicial de membro\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Al\u00e9m disso, voc\u00ea ver\u00e1 como pode usar os SmartTags do MemberMouse - como o <a href=\"https:\/\/membermouse.com\/pt\/documentos-3-2\/dados-do-membro-smarttag-mm_member_data\/\" target=\"_blank\" rel=\"noopener noreferrer\">Dados do membro SmartTag<\/a> &amp; <a href=\"https:\/\/membermouse.com\/pt\/documentos-3-2\/decisao-do-membro-smarttag-mm_member_decision\/\" target=\"_blank\" rel=\"noopener noreferrer\">Decis\u00e3o do membro SmartTag<\/a> - para personalizar a experi\u00eancia de seus membros e exibir conte\u00fado de forma din\u00e2mica. \u00c9 algo muito divertido (em nossa humilde opini\u00e3o).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>E na segunda parte do v\u00eddeo, tamb\u00e9m veremos como criar uma p\u00e1gina de checkout que combine com a apar\u00eancia do seu site:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2022\/03\/ffed4966-membership-checkout-page.png\" alt=\"Exemplo de p\u00e1gina de checkout de associa\u00e7\u00e3o\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Abaixo, voc\u00ea encontrar\u00e1 mais informa\u00e7\u00f5es e recursos sobre alguns dos principais conceitos abordados no v\u00eddeo. Se voc\u00ea ficar preso ou tiver d\u00favidas, estamos aqui para ajud\u00e1-lo. Basta deixar um coment\u00e1rio abaixo nesta postagem e n\u00f3s o ajudaremos assim que poss\u00edvel.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3,\"className\":\"title-budicon\"} -->\n<h3 class=\"wp-block-heading title-budicon\"><i class=\"budicon-browser-tick color-blue\"><\/i><strong> Como usar o SmartTag de decis\u00e3o do membro<\/strong><\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Em <strong>24:40<\/strong> No tutorial, mostramos como voc\u00ea pode usar a Member Decision SmartTag para exibir dinamicamente o conte\u00fado com base no fato de algu\u00e9m possuir ou n\u00e3o um determinado produto.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Como mencionamos no v\u00eddeo, <a href=\"https:\/\/membermouse.com\/pt\/documentos-3-2\/decisao-do-membro-smarttag-mm_member_decision\/\" target=\"_blank\" rel=\"noopener noreferrer\">Aqui est\u00e1 o link para o artigo de suporte<\/a> com todas as informa\u00e7\u00f5es de que voc\u00ea precisa para colocar esses recursos em funcionamento em seu site.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Aqui est\u00e1 um exemplo do trecho de c\u00f3digo que voc\u00ea colaria em um bloco HTML para implementar isso em seu site:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:preformatted -->\n<pre class=\"wp-block-preformatted\">\n\n<\/pre>\n<!-- \/wp:preformatted -->\n\n<!-- wp:preformatted -->\n<pre class=\"wp-block-preformatted\">\n\n<\/pre>\n<!-- \/wp:preformatted -->\n\n<!-- wp:paragraph -->\n<p>Certifique-se de atualizar o n\u00famero de identifica\u00e7\u00e3o do pacote para que corresponda ao pacote com o qual voc\u00ea est\u00e1 trabalhando.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3,\"className\":\"title-budicon\"} -->\n<h3 class=\"wp-block-heading title-budicon\"><i class=\"budicon-doodle color-blue\"><\/i><strong> Como personalizar sua p\u00e1gina de checkout<\/strong><\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Frequentemente recebemos perguntas sobre como fazer com que uma p\u00e1gina de checkout do MemberMouse esteja em conformidade com o estilo de seu tema ou construtor de p\u00e1ginas. \u00c9 por isso que nesta se\u00e7\u00e3o (em <strong>46:52<\/strong> no tutorial), mostramos como fazer com que qualquer p\u00e1gina de checkout corresponda \u00e0 apar\u00eancia do restante do seu site. E a boa not\u00edcia \u00e9 que tudo o que voc\u00ea precisa fazer \u00e9 copiar e colar um pequeno trecho de c\u00f3digo na se\u00e7\u00e3o que deseja alterar no Elementor.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2022\/03\/277b5aa6-elementor-css.png\" alt=\"exemplo de elementor css\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Na se\u00e7\u00e3o CSS Classes, basta colar este trecho de c\u00f3digo como eu fa\u00e7o em <strong>50:25<\/strong> no v\u00eddeo:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><code class=\"color-orange\">elementor-widget-text-editor<\/code><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Isso substituir\u00e1 o estilo padr\u00e3o da p\u00e1gina de checkout e garantir\u00e1 que suas p\u00e1ginas de checkout correspondam ao design do seu site.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3,\"className\":\"title-budicon\"} -->\n<h3 class=\"wp-block-heading title-budicon\"><i class=\"budicon-two-thirds color-blue\"><\/i><strong> Onde encontrar todos os modelos de p\u00e1ginas principais<\/strong><\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Dependendo da vers\u00e3o do WordPress que estiver usando, talvez n\u00e3o seja poss\u00edvel inserir diretamente todos os diferentes modelos de p\u00e1gina principal do MemberMouse no editor de conte\u00fado:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/storage.googleapis.com\/wpgcbucket\/wp\/2022\/03\/ac441cda-membermouse-core-pages.png\" alt=\"Modelos de p\u00e1gina central do membermouse\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Mas isso n\u00e3o \u00e9 um problema. Tudo o que voc\u00ea precisa fazer \u00e9 visitar a p\u00e1gina abaixo para encontrar todos os modelos de que precisa:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul class=\"wp-block-list\"><!-- wp:list-item -->\n<li><a href=\"https:\/\/membermouse.com\/pt\/categorias-de-artigos\/nucleo-de-modelos\/\" target=\"_blank\" rel=\"noopener noreferrer\">Todos os modelos de p\u00e1gina principal do MemberMouse<\/a><\/li>\n<!-- \/wp:list-item --><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>A partir da\u00ed, voc\u00ea pode simplesmente encontrar o modelo de p\u00e1gina com o qual deseja trabalhar, copi\u00e1-lo e col\u00e1-lo no bloco HTML que est\u00e1 projetando no Elementor.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3,\"className\":\"title-budicon\"} -->\n<h3 class=\"wp-block-heading title-budicon\"><i class=\"budicon-notes-tick color-blue\"><\/i><strong> Concluindo<\/strong><\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Obrigado por assistir a este v\u00eddeo tutorial sobre o MemberMouse e o Elementor. Entendemos o quanto pode ser dif\u00edcil quando voc\u00ea come\u00e7a a criar seu site. Se voc\u00ea tiver alguma d\u00favida sobre o que abordamos aqui, informe-nos nos coment\u00e1rios abaixo. Adoramos ajudar as pessoas a criar sites de associa\u00e7\u00e3o eficientes e lucrativos e ficaremos felizes em ajud\u00e1-lo.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:html -->\n<div id=\"section-resources\" class=\"section-content-area\">\n<h3 class=\"title-budicon\"><i class=\"budicon-book color-blue\"><\/i> Recursos adicionais<\/h3>\n<ul>\n<li><a href=\"https:\/\/membermouse.com\/pt\/documentos-3-2\/dados-do-membro-smarttag-mm_member_data\/\" target=\"_blank\" rel=\"noopener noreferrer\">Dados do membro SmartTag<\/a><\/li>\n<li><a href=\"https:\/\/membermouse.com\/pt\/documentos-3-2\/decisao-do-membro-smarttag-mm_member_decision\/\" target=\"_blank\" rel=\"noopener noreferrer\">Decis\u00e3o do membro SmartTag<\/a><\/li>\n<li><a href=\"https:\/\/membermouse.com\/pt\/documentos-3-2\/usando-links-de-compra-com-um-clique\/\" target=\"_blank\" rel=\"noopener noreferrer\">Como usar links de compra com um clique<\/a><\/li>\n<li><a href=\"https:\/\/membermouse.com\/pt\/elementor\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Elementor<\/a><\/li>\n<li><a href=\"https:\/\/membermouse.com\/pt\/hello-theme\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Ol\u00e1 Tema<\/a><\/li>\n<li><a href=\"https:\/\/membermouse.com\/pt\/generatepress\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">GeneratePress<\/a><\/li>\n<\/ul>\n<\/div>\n<!-- \/wp:html -->","protected":false},"excerpt":{"rendered":"<p>Neste tutorial em v\u00eddeo detalhado, mostraremos a voc\u00ea como criar e projetar seu site de associa\u00e7\u00e3o usando o MemberMouse e o Elementor.<\/p>","protected":false},"author":20918,"featured_media":12971,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"om_disable_all_campaigns":false,"_strive_editorial_status":"not-started","_strive_copy_of":0,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_strive_checklists":"\"\"","_strive_active_checklist":"","_strive_post_notes":"","footnotes":""},"categories":[81,117,116,35,73],"tags":[],"class_list":["post-12932","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-marketing","category-mm-dash","category-mm-features","category-strategies","category-wordpressux"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/posts\/12932","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/users\/20918"}],"replies":[{"embeddable":true,"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/comments?post=12932"}],"version-history":[{"count":0,"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/posts\/12932\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/media\/12971"}],"wp:attachment":[{"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/media?parent=12932"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/categories?post=12932"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/membermouse.com\/pt\/wp-json\/wp\/v2\/tags?post=12932"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}