Blocos

Blocos são seções logicamente divididas no Site Builder que reúnem componentes com funcionalidade semelhante.

Cabeçalho

Bloco no cabeçalho do site. O Header exibe as informações do usuário e contém elementos de navegação do site. Você pode fixar o bloco para que ele permaneça visível na tela ao rolar a página do site.

Recursos principais:

• Adição de botões para navegação, compra ou redirecionamento para outras páginas.
• Adição de um seletor de idioma para o site.
• Configuração de um botão de autenticação no site.
• Exibição de informações do usuário autenticado.

Barra lateral

Menu de navegação para transições entre páginas do site. Apresenta uma barra lateral alinhada à esquerda na área de trabalho e troca para uma barra inferior fixa em dispositivos móveis.

Barra lateral na versão desktop do site:

Barra lateral na versão móvel do site:

Recursos principais:

• Configuração do menu de navegação.
• Adição de botões para navegar para a Google Play, App Store ou outra loja de aplicativos.
• Adição de botões para acessar sua página nas redes sociais.

Bloco principal no modelo Single game page

Bloco com informações sobre o jogo vendido no site.

Recursos principais:

• Personalização do layout do texto.
• Exibição de informações do jogo: título e desenvolvedor.
• Exibição das plataformas de distribuição do jogo.
• Adição de tags com conteúdo personalizado.
• Configuração das funções dos botões:
  • Assistir a vídeos
  • Rolar até um bloco
  • Redirecionar para um link
  • Comprar um item
• Personalização do estilo dos botões.

Bloco principal no modelo Web Shop

O bloco com informações sobre sua Web Shop e os principais detalhes sobre o jogo.

Recursos principais:

• Personalização das informações do jogo: ícone, título, desenvolvedor.
• Personalização de cards com descrições dos recursos do site.

Se necessário, personalize o bloco:

1. Adicione imagens ou vídeo como plano de fundo personalizado.
2. Para configurar os cards de informação, ative as opções correspondentes:
   • Show icons
   • Show titles
   • Show descriptions

Chamada para ação

Bloco para atrair a atenção do usuário para ações importantes no site.

Recursos principais:

• Adição de um campo para o e-mail do usuário para assinar novidades do jogo.
• Adição de um botão para comprar um item e links para a Google Play/App Store ou para outro site.
• Exibição de logotipos de plataformas; ao clicar, o usuário vai para sua página nessa plataforma.
• Lightbox com vídeo do YouTube/Vimeo.

Fast Login

O bloco Fast Login destaca a etapa obrigatória de autenticação e simplifica o caminho de compra do usuário.

A aparência do bloco e seus recursos dependem do método de autenticação selecionado.

Se a autenticação via ID do Usuário estiver configurada para o site, o bloco Fast Login exibirá um campo para inserir o ID e um botão de login.

Recursos principais:

• Autenticação do usuário sem transição adicional para a janela modal.
• Configuração do conteúdo do bloco. Você pode habilitar e configurar as seguintes seções:
  • Título
  • Descrição
  • Instruções sobre como encontrar o ID do Usuário
  • Plano de fundo personalizado

Se a autenticação via Xsolla Login estiver configurada para o site, um botão adicional que solicita autorização é exibido no bloco Fast Login. Ao clicar no botão do bloco, abre-se uma janela modal para autorização usando um dos métodos do Xsolla Login.

Recursos principais:

• Configuração do texto do botão que solicita autorização
• Configuração de plano de fundo personalizado

Galeria

Bloco com imagens, capturas de tela e materiais de vídeo para aumentar o interesse do usuário pelo jogo.

Recursos principais:

• Adição de imagens e vídeos aos slides.
• Reprodução de vídeos na Página de Destino por meio de um link do YouTube.
• Navegação pelos slides com conteúdo.
• Pré-visualização do vídeo ou imagem anterior e seguinte no controle deslizante.
• Exibição de setas para navegar pelo conteúdo.

Notícias

Recursos principais:

• publicação de artigos, notícias, anúncios, notas de atualização do jogo
• agrupamento de artigos por categorias e exibição das categorias como abas

Cartões

Bloco universal para exibir informações sobre o jogo ou a loja. Neste bloco, você pode adicionar cartões com qualquer conteúdo.

Recursos principais:

• Adição de cartões com textos, imagens e botões.
• Configuração das funções dos botões:
  • Assistir a vídeos
  • Rolar até um bloco
  • Redirecionar para um link
  • Comprar um item
• Ajuste dos tamanhos dos cartões e do posicionamento dos elementos.
• Personalização do layout em grade dos cartões.
• Alinhamento do conteúdo dentro dos cartões.

Não há tamanho de imagem recomendado no bloco Cards, pois você pode ajustar a proporção do cartão e da imagem.

Slider promocional

Bloco com uma galeria contendo banners do jogo, títulos e descrições.

Recursos principais:

