{"id":62294,"date":"2024-02-13T09:21:20","date_gmt":"2024-02-13T14:21:20","guid":{"rendered":"https:\/\/memberpress.com\/docs\/how-to-show-your-memberships-in-tabs-or-accordion\/"},"modified":"2024-02-16T03:09:45","modified_gmt":"2024-02-16T08:09:45","slug":"how-to-show-your-memberships-in-tabs-or-accordion","status":"publish","type":"ht_kb","link":"https:\/\/stg.memberpress.com\/pt\/docs\/how-to-show-your-memberships-in-tabs-or-accordion\/","title":{"rendered":"Como mostrar suas associa\u00e7\u00f5es em guias ou em um acorde\u00e3o"},"content":{"rendered":"

O MemberPress j\u00e1 tem uma op\u00e7\u00e3o para mostrar todas as associa\u00e7\u00f5es em uma p\u00e1gina se voc\u00ea optar por Grupos MemberPress<\/a>. However, what if your memberships are different enough so that upgrading\/downgrading doesn\u2019t make sense, or you simply don\u2019t want to use that feature due to one reason or another?<\/p>\n\n\n\n

Voc\u00ea j\u00e1 deve ter notado que cada associa\u00e7\u00e3o cria um conjunto de c\u00f3digos de acesso que voc\u00ea pode acessar clicando no bot\u00e3o C\u00f3digos curtos de associa\u00e7\u00e3o<\/u> <\/strong>no link Registro<\/strong> guia de Op\u00e7\u00f5es de associa\u00e7\u00e3o<\/em> caixa.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

You\u2019ll notice two shortcodes are generated. For this tutorial, you\u2019ll need the lower one, which contains the ID part so, you\u2019ll need to prepare the shortcodes of all memberships you want to use.<\/p>\n\n\n\n

Now, you could insert those shortcodes in a page or post directly, and that would work, but you\u2019d see that all registration fields would be instantly visible, and if you have three or more memberships you want to add, it won\u2019t look pretty since the page would be quite long with a lot of fields being shown at once.<\/p>\n\n\n\n

In order to make it a lot prettier, you\u2019ll need to install and activate the Guia \u2013 Acorde\u00e3o<\/a> plugin. Once the activation is complete, you\u2019ll get a new section in your WordPress Dashboard:<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

After that, you\u2019re ready to continue. The user interface might feel a bit counter-intuitive initially, but if you follow these steps, you\u2019ll be up and running in no time. You can start by clicking on the Criar agora<\/em> bot\u00e3o.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

You\u2019ll see eight available tabs and eight available accordions in the free versions; for more, you can upgrade to the Pro version of the plugin.<\/p>\n\n\n\n

Start by clicking on the Choose Theme button on one of the tabs or accordions you want to create. You\u2019ll get this on the left-hand side of the screen:<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Clique no s\u00edmbolo \u201cmais\u201d no Campos de guias<\/strong> row, and you\u2019ll see this:<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

You\u2019ll get three tabs already prepared (but you can add more or delete the third one), which is perfect for our example since we\u2019ll be adding our Bronze Membership, Silver Membership, and Gold Membership. Next, click the pen symbol in order to edit each tab individually. You\u2019ll be on the Menu tab. Type in the membership\u2019s name, select a tab\u2019s icon and color of text and background if you want (the other two options are Pro only), click the Conte\u00fado<\/strong> tab, and paste the membership\u2019s shortcode in the Texto<\/em> vista.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n
\"\"\/<\/figure>\n\n\n\n

Don\u2019t forget to click the \u201cUpdate content\u201d button. You\u2019ll most likely need to scroll down to see it.<\/p>\n\n\n\n

Repita o procedimento para as assinaturas Silver e Gold.<\/p>\n\n\n\n

Essas outras op\u00e7\u00f5es, como Op\u00e7\u00f5es gerais<\/em> no Guias<\/strong> e outras op\u00e7\u00f5es na guia Menu<\/strong> e Conte\u00fado<\/strong> permitir\u00e3o que voc\u00ea ajuste essas guias visualmente, da maneira que desejar. Recomendamos que voc\u00ea experimente essas guias para ver como elas afetam a exibi\u00e7\u00e3o visual.<\/p>\n\n\n\n

Don\u2019t forget to click the Save\/Update button after every change. When done, click the \u201cBack to WP\u201d button.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

You\u2019ll be asked whether you want to leave the page. Confirm by clicking the \u201cLeave Page\u201d button.<\/p>\n\n\n\n

You\u2019ll see a completed tab, which will also generate a shortcode you\u2019ll need to copy and paste into a page or post of your choice.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

By clicking the Pen icon, you\u2019ll be able to go back to editing, make a copy of the tab by clicking the Copy icon, or trash it by clicking the Trash Can icon. The Preview (eye) icon won\u2019t do you much good since, while previewing, it will just show those memberships\u2019 shortcodes you\u2019ve added previously.<\/p>\n\n\n\n

However, after you publish that post or page, with the shortcode in it, you\u2019ll see something like this:<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Os visitantes e membros do seu site poder\u00e3o alternar entre as tr\u00eas (ou trinta e tr\u00eas) associa\u00e7\u00f5es \ud83d\ude42 simplesmente clicando em uma guia.<\/p>\n\n\n\n

If you end up with errors about values not being filled in, you\u2019ll need to activate the Estilos CSS globais<\/strong> op\u00e7\u00e3o em MemberPress -> Configura\u00e7\u00f5es -> Geral<\/em> guia.<\/p>\n\n\n\n

And that\u2019s it, you\u2019ve created much better-looking tabulated memberships, or memberships in an accordion, depending upon which option you prefer.<\/p>","protected":false},"excerpt":{"rendered":"

MemberPress already has an option to show all memberships on one page if you go for MemberPress Groups. However, what if your memberships are different enough so that upgrading\/downgrading doesn\u2019t make sense, or you simply don\u2019t want to use that feature due to one reason or another? You have probably by now noticed that every [\u2026]<\/p>\n","protected":false},"author":62252,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"om_disable_all_campaigns":false,"_strive_editorial_status":"not-started","_strive_copy_of":0,"inline_featured_image":false,"_monsterinsights_skip_tracking":false,"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","_FSMCFIC_featured_image_caption":"","_FSMCFIC_featured_image_nocaption":"","_FSMCFIC_featured_image_hide":"","_strive_checklists":"\"\"","_strive_active_checklist":"62291e2bb2422","footnotes":""},"ht-kb-category":[1315],"ht-kb-tag":[],"class_list":["post-62294","ht_kb","type-ht_kb","status-publish","format-standard","ht_kb_category-how-to","entry","has-post-thumbnail"],"acf":[],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t