O widget é compatível com uma vasta gama de sites, incluindo Wix, WordPress, ContentSquare e outros. Dada a diversidade de plataformas, pode ser necessária uma configuração específica para a melhor integração possível. Se continuar a ter dificuldades depois de consultar a nossa documentação sobre o widget, recomendamos que percorra as verificações abaixo.

1. O widget apresenta conteúdo que não deveria estar lá

Pode controlar quais as reservas que aparecem no widget organizando-as em categorias. Verifique se os filtros correspondentes na configuração do seu widget estão definidos conforme esperado.

Depois de alterar a configuração, copie o código recém-gerado e cole-o novamente no seu site.

2. O widget parece diferente da pré-visualização, aparece cortado ou não responde a cliques

Ative o Modo de compatibilidade. Isto isola o widget dos estilos e do tema do seu site, o que normalmente é a causa destes três sintomas.

Depois de alterar a configuração, copie o código recém-gerado e cole-o novamente no seu site.

3. O widget de calendário não é responsivo no telemóvel

"O widget de calendário aparece em vista de cartões no telemóvel."

Selecione a opção Visualização responsiva nas definições de visualização.
Copie o código recém-gerado e cole-o novamente no seu site.

4. O widget de calendário mostra a vista de lista no computador

"O widget de calendário aparece como uma lista no meu computador em vez de cartões."

Este é o comportamento esperado, não um erro. O widget de calendário é responsivo: mostra uma lista de aulas em ecrãs pequenos e cartões em ecrãs grandes. No entanto, a escolha da vista baseia-se na largura do contentor onde o widget está inserido no seu site, e não na largura do ecrã do visitante. Por predefinição, só muda para cartões quando esse contentor tem mais de 1280px de largura.

Assim, mesmo num ecrã de computador grande, se a secção que contém o widget for mais estreita do que 1280px — por exemplo, porque a sua página tem uma largura máxima de conteúdo, margens ou uma barra lateral — o widget continuará a mostrar a vista de lista.

Há duas formas de resolver isto:

Aumentar a largura do contentor. Defina a secção que contém o widget com, pelo menos, 1280px de largura (por exemplo, largura total). O widget passará então a mostrar cartões automaticamente no computador.
Reduzir o ponto de mudança. Se preferir manter um contentor mais estreito, adicione a opção cardModeDisplayMinWidth ao código do seu widget, dentro das definições "calendar", com a largura em píxeis a partir da qual os cartões devem ser apresentados. Neste exemplo, os cartões aparecem assim que o contentor tiver mais de 1000px de largura:

"config": {
    "calendar": {
        // ...as suas opções de calendário existentes...
        "cardModeDisplayMinWidth": 1000
    }
}

Esta opção é adicionada manualmente ao código. Se mais tarde alterar as definições do widget no back office e colar o código recém-gerado, lembre-se de a adicionar novamente.

5. O idioma do widget está errado, ou o meu próprio texto não é traduzido

"As minhas descrições e títulos não são traduzidos.": O idioma do widget apenas traduz o texto predefinido do bsport, como botões e etiquetas (por exemplo, "Adicionar ao carrinho"). Os títulos das aulas, descrições e nomes de atividades aparecem exatamente como foram escritos no seu back office.

"O meu site tem vários idiomas, mas o widget mostra sempre o mesmo.": Cada código de widget tem apenas uma definição de idioma, pelo que o mesmo código mostra sempre o mesmo idioma em todas as versões do seu site. Com a opção "Automático", o widget segue o idioma do navegador do visitante, não o idioma da página. Para ter um idioma diferente por página, gere um código de widget por idioma e cole cada um na página correspondente.

Depois de alterar a configuração, copie o novo código e cole-o no seu site.

6. O widget aparece comprimido no telemóvel

Os widgets bsport são responsivos por predefinição, mas precisam de um espaço mínimo para se ajustarem corretamente. Verifique se o contentor onde inseriu o widget é suficientemente largo para o apresentar bem.

7. O widget de calendário transborda no telemóvel

"Inseri o widget de calendário, mas ele transborda no telemóvel."

O widget de calendário expande-se até à largura máxima da página. Se o contentor que aloja o widget tiver uma largura máxima superior à largura do ecrã do telemóvel, o calendário vai expandir-se até essa largura e transbordar.

Verifique se o contentor que aloja o widget de calendário tem uma regra CSS max-width.
Adicione a regra abaixo à sua área de CSS personalizado.
Guarde as alterações.

div[id*="bsport-widget"] { width: 100%; }

8. O CSS personalizado não está a funcionar

"Apliquei regras CSS para personalizar os widgets, mas não estão a ser aplicadas."

Verifique se foi adicionado !important às suas regras e, se for o caso, remova-o. O bsport já adiciona automaticamente !important ao CSS personalizado, pelo que adicioná-lo também duplica essa regra, o que pode quebrar o estilo pretendido e provocar comportamentos inesperados.

9. O Apple Pay e o Google Pay não aparecem como métodos de pagamento

"Ativei o Apple Pay e o Google Pay, mas não aparecem no processo de compra."

Vá a Definições > Métodos de pagamento e certifique-se de que o Apple Pay e o Google Pay estão ambos selecionados.
Adicione o seu domínio para os ativar nos widgets.
Guarde.

10. Qualquer outro problema

Para qualquer questão não abordada acima, contacte-nos através de support@bsport.io.

Widget: problemas mais comuns