• Possibilidade de adicionar um botão para comprar itens, navegar para um link ou para a Google Play/App Store.
• Rolagem cíclica dos slides com conteúdo.
• Exibição de setas de navegação para os jogos.
• Adição de um campo para o e-mail do usuário para assinar novidades do jogo.
• Exibição de links para sua página em diversas plataformas.

Descrição

Bloco com descrição do jogo e imagens.

Recursos principais:

• Exibição de imagens e descrições de texto.
• Duas opções de layout para imagens e texto: horizontal e vertical.
• Ampliação das imagens ou navegação para um link ao clicar na imagem.

Códigos promocionais

Bloco para usar códigos promocionais e cupons no site.

Recursos principais:

• Aplicação de códigos promocionais pelo usuário para receber bônus nas compras.
• Aplicação de cupons para recompensas imediatas.
• Adição de código JS personalizado para expandir os recursos do bloco.

Edições do jogo

O bloco permite exibir informações detalhadas sobre um jogo e apresentar os recursos das diferentes edições desse jogo.

Recursos principais:

• Modelos de estilo para o conjunto e estilo personalizado.
• Ajuste do layout dos componentes: botões, títulos e descrições podem ser reorganizados.
• Configuração das listas de benefícios para cada edição do jogo.
• Destaque do conjunto mais vantajoso — você pode marcar uma edição do jogo como recomendada para compra.

Loja

Bloco para vender chaves de jogo (excluindo o modelo Web Shop), itens virtuais, conjuntos e pacotes de Moeda Virtual. O bloco contém seções criadas automaticamente; você pode excluí-las e criar novas.

Recursos principais:

• Venda de itens de jogo e chaves de jogo.

• Exibição de todas as informações sobre os itens: preços, promoções, nomes, descrições, imagens, conteúdo do conjunto, limites de compra.

• 4 estilos de cartão de item.

• Navegação pelas seções usando abas por Tipo de Item.

• Personalização dos títulos do bloco e das seções.

• Prévia de itens de demonstração.

• Rolagem horizontal em dispositivos móveis.

• Botão adicional para solicitação de autenticação.

Se necessário, personalize o bloco e adicione:

• título
• exibição de nomes de Grupos de Itens
• abas para navegação rápida na loja
• plano de fundo personalizado

Para isso, ative as opções correspondentes.

Você também pode configurar o botão de solicitação de autenticação na seção Login button.

Para configurar a exibição de itens na loja:

1. Adicione uma seção da loja e, na lista suspensa, selecione o tipo e o grupo de itens que você quer vender no site.

2. Na seção da loja, selecione o estilo Item card:

• Featured. Esse layout de cartão permite chamar a atenção dos usuários para itens ou Ofertas Especiais.

• Nas configurações do layout do cartão, você pode:
  • ocultar ou exibir a imagem e a descrição de um item
  • ajustar ou maximizar a imagem de um item
  • alterar a cor do texto
  • usar um plano de fundo personalizado para o carrossel

• Recomendamos usar esse layout para:
  • promover ofertas de bônus e desconto
  • destacar itens e ofertas com limitações definidas
  • exibir conjuntos

• Horizontal. Esse layout de cartão permite posicionar o nome, a descrição e o preço do item à direita da imagem.

• Nas configurações do layout do cartão, você pode:
  • ocultar ou exibir a descrição do item
  • ajustar ou maximizar a imagem do item
  • habilitar ou desabilitar a rolagem horizontal em dispositivos móveis
  • usar um plano de fundo personalizado para a seção

• Vertical. Esse layout de cartão permite posicionar o nome, a descrição e o preço do item na parte inferior da imagem.

• Nas configurações do layout do cartão, você pode:
  • ocultar ou exibir a descrição do item
  • ajustar ou maximizar a imagem do item
  • habilitar ou desabilitar a rolagem horizontal em dispositivos móveis
  • usar um plano de fundo personalizado para a seção

• Large. Recomendamos usar esse layout de cartão para conjuntos e bônus. Ele mostra a composição do card na Página de Destino sem clicar no card.

• Nas configurações do layout do cartão, você pode:
  • ocultar ou exibir a descrição do item
  • ajustar ou maximizar a imagem do item
  • habilitar ou desabilitar a rolagem horizontal em dispositivos móveis
  • usar um plano de fundo personalizado para a seção

3. Se necessário, personalize o layout do cartão ativando as opções correspondentes nas configurações do layout.

4. Para ocultar a seção quando ela não tiver conteúdo, ative a opção Hide section if empty.

Sistema de recompensas

Bloco para adicionar o sistema de recompensas. Ele permite obter Pontos de Valor ao comprar, armazená-los e coletar cadeias de recompensas. Os Pontos de Valor não são gastos ao receber uma recompensa.

Recursos principais:

• Escolha de uma cadeia de recompensas configurada na loja do jogo.
• Expansão dos recursos do bloco, por exemplo, adicionar texto, um botão ou uma imagem usando código JS.

