Blocos de acordeão

Descrição

Blocos de acordeão é um plugin simples que adiciona um bloco para adicionar menus suspensos de acordeão às suas páginas.

Os acordeões devem incorporar perfeitamente ao seu tema. No entanto, você pode querer adicionar estilos personalizados ao seu tema.

Recursos

  • Adiciona um bloco para adicionar acordeões ao seu site.
  • Suporta vários acordeões com configurações individuais para cada acordeão.
  • Totalmente responsivo.
  • Suporte para IDs de item e links diretos.
  • Acessível (para usuários que requerem controle de navegação por teclado com guias).

Recursos opcionais

  • Abra acordeões individuais por padrão.
  • Desativar fechamento automático de acordeões.
  • Manualmente feche os acordeões clicando no título novamente.
  • Role a página até o título quando for clicado para abrir (incluindo configurar uma posição de deslocamento de rolagem).
  • Defina a tag de título HTML para o elemento de título (h1–h4, botão).
  • Defina os padrões a serem aplicados a todos os novos acordeões ou redefina um acordeão específico para os padrões.
  • Oferece suporte à adição de estilos de bloco personalizados usando wp.blocks.registerBlockStyle.

Saída

O plugin gerará o seguinte HTML (simplificado para este exemplo):

<div class="wp-block-pb-accordion-item c-accordion__item js-accordion-item" data-initially-open="false" data-click-to-close="true" data-auto-close="true" data-scroll="false" data-scroll-offset="0">
    <h2 id="at-76840" class="c-accordion__title js-accordion-controller" tabindex="0" role="button" aria-controls="ac-76840" aria-expanded="false">
        Title with H2 tag
    </h2>
    <div id="ac-76840" class="c-accordion__content" style="display:none" aria-hidden="true">
        <p>Content</p>
    </div>
</div>

CSS personalizado

Você pode usar as seguintes classes CSS para personalizar a aparência do acordeão.

.c-accordion__item {} /* The accordion item container */
.c-accordion__item.is-open {} /* is-open is added to open accordion items */
.c-accordion__item.is-read {} /* is-read is added to accordion items that have been opened at least once */
.c-accordion__title {} /* An accordion item title */
.c-accordion__title--button {} /* An accordion item title that is using a `<button>` tag */
.c-accordion__title:hover {} /* To modify the style when hovering over an accordion item title */
.c-accordion__title:focus {} /* To modify the style when an accordion item title currently has broswer focus */
.c-accordion__content {} /* An accordion item content container */

Imagens de tela

  • Barra lateral de configurações do bloco de acordeão
  • Bloco de acordeão no editor

Blocos

Este plugin disponibiliza 1 bloco.

  • Accordion Blocks

Instalação

  1. Envie a pasta ‘accordion-blocks’ para o diretório ‘/wp-content/plugins/’.
  2. Ative o plugin através do menu Plugins no WordPress.
  3. Adicione os acordeões ao seu conteúdo.

FAQ

Posso alterar as configurações de todos os meus acordeões existentes para o padrão?

Não. Não é possível alterar as configurações de todos seus acordeões (na mesma página ou em várias) para o padrão.

Embora eu gostaria de oferecer esse recurso, com base em minha pesquisa, ela exigiria uma quantidade significativa de tempo de desenvolvimento que não posso dedicar a um plugin gratuito. Se você é um desenvolvedor e tem interesse em ajudar a implementar um recurso como esse, entre em contato.

Por que o arquivo JavaScript não está carregando em meu site?

Isso provavelmente é causado por um tema mal codificado. Este plugin faz uso da função wp_footer() para carregar o arquivo JavaScript e sua dependência (jQuery). Verifique o seu tema para garantir que a função wp_footer() está sendo chamada logo antes da tag de fechamento </body> no arquivo footer.php do seu tema.

Problemas/Sugestões

Para relatórios de erros ou solicitações de recursos ou se você gostaria de contribuir com o plugin, você pode verificar tudo em Github.

Avaliações

27 de outubro de 2020
I put 11 accordions and it only shows 6, is that a limitation?
15 de outubro de 2020
Thanks Phil, this is exactly what I was looking for but didn't even know it! An elegant solution to setting up accordion blocks without any cruft!
16 de setembro de 2020
This plugin has everything you need: It's very lightweight; it's clean and beautiful; it's simple to use, yet it has enough options so it fits every need; it's translatable; and supports Gutenberg blocks. It only needs support for nested items, but not everybody needs this.
6 de junho de 2020
I've found it! Doesn't cook for me, be does the accordion excellently. a11y compliant Thank you!
Leia todas as 22 avaliações

Contribuidores e desenvolvedores

“Blocos de acordeão” é um software com código aberto. As seguintes pessoas contribuíram para este plugin.

Contribuidores

“Blocos de acordeão” foi traduzido para 2 localizações. Agradecemos aos tradutores por suas contribuições.

Traduzir “Blocos de acordeão” para o seu idioma.

Interessado no desenvolvimento?

Navegue pelo código, dê uma olhada no repositório SVN ou assine o registro de desenvolvimento via RSS.

Registro de alterações

1.1.6

  • Correção: Utilize conteúdo de amostra (em vez de conteúdo real) para pré-visualizar estilos de blocos personalizados no editor.
  • Correção: Versão obrigatória aumentada para WordPres 5.4.

1.1.5

  • Corrigido: Resolvido o problema com o aviso do PHP por não definir permission_callback na API REST.

1.1.4

  • Adicionado: Suporte para WordPress 5.5
  • Corrigido: estilos no-js agora são específicos para o bloco de acordeão

1.1.3

  • Corrigido: Ao digitar backspace no título de um botão, o acordeão inteiro era excluído em vez de retroceder um caractere

1.1.2

  • Corrigido: Títulos de acordeão suportam novamente os formatos negrito e itálico
  • Corrigido: Tradução deve ser possível agora através do site de tradução do WordPress

1.1.1

  • Corrigido: Um problema onde, em alguns sites, o conteúdo do acordeão não era aberto com animação suave, em vez disso aparecia instantaneamente após um pequeno atraso
  • Corrigido: Acordeões duplicados agora têm IDs exclusivos que devem resolver o problema onde clicar no título duplicado abre o bloco original

1.1.0

  • Novo: Uma opção para definir as configurações padrão de acordeão que serão aplicadas a todos os novos acordeões criados. Os acordeões individuais podem ser redefinidos para quaisquer que sejam as configurações padrão.
  • Corrigido: Acordeões não funcionam se exibindo o conteúdo de vários posts em uma página. Infelizmente, essa correção só se aplicará a acordeões recém-criados. Acordeões antigos precisarão ser substituídos para funcionar corretamente.
  • Corrigido: Usuários sem a permissão unfiltered_html (ou seja, usuários com a função de autor ou inferior) receberiam um erro de “conteúdo inválido” ao visualizar um acordeão adicionado por um usuário com a permissão unfiltered_html (e vice-versa).

1.0.6

  • Corrigido erro de digitação nas configurações do plugin

1.0.5

  • Adicionadas versões minificadas dos arquivos JS e CSS

1.0.4

  • Plugin tornado traduzível
  • Limpeza do código

1.0.3

  • Adicionada a capacidade de converter um parágrafo ou título em um acordeão.

1.0.2

  • Adicionada a capacidade do bloco no editor de aceitar classes css personalizadas (permite o cadastro personalizado de estilos de bloco)
  • Correção de acessibilidade: Removido aria-hidden=false dos acordeões fechados.

1.0.1

  • Leiame atualizado.

1.0.0

  • Plugin totalmente novo para suportar o novo editor de blocos do WordPress.