Cadeia de ofertas

Comportamento na página:

• As ofertas são exibidas como um slider horizontal com cartões de itens.
• Cada oferta pode ter um dos seguintes status:
  • Resgatada – o item foi comprado ou resgatado de graça.
  • Disponível – o item pode ser comprado ou resgatado de graça.
  • Bloqueada – o item ainda não está disponível porque o anterior não foi resgatado ou comprado.
• Cada oferta pode ter um dos seguintes tipos de preço:
  • Grátis – o item pode ser resgatado de graça.
  • $X.XX – o item está disponível para compra.
• A oferta disponível é destacada. O botão exibe Claim para ofertas gratuitas ou $X.XX para as pagas.
• Quando o usuário clica no botão do cartão da oferta ativa, a ação correspondente é executada: iniciar a interface de pagamento ou resgatar o item de graça.

Widgets de redes sociais

Bloco com acesso às redes sociais do jogo para uma interação mais eficaz com os usuários.

Recursos principais:

• Adição de widgets para Facebook, Twitter, Discord e Twitch.
• Dois tipos de exibição de widget.
• Escolha de tema claro ou escuro no Twitter e no Discord.

Perguntas frequentes

Bloco com respostas às perguntas frequentes sobre o seu jogo.

Recursos principais:

• Respostas predefinidas para perguntas comuns, adequadas para a maioria das lojas.
• Adição de código JS personalizado para estender os recursos do bloco.

Código personalizado

O bloco permite usar código CSS, JS e HTML personalizado no site para implementar funcionalidades exclusivas não previstas na interface.

Recursos principais:

• Sincronização do código personalizado entre todas as versões de idioma do site sem necessidade de migração individual.
• Abas separadas para CSS, HTML e JS dentro do bloco.
• Realce de sintaxe embutido.
• Miniatura do código para facilitar a navegação dentro do bloco.

Configurações do carrinho

Você pode usar o carrinho de compras no site. Para fazer isso:

1. Na seção principal do builder, acesse o bloco Cart settings.

2. Ative a opção Use shopping cart.

3. Configure funções adicionais do carrinho de compras (opcional). Para isso, ative as opções correspondentes:

1. • Show promo code field – permite que os usuários usem um código promocional ou cupom na interface do carrinho de compra;

1. • Login before shopping cart – abra a janela de autenticação ao navegar ao carrinho de compras se o usuário não fez login anteriormente.

Requisitos do sistema

Bloco com informações sobre os requisitos mínimos e recomendados necessários para executar o jogo em diferentes plataformas.

Recursos principais:

• Duas opções de exibição:
  • Apenas requisitos mínimos
  • Requisitos mínimos e recomendados
• Uso de múltiplas abas para diferentes plataformas.

Assinaturas

Bloco que permite aos usuários acessar um pacote de serviços com base em condições especificadas.

Recursos principais:

• Definição de ícones para cada componente da assinatura.
• Definição de uma imagem para o plano de assinatura.

Social quests

O bloco Social quests permite adicionar tarefas ao seu site que recompensam os usuários com pontos de fidelidade ou itens do catálogo após a conclusão.

Essas tarefas podem incluir conectar uma conta do YouTube, visitar uma comunidade no Discord ou assistir a um trailer do jogo. As recompensas são concedidas automaticamente. Os pontos de fidelidade são refletidos imediatamente no saldo da conta do usuário no site, e os usuários podem resgatá-los no checkout para pagar parcialmente pelos itens. Os itens do catálogo são entregues ao inventário do jogo do usuário, à Mochila ou à Carteira.

Social quests ajuda você a aumentar o engajamento, fortalecer a fidelidade do usuário e fazer sua comunidade crescer, transformando ações sociais em recompensas reais.

Consulte a documentação de Social quests para detalhes sobre como configurar o bloco.

Quests

O bloco Quests exibe missões como cartões na sua Web Shop. Cada cartão mostra a imagem, o nome, a descrição, a recompensa e um botão. As condições das missões são baseadas em eventos do jogo: ações do jogador no seu jogo que você envia para a plataforma de missões, por exemplo, alcançar um nível ou vencer um número de partidas.

Você pode criar e editar missões somente pelo Xsolla AI toolkit. Consulte a documentação de Quests para detalhes sobre como adicionar e configurar o bloco.

Rodapé

O bloco fica na parte inferior da página. Ele contém informações legais e configurações de privacidade.

Recursos principais:

• Escolha de estilo do bloco: colunas ou linhas.
• Adição de seletor de idioma para o site.
• Adição de botões para compartilhar o link do site nas redes sociais.
• Exibição de restrições etárias.

Se necessário, personalize o bloco:

• Selecione o estilo do layout.
• Personalize o plano de fundo.
• Adicione a seção Share options e configure os botões de compartilhamento.
• Adicione a seção Social media e configure os links das redes sociais.
• Adicione restrições etárias.