# Consultar detalhes da conta Source: https://docs.kiwify.com.br/api-reference/account/account-details get /account-details # Editar afiliado Source: https://docs.kiwify.com.br/api-reference/affiliates/edit put /affiliates/{id} Editar informações de um afiliado específico, passando o affiliate_id. # Listar afiliados Source: https://docs.kiwify.com.br/api-reference/affiliates/list get /affiliates Obtenha uma lista com todos os afiliados. # Consultar afiliado Source: https://docs.kiwify.com.br/api-reference/affiliates/single get /affiliates/{id} Consulte os detalhes de um afiliado específico, passando o affiliate_id. # Gerar token OAuth Source: https://docs.kiwify.com.br/api-reference/auth/oauth post /oauth/token Entenda como adquirir o token Bearer OAuth, necessário para autenticação nas demais rotas da API. # Listar participantes Source: https://docs.kiwify.com.br/api-reference/events/list get /events/{product_id}/participants # Consultar saldos Source: https://docs.kiwify.com.br/api-reference/finance/balance/list get /balance Consulte todos os saldos da sua conta. # Consultar saldo específico Source: https://docs.kiwify.com.br/api-reference/finance/balance/single get /balance/{legal_entity_id} Consulte um saldo específico da sua conta, passando o legal_entity_id. # Realizar um saque Source: https://docs.kiwify.com.br/api-reference/finance/payouts/create post /payouts/ Solicita a realização de um saque. Exige o cabeçalho Idempotency-Key, um UUID gerado por você que identifica o saque. Este endpoint é de natureza síncrona, o que significa que você terá uma resposta imediata, porém, para saber o status da solicitação, será necessário consultar o dashboard, no menu financeiro, na aba "Saques". O cabeçalho `Idempotency-Key` é **obrigatório**. Requisições sem ele são recusadas com `400`. Gere um UUID novo para cada saque que pretende criar e reenvie esse mesmo valor, inalterado, em qualquer nova tentativa da mesma solicitação. Uma retentativa após timeout ou erro de rede devolve o saque original em vez de criar um segundo — por isso, nunca gere uma chave nova ao repetir uma solicitação que já pode ter chegado até nós. O UUID enviado é o `id` do saque, e pode ser usado em seguida para [consultá-lo](/api-reference/finance/payouts/single). # Listar saques Source: https://docs.kiwify.com.br/api-reference/finance/payouts/list get /payouts Obtenha uma lista de todos os saques. # Consultar saque Source: https://docs.kiwify.com.br/api-reference/finance/payouts/single get /payouts/{id} Consulte detalhes de um saque específico, passando o id do saque # Informações Gerais Source: https://docs.kiwify.com.br/api-reference/general Entenda os conceitos gerais, códigos de resposta e sobre a autenticação da API. ### URL Base A API da Kiwify é construída com base nos princípios REST. Exigimos HTTPS em todas as requisições para melhorar a segurança, integridade e privacidade dos dados. A API não suporta requisições HTTP. Todas as requisições devem usar a seguinte URL base: ``` https://public-api.kiwify.com ``` ### Autenticação Implementamos autenticação OAuth em nossas rotas de API, o que significa que você precisará gerar um `bearer token` com a `api_key` usando a rota [/oauth/token](/api-reference/auth/oauth). Para gerar o token, será necessário o `client_secret`. Observação: Guarde o client\_secret em um local seguro, pois ele pode ser usado para chamar todos os nossos outros endpoints da API. Ele expira em `96 horas`. Não o gere toda vez antes de chamar um endpoint. #### Onde obter o client\_secret 1. Crie uma nova API Key na dashboard. Clique em Apps > API > Criar API Key api 2. Copie o `client_secret`. api ### Endpoints Para realizar a autenticação em todos os endpoints, você precisará adicionar um Authorization header e o conteúdo da header será `Bearer XXXXXXX` onde `XXXXXXX` é o OAuth token gerado. Você precisará também passar o `account_id`, que você pode copiar na dashboard, no mesmo local que gerou a API Key. ``` Authorization: Bearer 1234...... x-kiwify-account-id: XXXXXX ``` #### Códigos de Resposta HTTP A API da Kiwify utiliza o padrão de códigos de resposta HTTP para indicar o sucesso ou falha de cada requisição. No geral, códigos no intervalo 2xx demonstram sucesso, códigos 4xx indicam que ocorreu um erro no lado do cliente e códigos 5xx sugerem um problema na infraestrutura da API da Kiwify. | Status | Descrição | | ------ | -------------------------------------------------------- | | `200` | Código de sucesso. | | `400` | Erro no lado do cliente. Confira os parâmetros enviados. | | `500` | Erro no lado do servidor. | | `429` | O limite de requisições foi atingido. | #### Rate limit O número máximo de requisições que um usuário pode realizar é de 100 chamadas por minuto. Ao ultrapassar esse limite, você receberá uma mensagem de erro com status code `429`. ### Idempotência Operações financeiras exigem o cabeçalho `Idempotency-Key`: um UUID gerado por você que identifica a solicitação. Hoje ele é obrigatório em [Realizar um saque](/api-reference/finance/payouts/create). ``` Idempotency-Key: 8606aae0-e036-4e55-998a-e0a8de7bf54f ``` Gere um UUID novo para cada saque que pretende criar e reenvie esse mesmo valor, inalterado, em qualquer nova tentativa da mesma solicitação. Se uma requisição falhar por timeout ou erro de rede, você não tem como saber se ela chegou até nós — repeti-la com a mesma chave é seguro, pois devolve o saque original em vez de criar um segundo. O UUID enviado é o `id` do saque. Requisições sem este cabeçalho, ou com um valor que não seja um UUID válido, são recusadas com `400` e `error: validation_error`. #### FAQ Todas as datas serão passadas no formato `ISO 8601`: 2020-07-10 15:00:00.000 As respostas da API seguem o formato JSON. Sim, os usuários estão limitados a 100 chamadas por minuto. Se esse limite for ultrapassado, a API retornará uma mensagem de erro com status code 429. Se o reenvio usar o mesmo `Idempotency-Key`, nenhum saque novo é criado: você recebe de volta o saque original. É por isso que a chave deve ser gerada uma vez por saque e reutilizada em todas as tentativas daquela mesma solicitação — gerar uma chave nova a cada tentativa cria saques duplicados. Entre em contato através do e-mail [infoprodutores@kiwify.com.br](mailto:infoprodutores@kiwify.com.br). # Listar produtos Source: https://docs.kiwify.com.br/api-reference/products/list get /products Obtenha uma lista de todos os produtos. # Consultar produto Source: https://docs.kiwify.com.br/api-reference/products/single get /products/{id} Obtenha os detalhes de um produto específico, passando o product_id. # Listar vendas Source: https://docs.kiwify.com.br/api-reference/sales/list get /sales Obtenha uma lista de todas as vendas. O período máximo entre o start_date e o end_date é de 90 dias.. # Reembolsar venda Source: https://docs.kiwify.com.br/api-reference/sales/refund post /sales/{id}/refund # Consultar venda Source: https://docs.kiwify.com.br/api-reference/sales/single get /sales/{id} Consulte os detalhes de uma venda específica, passando o order_id. # Consultar estatísticas de vendas Source: https://docs.kiwify.com.br/api-reference/sales/stats get /stats # Listar planos do Parcelado Source: https://docs.kiwify.com.br/api-reference/scheduled-installments/list get /scheduled-installments Obtenha uma lista dos planos do Parcelado Kiwify da loja. O período máximo entre o created_start e o created_end é de 90 dias. # Consultar plano do Parcelado Source: https://docs.kiwify.com.br/api-reference/scheduled-installments/single get /scheduled-installments/{id} Consulte os detalhes de um plano do Parcelado Kiwify e suas parcelas, passando o id do plano. # Criar webhook Source: https://docs.kiwify.com.br/api-reference/webhooks/create post /webhooks # Deletar webhook Source: https://docs.kiwify.com.br/api-reference/webhooks/delete delete /webhooks/{id} Delete um webhook específico, passando o webhook_id. # Atualizar webhook Source: https://docs.kiwify.com.br/api-reference/webhooks/edit put /webhooks/{id} Atualize um webhook específico, passando o webhook_id. # Listar webhooks Source: https://docs.kiwify.com.br/api-reference/webhooks/list get /webhooks Obtenha uma lista de todos webhooks. # Consultar webhook Source: https://docs.kiwify.com.br/api-reference/webhooks/single get /webhooks/{id} Consulte detalhes de um webhook específico, passando o webhook_id. # Personalização da Área de Membros Source: https://docs.kiwify.com.br/members-area/general Um guia completo para criar experiências personalizadas de membros com Temas Kiwify ## Visão Geral O sistema de temas da Área de Membros permite que você: * Personalize sua área de membros com código (usando templates Liquid) * Crie experiências de aprendizado personalizadas com layouts customizados * Mantenha controle total sobre a experiência dos seus estudantes * Integre ferramentas e recursos externos de forma contínua * Implemente funcionalidades avançadas usando objetos de dados globais ## Como Funciona A personalização da Área de Membros funciona através de duas interfaces complementares: Theme Editor O Editor de Tema fornece uma interface visual para personalizar seu tema sem escrever código. Mudanças feitas no Editor de Tema são refletidas no código, e vice-versa. Code Editor O Editor de Código é um ambiente de código completo onde você pode modificar diretamente os arquivos do tema. Acesse o editor de código clicando no botão "Editor de Código" na barra superior do Editor de Tema. Code Editor Você também pode acessar o Editor de Código clicando no botão "Editor de Código" na barra lateral ao editar uma seção. Isso fará com que o Editor de Código abra pronto para você editar o template da seção correspondente. Code Editor ## Próximos Passos Entenda como os componentes do tema funcionam juntos Aprenda como usar os objetos de dados globais Mergulhe nos detalhes de cada componente do tema # Tema Padrão Source: https://docs.kiwify.com.br/members-area/key-concepts/the-default-theme Conhecendo o tema padrão e suas partes O tema padrão da Kiwify conta com seis tipos de seção, que podem ser totalmente customizadas de acordo com suas preferências. ## Login Exibe o botão de login da Kiwify com layout, imagem de título e imagem de fundo. Expõe os seguintes parâmetros para o Editor de Temas: * `variant`: controla o layout -- *sidebar* ou fundo completo layout full layout sidebar * `image_background`: imagem exibida no fundo da tela de login (opcional) * `image_header`: imagem exibida acima do botão de login (opcional; usa o logotipo da área de membros como *fallback*) Essa seção utiliza o snippet `auth-button` para exibir o botão de login, que é um simples *wrapper* para o botão de login implementado nativamente na Área de Membros Kiwify. ## Banner Carrossel de imagens com passagem automática de slides. Utiliza a biblioteca [Embla Carousel](https://www.embla-carousel.com/) para controle de slides. [Saiba mais sobre as bibliotecas disponíveis](/members-area/key-concepts/theme-architecture#bibliotecas-disponíveis). banner Quando há mais de um slide, exibe setas para avançar e retroceder slides, e um controle de acesso direto aos slides na parte inferior. Expõe um único parâmetro: * `slides_delay`: quantos segundos o componente deve esperar até trocar para o slide seguinte, quando há mais de um Os slides podem ser no máximo 3, e são representados como [blocos](/members-area/key-concepts/theme/sections#blocos-de-seção), que podem ter os seguintes parâmetros: * `mobile_image`: imagem do slide na versão mobile; caso ausente, a imagem desktop é exibida no mobile também * `desktop_image`: imagem do slide na versão desktop; caso ausente, a imagem mobile é exibida no desktop também Caso nenhuma das imagens esteja presente, a seção aparecerá quebrada para o usuário final. ## Cursos Carrossel com links para cursos da área de membros. Cada link é exibido na forma de um card com a imagem e, opcionalmente, o nome do curso. Expõe os seguintes parâmetros para o Editor de Temas: * `title`: título exibido no topo da seção * `items_variant`: modo de exibição dos títulos dos conteúdos; pode ter os seguintes valores: * `content_over`: título sempre visível sobre a imagem do curso * `content_hidden`: título não é exibido * `mouse_hover`: título é exibido sobre a imagem do curso apenas ao passar o mouse sobre o card * `items_layout`: formato de exibição dos cards; pode ter os valores `portrait` (retrato) ou `landscape` (paisagem). Vide * `all_accessible_courses`: booleano que controla quais cursos serão exibidos na seção; se seu valor for verdadeiro, todos os cursos aos quais o usuário tem acesso serão exibidos, em ordem alfabética; se for falso, serão exibidos os cursos referenciados nos blocos da seção Essa seção pode conter blocos, indicando quais cursos devem ser exibidos na seção e em qual ordem. Cada bloco contém apenas uma propriedade: `course_id`. Caso um curso referenciado em um bloco não seja acessível ao usuário final, ele será exibido mesmo assim. Se o curso tiver venda na área de membros configurada, o usuário final será capaz de clicar no link para realizar a compra. ## Módulos Carrossel com links para módulos de um curso da área de membros. Cada link é exibido na forma de um card com a imagem e, opcionalmente, o nome do módulo. Expõe os seguintes parâmetros para o Editor de Temas: * `title`: título exibido no topo da seção * `items_variant`: modo de exibição dos títulos dos conteúdos; pode ter os seguintes valores: * `content_over`: título sempre visível sobre a imagem do curso * `content_hidden`: título não é exibido * `mouse_hover`: título é exibido sobre a imagem do curso apenas ao passar o mouse sobre o card * `items_layout`: formato de exibição dos cards; pode ter os valores `portrait` (retrato) ou `landscape` (paisagem) * `course_id`: identificador do curso cujos módulos serão listados nessa seção Caso um módulo do curso não seja acessível ao usuário final, ele será exibido mesmo assim. Se o curso tiver venda na área de membros configurada, o usuário final será capaz de clicar no link para realizar a compra do curso completo. ## Aulas Carrossel com links para aulas de um curso da área de membros. Cada link é exibido na forma de um card com a imagem e, opcionalmente, o nome da aula. Expõe os seguintes parâmetros para o Editor de Temas: * `title`: título exibido no topo da seção * `items_variant`: modo de exibição dos títulos dos conteúdos; pode ter os seguintes valores: * `content_over`: título sempre visível sobre a imagem do curso * `content_hidden`: título não é exibido * `mouse_hover`: título é exibido sobre a imagem do curso apenas ao passar o mouse sobre o card * `items_layout`: formato de exibição dos cards; pode ter os valores `portrait` (retrato) ou `landscape` (paisagem) * `module_id`: identificador do módulo cujas aulas serão listadas nessa seção Caso o módulo selecionado não seja acessível ao usuário final, a seção inteira não é exibida. ## Continuar Assistindo Carrossel com links para aulas recomendadas para o usuário final continuar assistindo (vide objeto [last\_watched\_lessons](/members-area/reference/objects/last_watched_lessons)). Cada link é exibido na forma de um card com a imagem e, opcionalmente, o nome da aula. Expõe os seguintes parâmetros para o Editor de Temas: * `items_layout`: formato de exibição dos cards; pode ter os valores `portrait` (retrato) ou `landscape` (paisagem) Caso não haja nenhuma aula para continuar assistindo, a seção inteira não é exibida. ## Cards As seções de cursos, módulos, aulas e "continuar assistindo" são bem similares: exibem links para conteúdo da área de membros na forma de cards. Para evitar duplicação de código, esses links estão implementados nos snippets `cards` e `cards-item`. O snippet `cards` é responsável por exibir o título, configurar o carrossel e percorrer a lista de links, chamando o snippet `cards-item` para cada link. Ele recebe alguns argumentos que o tornam bastante flexível: * `section_items`: lista de objetos que serão exibidos; mais detalhes abaixo * `is_horizontal`: booleano que indica se os cards devem assumir o layout horizontal ou vertical card horizontal card vertical * `should_display_progress`: booleano que indica se a barra de progresso deve ser exibida ou não * `percentage_field`: propriedade dentro do campo `user_data` de cada item de `section_items` que contém o valor a ser exibido na barra de progresso * `path_format`: string que indica o formato da URL para a qual o conteúdo aponta. Exemplos: * `{id}`: a URL final será o ID do item * `{course_id}/{id}`: a URL final será o valor do campo `course_id` do item, seguido da barra e do ID do item Ele também precisa que sejam repassados os seguintes objetos globais para ele: * `section` * `is_preview` O snippet `cards-item` recebe esses mesmos parâmetros exceto o `section_items`. No lugar, recebe o parâmetro `item`, que é basicamente um dos itens da lista `section_items`. Esse parâmetro `item` deve ser um objeto e pode ter as seguintes propriedades: * `thumbnail_slider_cover`, `logo_url` e `thumbnail`: URL para a imagem do card. Qualquer um dos três nomes pode ser usado * `user_data`: objeto do tipo [user\_data](/members-area/reference/objects/user_data) ou, no caso do item ser uma aula, [lesson\_user\_data](/members-area/reference/objects/lesson_user_data) * `custom_offer`: objeto do tipo [custom\_offer](/members-area/reference/objects/custom_offer) * `course_id`: ID do curso ao qual o item pertence, no caso de módulos e aulas * `module_id`: ID do módulo ao qual a aula pertence * `id`: ID do curso, módulo ou aula * `name`: nome do curso, módulo ou aula, a ser exibido no card # Estrutura do Tema Source: https://docs.kiwify.com.br/members-area/key-concepts/theme-architecture Entendendo a arquitetura e os componentes O sistema de temas da Área de Membros Kiwify segue uma arquitetura modular inspirada no Shopify. Este documento fornece uma visão geral de como os componentes trabalham juntos para criar uma experiência de aprendizado personalizável. ## Estrutura de Diretórios ``` nome-do-tema/ ├── templates/ │ ├── index.json │ └── login.json ├── sections/ │ └── [...].liquid ├── locales/ │ ├── en.default.json │ ├── es.default.json │ ├── pt.default.json │ ├── en.schema.json │ ├── es.schema.json │ └── pt.schema.json └── snippets/ └──[...].liquid ``` ## Componentes Principais Arquivos JSON que definem a estrutura e conteúdo da página Componentes .liquid reutilizáveis para conteúdo da página Arquivos de tradução para múltiplos idiomas Fragmentos de código reutilizáveis compartilhados entre seções ## Como Estes Componentes Funcionam Juntos Templates são arquivos JSON que definem quais seções aparecem em uma página e sua ordem. Eles também armazenam dados de configuração para cada seção. Sections são arquivos Liquid que renderizam o conteúdo real na página. Eles podem ser personalizados através das configurações do editor de tema definidas em seu schema. Snippets são fragmentos de código reutilizáveis que podem ser incluídos em seções para manter consistência e reduzir duplicação. Locales fornecem capacidades de tradução, permitindo que seu tema suporte múltiplos idiomas. ## Fluxo de Dados 1. A Área de Membros carrega o arquivo JSON de template apropriado (index.json ou login.json) 2. Ela lê as seções e sua ordem do template 3. Para cada seção, ela: * Carrega o arquivo Liquid da seção * Passa as configurações da seção do template para a seção * Renderiza a seção com seus dados 4. Dentro das seções, você pode: * Acessar objetos globais como `all_courses` * Renderizar snippets para componentes de UI reutilizáveis * Usar traduções através do filtro `t` ## Objetos Globais Disponíveis Confira [Visão Geral dos Objetos](/members-area/reference/objects) para uma lista completa e mais detalhes. Acesso a todos os cursos que o usuário tem permissão para visualizar Acesso a todos os módulos em todos os cursos Acesso a todas as aulas em todos os módulos Array de IDs de aulas visualizadas recentemente ## Estilização Os temas Kiwify usam TailwindCSS para estilização, um framework CSS utility-first que permite estilizar elementos diretamente em sua marcação HTML/Liquid. ## Bibliotecas Disponíveis O ambiente de execução dos temas conta com as seguintes bibliotecas disponíveis para uso: * [Embla Carousel](https://www.embla-carousel.com/): para a criação de carrosseis * [Microtip](https://microtip.vercel.app/): para a exibição de tooltips Para mais informações, consulte a documentação das respectivas bibliotecas. O tema padrão da Kiwify contém exemplos de uso. ## Limitações * JavaScript não é suportado atualmente em arquivos de tema * Apenas duas páginas podem ser personalizadas (index e login) * Máximo de 25 seções por template * Máximo de 50 blocos por seção ## Saiba Mais Para informações detalhadas sobre cada componente, visite as páginas de documentação dedicadas: * [Templates](/members-area/key-concepts/theme/templates) * [Sections](/members-area/key-concepts/theme/sections) * [Locales](/members-area/key-concepts/theme/locales) * [Snippets](/members-area/key-concepts/theme/snippets) # Locales Source: https://docs.kiwify.com.br/members-area/key-concepts/theme/locales Arquivos de tradução para múltiplos idiomas # Locales A pasta locales contém arquivos de tradução para suportar múltiplos idiomas, tornando sua Área de Membros acessível para estudantes internacionais. ## Visão Geral Cada idioma tem dois arquivos: 1. **Traduções de conteúdo** (`[idioma].default.json`) - Para texto voltado ao usuário 2. **Traduções de schema** (`[idioma].schema.json`) - Para rótulos e instruções do editor de tema ## Idiomas Suportados * Português (`pt.default.json` e `pt.schema.json`) * Inglês (`en.default.json` e `en.schema.json`) * Espanhol (`es.default.json` e `es.schema.json`) Estes arquivos seguem uma estrutura fixa e não podem ser deletados ou renomeados. Todos os arquivos devem ser mantidos em sincronia ao adicionar novas chaves de tradução. ## Estrutura de Diretórios ``` locales/ ├── en.default.json ├── pt.default.json ├── es.default.json ├── en.schema.json ├── pt.schema.json └── es.schema.json ``` ## Exemplo de Tradução de Conteúdo ```json theme={null} // en.default.json { "general": { "continue": "Continue", "view_all": "View All", "completed": "Completed" }, "courses": { "progress": "Progress", "start_course": "Start Course", "continue_course": "Continue Learning" } } ``` ## Exemplo de Tradução de Schema ```json theme={null} // en.schema.json { "sections": { "banner": { "name": "Banner", "settings": { "title": { "label": "Title", "info": "Heading displayed at the top of the banner" }, "full_width": { "label": "Full Width", "info": "Extend the banner across the entire page width" } } } } } ``` ## Usando Traduções em Templates Para usar traduções em seus templates Liquid, use o filtro `t` com a chave de tradução: ```liquid theme={null} ``` A tradução apropriada será selecionada baseada na preferência de idioma do usuário. ## Tradução com Variáveis Você pode incluir variáveis em suas traduções: ```json theme={null} // en.default.json { "courses": { "progress_info": "You have completed %{completed} of %{total} lessons" } } ``` E no seu template Liquid: ```liquid theme={null}

{{ 'courses.progress_info' | t: completed: course.user_data.completion_count, total: course.total_lessons }}

``` ## Usando Tradução em Schemas Para usar traduções em seus schemas, use o prefixo `t:`: ```json theme={null} { "name": "t:sections.banner.name" } ``` ## Melhores Práticas * Use uma estrutura de nomeação consistente para chaves de tradução * Organize traduções por funcionalidade ou seção * Mantenha as traduções concisas e claras * Sempre atualize todos os arquivos de idioma ao adicionar novas chaves * Use IA ou tradutores profissionais para traduções precisas ## Comportamento de Fallback Se uma chave de tradução estiver ausente no idioma selecionado pelo usuário, o sistema tentará usar a versão em português como fallback. Se a chave estiver ausente em todos os idiomas, a própria chave será exibida. # Seções Source: https://docs.kiwify.com.br/members-area/key-concepts/theme/sections Componentes liquid reutilizáveis para conteúdo da página Seções são blocos de conteúdo reutilizáveis definidos em arquivos `.liquid`. Eles são os blocos de construção do seu tema e podem ser personalizados através do editor de tema. ## Visão Geral Seções: * São altamente personalizáveis através de parâmetros * Podem ser reutilizadas múltiplas vezes com diferentes configurações * Suportam blocos aninhados para layouts complexos * Podem ser criadas, deletadas ou renomeadas conforme necessário ## Estrutura da Seção Um arquivo de seção geralmente consiste de duas partes: 1. **Markup** - O código Liquid/HTML que renderiza a seção 2. **Schema** - Uma definição JSON que especifica as opções de personalização disponíveis no editor de tema ## Exemplo de Seção ```liquid Markup theme={null}

{{ section.settings.title }}

{% if section.settings.course_id != blank %} {% assign course = all_courses[section.settings.course_id] %} {% if course %}

{{ course.name }}

{{ course.name }}
{{ course.user_data.progress }}%
{% endif %} {% endif %}
``` ```json Schema theme={null} {% schema %} { "name": "Exibição de Curso", "settings": [ { "type": "text", "id": "title", "label": "Título da Seção", "default": "Curso em Destaque" }, { "type": "select", "id": "course_id", "label": "Selecionar Curso", "options": [ { "value": "", "label": "Nenhum" }, { "value": "course-id-1", "label": "Curso 1" }, { "value": "course-id-2", "label": "Curso 2" } ] }, { "type": "checkbox", "id": "full_width", "label": "Largura Total", "default": false } ], "presets": [ { "name": "Exibição de Curso", "settings": { "course_id": "" } } ] } {% endschema %} ```
## Componentes do Schema O bloco schema define como a seção aparece no editor de tema: * `name` - O nome de exibição no editor de tema * `settings` - Array de opções de configuração * `blocks` - Configurações de bloco opcionais * `presets` - Configurações pré-definidas para adicionar a seção * `kiwi_extra` - Configurações adicionais para o editor de tema * `icon` - Ícone a ser associado com este tipo de seção no editor de tema * `blocks_hidden_if` - Objeto representando uma condição que oculta blocos de seção dentro do editor de tema se satisfeita * `setting` - Qual configuração desta seção verificar * `value` - Valor esperado para que a seção de bloco seja ocultada ## Tipos de Configuração Consulte [Tipos de Input](/members-area/reference/schema/fields/settings/input-types/overview) para mais detalhes. * `checkbox`: Toggle booleano (verdadeiro/falso) * `course`: Dropdown populado com todos os cursos da área de membros * `image_picker`: Seleção de imagem * `module`: Grupo dropdown para selecionar um módulo de um curso da área de membros * `range`: Slider numérico * `select`: Grupo de botões toggle * `text`: Input de texto de linha única ## Blocos de Seção Blocos permitem componentes reutilizáveis e configuráveis dentro de uma seção. Eles são ideais para: * Slides em um carrossel * Itens em uma galeria * Áreas de conteúdo personalizadas Cada bloco tem seu próprio tipo e configurações: ```json theme={null} "blocks": [ { "type": "slide", "name": "Slide", "settings": [ { "type": "image_picker", "id": "image", "label": "Imagem do Slide" }, { "type": "text", "id": "alt_text", "label": "Texto Alternativo" } ] } ] ``` ## Melhores Práticas * Crie seções reutilizáveis com parâmetros claros * Use valores padrão significativos * Agrupe configurações relacionadas * Use blocos para componentes que precisam ser individualmente personalizáveis * Mantenha o markup limpo e de fácil manutenção ## Contexto Disponível nas Sections No seu código Liquid de seção, você tem acesso a: 1. O objeto `section` contendo todas as configurações do JSON do template 2. Objetos globais como [all\_courses](/members-area/reference/objects/all_courses), [all\_modules](/members-area/reference/objects/all_modules), e [all\_lessons](/members-area/reference/objects/all_lessons) 3. Helpers de tradução via filtro `t` ## Estilizando Sections Os temas Kiwify usam TailwindCSS para estilização. Este framework utility-first permite construir designs personalizados diretamente no seu markup: ```liquid theme={null}
{{ course.name }}

{{ course.name }}

``` # Snippets Source: https://docs.kiwify.com.br/members-area/key-concepts/theme/snippets Fragmentos de código reutilizáveis compartilhados entre seções # Snippets Snippets são pedaços reutilizáveis de código Liquid que ajudam a manter consistência e reduzir duplicação ao longo do seu tema. ## Visão Geral * Não são visíveis no editor de tema * Ideais para código que é repetido ao longo do seu tema * Podem ser pensados como "componentes" ou "partials" * Podem ser criados, deletados ou renomeados conforme necessário ## Criando Snippets Snippets são armazenados no diretório `snippets/` com extensão `.liquid`. Por exemplo: ```liquid theme={null}
{{ course.name }}

{{ course.name }}

{{ course.user_data.progress }}% completo

{{ button_text | default: 'Continuar Aprendendo' }}
``` ## Usando Snippets Para incluir um snippet em uma seção ou outro snippet, use a tag `render`: ```liquid theme={null} {% for course_id in all_courses %} {% assign course = all_courses[course_id] %} {% render 'course-card', course: course, button_text: 'Ver Curso' %} {% endfor %} ``` ## Passando Variáveis para Snippets Você pode passar variáveis para snippets ao renderizá-los: ```liquid theme={null} {% render 'course-card', course: course, button_text: 'Começar a Aprender', show_progress: false %} ``` Dentro do snippet, essas variáveis estão disponíveis como variáveis locais: ```liquid theme={null}

{{ course.name }}

{% if show_progress %}
{% endif %} {{ button_text }}
``` ## Valores Padrão Você pode fornecer valores padrão para variáveis de snippet usando o filtro `default`: ```liquid theme={null} {{ button_text | default: 'Ver Curso' }} ``` ## Casos de Uso Comuns para Snippets * Botões * Cards * Elementos de navegação * Barras de progresso * Listagens de cursos * Layouts de módulos * Previews de aulas * Exibições de informações do usuário ## Exemplo: Snippet de Imagem Um snippet para renderizar imagens consistentemente com carregamento lazy opcional: ```liquid theme={null} {{ alt | escape }} ``` Uso: ```liquid theme={null} {% render 'image', src: product.image, alt: product.title, class: 'rounded shadow', width: 300, height: 200, lazy_load: true %} ``` ## Melhores Práticas * Crie snippets para componentes usados em múltiplos lugares * Passe variáveis para snippets para flexibilidade * Use convenções de nomenclatura consistentes * Mantenha snippets focados em uma única responsabilidade * Documente as variáveis esperadas para cada snippet * Use valores padrão para parâmetros opcionais # Templates Source: https://docs.kiwify.com.br/members-area/key-concepts/theme/templates Arquivos JSON que definem a estrutura e conteúdo da página # Templates Templates definem a estrutura das páginas na sua Área de Membros. Eles servem como armazenamento de dados para o editor de tema visual e determinam quais seções aparecem em uma página. ## Templates Disponíveis Atualmente, apenas duas páginas podem ser personalizadas: * **Página de login** (`login.json`) - A página de autenticação * **Página inicial** (`index.json`) - A página do painel principal Estes arquivos seguem uma estrutura fixa e não podem ser deletados ou renomeados. Você também não pode criar novas páginas nesta pasta. ## Formato de Template Templates são arquivos JSON com um schema específico: ```json theme={null} { "order": ["section-id-1", "section-id-2", "section-id-3"], "sections": { "section-id-1": { "type": "banner", "settings": { // Configurações da seção }, "blocks": { // Blocos opcionais dentro da seção }, "block_order": ["block-id-1", "block-id-2"] }, "section-id-2": { "type": "modules", "settings": { // Configurações da seção } } // Seções adicionais... } } ``` | Propriedade | Tipo | Descrição | | -------------------------- | ------ | ------------------------------------------------------------------ | | `order` | Array | Lista de IDs de seção na ordem de renderização | | `sections` | Object | Mapa de IDs de seção para configurações de seção | | `sections[id].type` | String | O tipo de seção (deve corresponder ao nome de um arquivo de seção) | | `sections[id].settings` | Object | Valores de configuração para a seção | | `sections[id].blocks` | Object | Blocos opcionais dentro da seção | | `sections[id].block_order` | Array | Ordem dos blocos dentro da seção | ```json theme={null} { "order": ["banner", "featured-modules", "continue-watching"], "sections": { "banner": { "type": "banner", "settings": { "slides_delay": 5 }, "blocks": { "slide-1": { "id": "slide-1", "type": "slide", "settings": { "banner_type": "image", "mobile_image": "https://example.com/mobile.jpg", "desktop_image": "https://example.com/desktop.jpg" } } }, "block_order": ["slide-1"] }, "featured-modules": { "type": "modules", "settings": { "external_section_id": "featured-modules", "items_variant": "content_over", "title": "Uma seção pode conter módulos", "course_id": "course-id-example" } }, "continue-watching": { "type": "continue_watching", "settings": { "external_section_id": "continue-watching", "items_variant": "content_over", "margin_top": 20 } } } } ``` ## Limitações * Templates são arquivos auto-gerados que podem ser editados tanto pelo editor de código quanto pelo editor de tema * Cada template pode renderizar até 25 seções * Cada seção pode ter até 50 blocos ## Como os Templates Funcionam Quando você edita um template no editor de tema: 1. O editor de tema lê o arquivo JSON do template 2. Ele renderiza controles de UI baseados nos schemas das seções 3. Quaisquer mudanças que você fizer são salvas de volta no arquivo JSON 4. A página é re-renderizada com suas mudanças Você também pode editar estes arquivos diretamente no editor de código clicando no botão "Editor de Código". # Visão Geral Source: https://docs.kiwify.com.br/members-area/reference/filters Filtros são usados para modificar a saída de variáveis e outros valores. Filtros modificam a saída de números, strings, variáveis, objetos e arrays. Um filtro é aplicado usando um caractere pipe (`|`) seguido pelo nome do filtro: ```liquid theme={null} {{ variable | filter }} ``` Você pode encadear múltiplos filtros juntos, aplicando um após o outro: ```liquid theme={null} {{ "olá mundo" | capitalize | upcase }} ``` Alguns filtros podem receber argumentos que são especificados após um caractere dois pontos (`:`): ```liquid theme={null} {{ "olá mundo" | truncate: 5 }} ``` Consulte a documentação detalhada para cada filtro nas seguintes seções: Filtros para trabalhar com arrays e coleções Filtros para manipular texto e strings Filtros para trabalhar com conteúdo HTML Filtros para operações matemáticas Filtros para trabalhar com datas e horários Outros filtros úteis Para documentação completa, consulte a [documentação do LiquidJS](https://liquidjs.com/filters/overview.html). # Filtros de array Source: https://docs.kiwify.com.br/members-area/reference/filters/array Filtros de array para trabalhar com coleções em templates Liquid. ## `first` Retorna o primeiro item de um array. ```liquid Código theme={null} {{ "Ground control to Major Tom." | split: " " | first }} ``` ```liquid Saída theme={null} Ground ``` ```liquid Código theme={null} {% assign my_array = "zebra, polvo, girafa, tigre" | split: ", " %} {{ my_array.first }} ``` ```liquid Saída theme={null} zebra ``` Você pode usar `first` com notação de ponto quando precisar usar o filtro dentro de uma tag: ```liquid theme={null} {% if my_array.first == "zebra" %} Aqui vem uma zebra! {% endif %} ``` ## `last` Retorna o último item de um array. ```liquid Código theme={null} {{ "Ground control to Major Tom." | split: " " | last }} ``` ```liquid Saída theme={null} Tom. ``` ```liquid Código theme={null} {% assign my_array = "zebra, polvo, girafa, tigre" | split: ", " %} {{ my_array.last }} ``` ```liquid Saída theme={null} tigre ``` Você pode usar `last` com notação de ponto quando precisar usar o filtro dentro de uma tag: ```liquid theme={null} {% if my_array.last == "tigre" %} Lá vai um tigre! {% endif %} ``` ## `join` Combina os itens de um array em uma única string usando o argumento como separador. ```liquid Código theme={null} {% assign beatles = "John, Paul, George, Ringo" | split: ", " %} {{ beatles | join: " e " }} ``` ```liquid Saída theme={null} John e Paul e George e Ringo ``` ## `reverse` Inverte a ordem dos itens em um array. `reverse` não pode inverter uma string. ```liquid Código theme={null} {% assign my_array = "maçãs, laranjas, pêssegos, ameixas" | split: ", " %} {{ my_array | reverse | join: ", " }} ``` ```liquid Saída theme={null} ameixas, pêssegos, laranjas, maçãs ``` Embora `reverse` não possa ser usado diretamente em uma string, você pode dividir uma string em um array, inverter o array e juntá-lo novamente encadeando filtros: ```liquid Código theme={null} {{ "Ground control to Major Tom." | split: "" | reverse | join: "" }} ``` ```liquid Saída theme={null} .moT rojaM ot lortnoc dnuorG ``` ## `size` Retorna o número de caracteres em uma string ou o número de itens em um array. ```liquid Código theme={null} {{ "Ground control to Major Tom." | size }} ``` ```liquid Saída theme={null} 28 ``` ```liquid Código theme={null} {% assign my_array = "maçãs, laranjas, pêssegos, ameixas" | split: ", " %} {{ my_array.size }} ``` ```liquid Saída theme={null} 4 ``` Você pode usar `size` com notação de ponto quando precisar usar o filtro dentro de uma tag: ```liquid theme={null} {% if site.pages.size > 10 %} Este é um website grande! {% endif %} ``` ## `sort` Classifica itens em um array em ordem sensível a maiúsculas e minúsculas. ```liquid Código theme={null} {% assign my_array = "zebra, polvo, girafa, Sara Serpente" | split: ", " %} {{ my_array | sort | join: ", " }} ``` ```liquid Saída theme={null} Sara Serpente, girafa, polvo, zebra ``` Um argumento opcional especifica qual propriedade dos itens do array usar para classificação. ```liquid theme={null} {% assign products_by_price = collection.products | sort: "price" %} {% for product in products_by_price %}

{{ product.title }}

{% endfor %} ``` ## `sort_natural` Classifica itens em um array em ordem insensível a maiúsculas e minúsculas. ```liquid Código theme={null} {% assign my_array = "zebra, polvo, girafa, Sara Serpente" | split: ", " %} {{ my_array | sort_natural | join: ", " }} ``` ```liquid Saída theme={null} girafa, polvo, Sara Serpente, zebra ``` Um argumento opcional especifica qual propriedade dos itens do array usar para classificação. ```liquid theme={null} {% assign products_by_company = collection.products | sort_natural: "company" %} {% for product in products_by_company %}

{{ product.title }}

{% endfor %} ``` ## `map` Cria um array de valores extraindo os valores de uma propriedade nomeada de outro objeto. Neste exemplo, assumimos que o objeto `site.pages` contém todos os metadados de um website. Usando `assign` com o filtro `map` cria uma variável que contém apenas os valores das propriedades `category` de tudo no objeto `site.pages`. ```liquid Código theme={null} {% assign all_categories = site.pages | map: "category" %} {% for item in all_categories %} - {{ item }} {% endfor %} ``` ```liquid Saída theme={null} - negócios - celebridades - estilo de vida - esportes - tecnologia ``` ## `concat` Concatena (junta) múltiplos arrays. O array resultante contém todos os itens dos arrays de entrada. ```liquid Código theme={null} {% assign fruits = "maçãs, laranjas, pêssegos" | split: ", " %} {% assign vegetables = "cenouras, nabos, batatas" | split: ", " %} {% assign everything = fruits | concat: vegetables %} {% for item in everything %} - {{ item }} {% endfor %} ``` ```liquid Saída theme={null} - maçãs - laranjas - pêssegos - cenouras - nabos - batatas ``` Você pode encadear filtros `concat` para juntar mais de dois arrays: ```liquid Código theme={null} {% assign furniture = "cadeiras, mesas, prateleiras" | split: ", " %} {% assign everything = fruits | concat: vegetables | concat: furniture %} {% for item in everything %} - {{ item }} {% endfor %} ``` ```liquid Saída theme={null} - maçãs - laranjas - pêssegos - cenouras - nabos - batatas - cadeiras - mesas - prateleiras ``` ## `uniq` Remove qualquer elemento duplicado em um array. ```liquid Código theme={null} {% assign my_array = "formigas, insetos, abelhas, insetos, formigas" | split: ", " %} {{ my_array | uniq | join: ", " }} ``` ```liquid Saída theme={null} formigas, insetos, abelhas ``` ## `where` Cria um array incluindo apenas os objetos com um valor de propriedade específico, ou qualquer valor verdadeiro por padrão. Neste exemplo, suponha que você tem uma lista de produtos e quer mostrar seus produtos de cozinha separadamente. Usando `where`, você pode criar um array contendo apenas os produtos que têm um `"type"` de `"kitchen"`. ```liquid Código theme={null} Todos os produtos: {% for product in products %} - {{ product.title }} {% endfor %} {% assign kitchen_products = products | where: "type", "kitchen" %} Produtos de cozinha: {% for product in kitchen_products %} - {{ product.title }} {% endfor %} ``` ```liquid Saída theme={null} Todos os produtos: - Aspirador - Espátula - Televisão - Espremedor de alho Produtos de cozinha: - Espátula - Espremedor de alho ``` Digamos que em vez disso você tenha uma lista de produtos e só queira mostrar aqueles que estão disponíveis para compra. Você pode usar `where` com um nome de propriedade mas sem valor de destino para incluir todos os produtos com um valor `"available"` verdadeiro. Como caso especial, o mesmo acontecerá se o valor de destino for fornecido mas avaliado como `undefined`. ```liquid Código theme={null} Todos os produtos: {% for product in products %} - {{ product.title }} {% endfor %} {% assign available_products = products | where: "available" %} Produtos disponíveis: {% for product in available_products %} - {{ product.title }} {% endfor %} ``` ```liquid Saída theme={null} Todos os produtos: - Caneca de café - Tênis edição limitada - Tênis básico Produtos disponíveis: - Caneca de café - Tênis básico ``` O filtro `where` também pode ser usado para encontrar um único objeto em um array quando combinado com o filtro `first`. Por exemplo, digamos que você queira destacar a camisa da sua nova coleção de outono. ```liquid Código theme={null} {% assign new_shirt = products | where: "type", "shirt" | first %} Produto em destaque: {{ new_shirt.title }} ``` ```liquid Saída theme={null} Produto em destaque: Colete de tricô estampado havaiano ``` Além disso, `property` pode ser qualquer expressão de variável Liquid válida como usada na sintaxe de saída, exceto que o escopo desta expressão está dentro de cada item. Para o seguinte array `products`: ```javascript theme={null} const products = [ { meta: { details: { class: 'A' } }, order: 1 }, { meta: { details: { class: 'B' } }, order: 2 }, { meta: { details: { class: 'B' } }, order: 3 } ] ``` ```liquid Código theme={null} {% assign selected = products | where: 'meta.details["class"]', "B" %} {% for item in selected -%} - {{ item.order }} {% endfor %} ``` ```liquid Saída theme={null} - 2 - 3 ``` ## `slice` Retorna uma substring de 1 caractere começando no índice especificado pelo primeiro argumento. Um segundo argumento opcional especifica o comprimento da substring a ser retornada. Os índices de string são numerados começando do 0. ```liquid Código theme={null} {{ "Liquid" | slice: 0 }} ``` ```liquid Saída theme={null} L ``` ```liquid Código theme={null} {{ "Liquid" | slice: 2 }} ``` ```liquid Saída theme={null} q ``` ```liquid Código theme={null} {{ "Liquid" | slice: 2, 5 }} ``` ```liquid Saída theme={null} quid ``` Se o primeiro argumento for um número negativo, os índices são contados a partir do final da string: ```liquid Código theme={null} {{ "Liquid" | slice: -3, 2 }} ``` ```liquid Saída theme={null} ui ``` ## `where_exp` Seleciona todos os objetos em um array onde a expressão é verdadeira. Neste exemplo, suponha que você tem uma lista de produtos e quer mostrar seus produtos de cozinha separadamente. Usando `where_exp`, você pode criar um array contendo apenas os produtos que têm um `"type"` de `"kitchen"`. ```liquid Código theme={null} Todos os produtos: {% for product in products %} - {{ product.title }} {% endfor %} {% assign kitchen_products = products | where_exp: "item", "item.type == 'kitchen'" %} Produtos de cozinha: {% for product in kitchen_products %} - {{ product.title }} {% endfor %} ``` ```liquid Saída theme={null} Todos os produtos: - Aspirador - Espátula - Televisão - Espremedor de alho Produtos de cozinha: - Espátula - Espremedor de alho ``` ## `find` Retorna o primeiro objeto em um array para o qual o atributo consultado tem o valor dado ou retorna `nil` se nenhum item no array satisfizer os critérios dados. Para o seguinte array `members`: ```javascript theme={null} const members = [ { graduation_year: 2013, name: 'Jay' }, { graduation_year: 2014, name: 'John' }, { graduation_year: 2014, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | find: "graduation_year", 2014 | json }} ``` ```liquid Saída theme={null} {"graduation_year":2014,"name":"John"} ``` ## `find_exp` Retorna o primeiro objeto em um array para o qual a expressão dada avalia como verdadeira ou retorna `nil` se nenhum item no array satisfizer a expressão avaliada. ```javascript theme={null} const members = [ { graduation_year: 2013, name: 'Jay' }, { graduation_year: 2014, name: 'John' }, { graduation_year: 2014, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | find_exp: "item", "item.graduation_year == 2014" | json }} ``` ```liquid Saída theme={null} {"graduation_year":2014,"name":"John"} ``` ## `find_index` Retorna o índice baseado em 0 do primeiro objeto em um array para o qual o atributo consultado tem o valor dado ou retorna `nil` se nenhum item no array satisfizer os critérios dados. Para o seguinte array `members`: ```javascript theme={null} const members = [ { graduation_year: 2013, name: 'Jay' }, { graduation_year: 2014, name: 'John' }, { graduation_year: 2014, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | find_index: "graduation_year", 2014 | json }} ``` ```liquid Saída theme={null} 1 ``` ## `find_index_exp` Retorna o índice baseado em 0 do primeiro objeto em um array para o qual a expressão dada avalia como verdadeira ou retorna `nil` se nenhum item no array satisfizer a expressão avaliada. ```javascript theme={null} const members = [ { graduation_year: 2013, name: 'Jay' }, { graduation_year: 2014, name: 'John' }, { graduation_year: 2014, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | find_index_exp: "item", "item.graduation_year == 2014" | json }} ``` ```liquid Saída theme={null} 1 ``` ## `group_by` Agrupa os itens de um array por uma propriedade dada. Para o array `members`: ```javascript theme={null} const members = [ { graduation_year: 2003, name: 'Jay' }, { graduation_year: 2003, name: 'John' }, { graduation_year: 2004, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | group_by: "graduation_year" | json: 2 }} ``` ```liquid Saída theme={null} [ { "name": 2003, "items": [ { "graduation_year": 2003, "name": "Jay" }, { "graduation_year": 2003, "name": "John" } ] }, { "name": 2004, "items": [ { "graduation_year": 2004, "name": "Jack" } ] } ] ``` ## `group_by_exp` Agrupa os itens de um array usando uma expressão Liquid. Para o array `members` abaixo: ```javascript theme={null} const members = [ { graduation_year: 2013, name: 'Jay' }, { graduation_year: 2014, name: 'John' }, { graduation_year: 2009, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | group_by_exp: "item", "item.graduation_year | truncate: 3, ''" | json: 2 }} ``` ```liquid Saída theme={null} [ { "name": "201", "items": [ { "graduation_year": 2013, "name": "Jay" }, { "graduation_year": 2014, "name": "John" } ] }, { "name": "200", "items": [ { "graduation_year": 2009, "name": "Jack" } ] } ] ``` ## `has` Retorna `true` se o array incluir um item para o qual o atributo consultado tem o valor dado ou retorna `false` se nenhum item no array satisfizer os critérios dados. Para o seguinte array `members`: ```javascript theme={null} const members = [ { graduation_year: 2013, name: 'Jay' }, { graduation_year: 2014, name: 'John' }, { graduation_year: 2014, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | has: "graduation_year", 2014 | json }} ``` ```liquid Saída theme={null} true ``` ## `has_exp` Retorna `true` se um item existir em um array para o qual a expressão dada avalia como verdadeira ou retorna `false` se nenhum item no array satisfizer a expressão avaliada. ```javascript theme={null} const members = [ { graduation_year: 2013, name: 'Jay' }, { graduation_year: 2014, name: 'John' }, { graduation_year: 2014, name: 'Jack' } ] ``` ```liquid Código theme={null} {{ members | has_exp: "item", "item.graduation_year == 2014" | json }} ``` ```liquid Saída theme={null} true ``` ## `compact` Remove quaisquer valores `nil` de um array. Para este exemplo, suponha que `site.pages` é um array de páginas de conteúdo para um website, e algumas dessas páginas têm um atributo chamado `category` que especifica sua categoria de conteúdo. Se nós mapearmos essas categorias para um array, alguns dos itens do array podem ser `nil` se alguma página não tiver um atributo `category`. ```liquid Código theme={null} {% assign site_categories = site.pages | map: "category" %} {% for category in site_categories %} - {{ category }} {% endfor %} ``` ```liquid Saída theme={null} - negócios - celebridades - - estilo de vida - esportes - - tecnologia ``` Ao usar `compact` quando criamos nosso array `site_categories`, podemos remover todos os valores `nil` no array. ```liquid Código theme={null} {% assign site_categories = site.pages | map: "category" | compact %} {% for category in site_categories %} - {{ category }} {% endfor %} ``` ```liquid Saída theme={null} - negócios - celebridades - estilo de vida - esportes - tecnologia ``` ## `push` Adiciona um elemento no array. É NÃO-DESTRUTIVO, ou seja, não modifica o array, mas sim faz uma cópia e modifica essa cópia. ```liquid Código theme={null} {% assign fruits = "maçãs, laranjas" | split: ", " %} {% assign everything = fruits | push: "pêssegos" %} {% for item in everything %} - {{ item }} {% endfor %} ``` ```liquid Saída theme={null} - maçãs - laranjas - pêssegos ``` ## `pop` Remove um elemento do array. É NÃO-DESTRUTIVO, ou seja, não modifica o array, mas sim faz uma cópia e modifica essa cópia. ```liquid Código theme={null} {% assign fruits = "maçãs, laranjas, pêssegos" | split: ", " %} {% assign everything = fruits | pop %} {% for item in everything %} - {{ item }} {% endfor %} ``` ```liquid Saída theme={null} - maçãs - laranjas ``` ## `shift` Remove um elemento do início do array. É NÃO-DESTRUTIVO, ou seja, não modifica o array, mas sim faz uma cópia e modifica essa cópia. ```liquid Código theme={null} {% assign fruits = "maçãs, laranjas, pêssegos" | split: ", " %} {% assign everything = fruits | shift %} {% for item in everything %} - {{ item }} {% endfor %} ``` ```liquid Saída theme={null} - laranjas - pêssegos ``` ## `unshift` Adiciona um elemento no início do array. É NÃO-DESTRUTIVO, ou seja, não modifica o array, mas sim faz uma cópia e modifica essa cópia. ```liquid Código theme={null} {% assign fruits = "laranjas, pêssegos" | split: ", " %} {% assign everything = fruits | unshift: "maçãs" %} {% for item in everything %} - {{ item }} {% endfor %} ``` ```liquid Saída theme={null} - maçãs - laranjas - pêssegos ``` ## `reject` Cria um array excluindo os objetos com um valor de propriedade específico, ou excluindo valores verdadeiros por padrão quando uma propriedade não é fornecida. Neste exemplo, suponha que você tem uma lista de produtos e quer filtrar produtos de cozinha. Usando `reject`, você pode criar um array excluindo apenas os produtos que têm um `"type"` de `"kitchen"`. ```liquid Código theme={null} Todos os produtos: {% for product in products %} - {{ product.title }} {% endfor %} {% assign non_kitchen_products = products | reject: "type", "kitchen" %} Produtos de cozinha: {% for product in non_kitchen_products %} - {{ product.title }} {% endfor %} ``` ```liquid Saída theme={null} Todos os produtos: - Aspirador - Espátula - Televisão - Espremedor de alho Produtos de cozinha: - Aspirador - Televisão ``` Digamos que em vez disso você tenha uma lista de produtos e queira excluir produtos tributáveis. Você pode usar `reject` com um nome de propriedade mas sem valor de destino para rejeitar todos os produtos com um valor `"taxable"` verdadeiro. ```liquid Código theme={null} Todos os produtos: {% for product in products %} - {{ product.title }} {% endfor %} {% assign not_taxed_products = products | reject: "taxable" %} Produtos disponíveis: {% for product in not_taxed_products %} - {{ product.title }} {% endfor %} ``` ```liquid Saída theme={null} Todos os produtos: - Aspirador - Espátula - Televisão - Espremedor de alho Produtos disponíveis: - Espátula - Televisão ``` Além disso, `property` pode ser qualquer expressão de variável Liquid válida como usada na sintaxe de saída, exceto que o escopo desta expressão está dentro de cada item. Para o seguinte array `products`: ```javascript theme={null} const products = [ { meta: { details: { class: 'A' } }, order: 1 }, { meta: { details: { class: 'B' } }, order: 2 }, { meta: { details: { class: 'B' } }, order: 3 } ] ``` ```liquid Código theme={null} {% assign selected = products | reject: 'meta.details["class"]', "B" %} {% for item in selected -%} - {{ item.order }} {% endfor %} ``` ```liquid Saída theme={null} - 1 ``` ## `reject_exp` Seleciona todos os objetos em um array onde a expressão é falsa. Neste exemplo, suponha que você tem uma lista de produtos e quer esconder seus produtos de cozinha. Usando `reject_exp`, você pode criar um array que omite apenas os produtos que têm um `"type"` de `"kitchen"`. ```liquid Código theme={null} Todos os produtos: {% for product in products %} - {{ product.title }} {% endfor %} {% assign non_kitchen_products = products | reject_exp: "item", "item.type == 'kitchen'" %} Produtos de cozinha: {% for product in non_kitchen_products %} - {{ product.title }} {% endfor %} ``` ```liquid Saída theme={null} Todos os produtos: - Aspirador - Espátula - Televisão - Espremedor de alho Produtos de cozinha: - Aspirador - Televisão ``` # Filtros de data Source: https://docs.kiwify.com.br/members-area/reference/filters/date Filtros de data para formatar datas em templates Liquid. ## `date` O filtro de data é usado para converter um timestamp no formato especificado. * LiquidJS tenta estar em conformidade com Shopify/Liquid, que usa o core do Ruby [Time###strftime(string)](https://www.ruby-doc.org/core/Time.html#method-i-strftime). Há diferenças com [as flags de formato do Ruby](https://ruby-doc.org/core/strftime_formatting_rdoc.html): * `%Z` (desde v10.11.1) é substituído pelo nome de timezone passado de `LiquidOption` ou valor in-place (veja TimeZone abaixo). Se o timezone passado for um número de offset em vez de string, se comportará como `%z`. Se não há timezone passado, retorna [o fuso horário padrão do runtime](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/resolvedOptions###timezone). * LiquidJS fornece uma flag adicional `%q` para ordinais de data. ex. \`\` => `02nd of Feb` * Literais de data são primeiro convertidos para objeto `Date` via new Date(), isso significa que valores literais são considerados no fuso horário do runtime por padrão. * O argumento de filtro de formato é opcional: * Se não fornecido, o padrão é `%A, %B %-e, %Y at %-l:%M %P %z`. * O padrão acima pode ser sobrescrito pela opção [`dateFormat`](/api/interfaces/LiquidOptions.html###dateFormat) do LiquidJS. * LiquidJS `date` suporta nomes de dias da semana e meses específicos do locale, que voltará para inglês onde `Intl` não é suportado. * Ordinais (`%q`) e filtros de data específicos do Jekyll são apenas em inglês. * [`locale`](/api/interfaces/LiquidOptions.html###locale) pode ser definido ao criar instância Liquid. Padrão é `Intl.DateTimeFormat().resolvedOptions.locale`). #### Examples ```liquid Código theme={null} {{ article.published_at | date: '%a, %b %d, %y' }} {{ "now" | date: "%Y-%m-%d %H:%M" }} {{ '1990-12-31T23:30:28Z' | date: '%d%q of %b %Y at %I:%M %P %Z', -330 }} ``` ```liquid Saída theme={null} Fri, Jul 17, 15 2020-03-25 15:57 01st of Jan 1991 at 05:00 am +0530; ``` ### TimeZone * Durante a saída, LiquidJS usa timezone local que pode ser sobrescrito por: * definir um timezone in-place ao chamar filtro `date`, ou * definir a opção [`timezoneOffset`](/api/interfaces/LiquidOptions.html###timezoneOffset) do LiquidJS * O padrão é o do runtime. * Offset pode ser definido como, * minutos: `-360` significa `'+06:00'` e `360` significa `'-06:00'` * ID de timeZone: `Asia/Colombo` ou `America/New_York` * Veja [aqui](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) para valores do banco de dados TZ #### Examples ```liquid Código theme={null} {{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", 360 }} {{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", "Asia/Colombo" }} ``` ```liquid Saída theme={null} 1990-12-31T17:00:00 1991-01-01T04:30:00 ``` ### Input * `date` funciona em strings se elas contêm datas bem formatadas * Note que LiquidJS está usando JavaScript Date para analisar a string de entrada, isso significa que [timestamps RFC 2822 compatíveis com IETF](https://datatracker.ietf.org/doc/html/rfc2822###page-14) e strings em [uma versão do ISO8601](https://www.ecma-international.org/ecma-262/11.0/#sec-date.parse) são suportados. #### Examples ```liquid Código theme={null} {{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", 360 }} {{ "March 14, 2016" | date: "%b %d, %y" }} ``` ```liquid Saída theme={null} 1990-12-31T17:00:00 Mar 14, 16 ``` ### Data Atual * Para obter a hora atual, passe a palavra especial `"now"` ou `"today"` como entrada * Note que o valor será a hora atual de quando a página foi gerada pela última vez a partir do template, não quando a página é apresentada a um usuário se cache ou geração de site estático estiver envolvido #### Example ```liquid Código theme={null} Last updated on: {{ "now" | date: "%Y-%m-%d %H:%M" }} Last updated on: {{ "today" | date: "%Y-%m-%d %H:%M" }} ``` ```liquid Saída theme={null} Last updated on: 2020-03-25 15:57 Last updated on: 2020-03-25 15:57 ``` ## `date_to_string` Converte uma data para formato curto. Igual ao filtro `date_to_string` do Jekyll. ```liquid Código theme={null} {{ site.time | date_to_string }} ``` ```liquid Saída theme={null} 07 Nov 2008 ``` ```liquid Código theme={null} {{ site.time | date_to_string: "ordinal", "US" }} ``` ```liquid Saída theme={null} Nov 7th, 2008 ``` Note que JavaScript `Date` não tem informação de timezone, veja filtro de data para detalhes. ## `date_to_long_string` Converte uma data para formato longo. Igual ao filtro `date_to_long_string` do Jekyll. ```liquid Código theme={null} {{ site.time | date_to_long_string }} ``` ```liquid Saída theme={null} 07 November 2008 ``` ```liquid Código theme={null} {{ site.time | date_to_long_string: "ordinal" }} ``` ```liquid Saída theme={null} 7th November 2008 ``` Note que JavaScript `Date` não tem informação de timezone, veja filtro de data para detalhes. ## `date_to_xmlschema` Converte uma Data para formato XML Schema (ISO 8601), igual ao filtro `date_to_xmlschema` do Jekyll. ```liquid Código theme={null} {{ site.time | date_to_xmlschema }} ``` ```liquid Saída theme={null} 2008-11-07T13:07:54-08:00 ``` Note que JavaScript `Date` não tem informação de timezone, veja filtro de data para detalhes. ## `date_to_rfc822` Converte uma Data para o formato RFC-822 usado para feeds RSS, igual ao filtro `date_to_rfc822` do Jekyll. ```liquid Código theme={null} {{ site.time | date_to_rfc822 }} ``` ```liquid Saída theme={null} Mon, 07 Nov 2008 13:07:54 -0800 ``` Note que JavaScript `Date` não tem informação de timezone, veja filtro de data para detalhes. # Filtros HTML Source: https://docs.kiwify.com.br/members-area/reference/filters/html Filtros HTML para trabalhar com conteúdo HTML e URI em templates Liquid. ## `escape` Escapa uma string substituindo caracteres HTML especiais por sequências de escape. Não altera strings que não têm nada para escapar. ```liquid Código theme={null} {{ "Have you read 'James & the Giant Peach'?" | escape }} ``` ```liquid Saída theme={null} Have you read 'James & the Giant Peach'? ``` ```liquid Código theme={null} {{ "Tetsuro Takara" | escape }} ``` ```liquid Saída theme={null} Tetsuro Takara ``` ## `escape_once` Escapa uma string sem alterar entidades escapadas existentes. Não altera strings que não têm nada para escapar. ```liquid Código theme={null} {{ "1 < 2 & 3" | escape_once }} ``` ```liquid Saída theme={null} 1 < 2 & 3 ``` ```liquid Código theme={null} {{ "{{"1 < 2 & 3" | escape}}" | escape_once }} ``` ```liquid Saída theme={null} 1 < 2 & 3 ``` ## `strip_html` Remove quaisquer tags HTML de uma string. ```liquid Código theme={null} {{ "Have you read Ulysses?" | strip_html }} ``` ```liquid Saída theme={null} Have you read Ulysses? ``` ## `newline_to_br` Substitui toda quebra de linha (`\n`) em uma string por uma quebra de linha HTML (\`\`). ```liquid Código theme={null} {% capture string_with_newlines %} Hello there {% endcapture %} {{ string_with_newlines | newline_to_br }} ``` ```liquid Saída theme={null}
Hello
there
```
## `url_encode` Converte quaisquer caracteres inseguros para URL em uma string em caracteres codificados por porcentagem. ```liquid Código theme={null} {{ "john@liquid.com" | url_encode }} ``` ```liquid Saída theme={null} john%40liquid.com ``` ```liquid Código theme={null} {{ "Tetsuro Takara" | url_encode }} ``` ```liquid Saída theme={null} Tetsuro+Takara ``` ## `url_decode` Decodifica uma string que foi codificada como URL. ```liquid Código theme={null} {{ "%27Stop%21%27+said+Fred" | url_decode }} ``` ```liquid Saída theme={null} 'Stop!' said Fred ``` ## `xml_escape` Escapa algum texto para uso em XML. ```liquid Código theme={null} {{ "Have you read \'James & the Giant Peach\'?" | xml_escape }} ``` ```liquid Saída theme={null} Have you read 'James & the Giant Peach'? ``` ## `cgi_escape` CGI escapa uma string para uso em URL. Substitui quaisquer caracteres especiais por substituições `%XX` apropriadas. CGI escape normalmente substitui um espaço por um sinal de mais `+`. ```liquid Código theme={null} {{ "foo, bar; baz?" | cgi_escape }} ``` ```liquid Saída theme={null} foo%2C+bar%3B+baz%3F ``` ## `uri_escape` Codifica por porcentagem quaisquer caracteres especiais em uma URI. URI escape normalmente substitui um espaço por `%20`. Caracteres reservados não serão escapados. ```liquid Código theme={null} {{ "https://example.com/?q=foo, \bar?" | uri_escape }} ``` ```liquid Saída theme={null} https://example.com/?q=foo,%20%5Cbar? ``` ## `slugify` Converte uma string em um "slug" de URL em minúsculas. O filtro slugify aceita 2 opções: 1. `mode: string`. O padrão é `"default"`. Eles são os seguintes (com o que filtram): * `"none"`: nenhum caractere * `"raw"`: espaços * `"default"`: espaços e caracteres não alfanuméricos * `"pretty"`: espaços e caracteres não alfanuméricos exceto por `._~!$&'()+,;=@` * `"ascii"`: espaços, caracteres não alfanuméricos e não ASCII * `"latin"`: como padrão, exceto que caracteres latinos são primeiro transliterados (ex. àèïòü para aeiou). 2. `case: boolean`. O padrão é `false`. O caso original do slug será mantido se definido como `true`. ```liquid Código theme={null} {{ "The _config.yml file" | slugify }} ``` ```liquid Saída theme={null} the-config-yml-file ``` ```liquid Código theme={null} {{ "The _config.yml file" | slugify: "pretty" }} ``` ```liquid Saída theme={null} the-_config.yml-file ``` ```liquid Código theme={null} {{ "The _cönfig.yml file" | slugify: "ascii" }} ``` ```liquid Saída theme={null} the-c-nfig-yml-file ``` ```liquid Código theme={null} {{ "The cönfig.yml file" | slugify: "latin" }} ``` ```liquid Saída theme={null} the-config-yml-file ``` ```liquid Código theme={null} {{ "The cönfig.yml file" | slugify: "latin", true }} ``` ```liquid Saída theme={null} The-config-yml-file ``` # Filtros matemáticos Source: https://docs.kiwify.com.br/members-area/reference/filters/math Filtros matemáticos para realizar operações aritméticas em templates Liquid. ## `plus` Adiciona um número a outro número. ```liquid Código theme={null} {{ 4 | plus: 2 }} ``` ```liquid Saída theme={null} 6 ``` ```liquid Código theme={null} {{ 16 | plus: 4 }} ``` ```liquid Saída theme={null} 20 ``` ```liquid Código theme={null} {{ 183.357 | plus: 12 }} ``` ```liquid Saída theme={null} 195.357 ``` ## `minus` Subtrai um número de outro número. ```liquid Código theme={null} {{ 4 | minus: 2 }} ``` ```liquid Saída theme={null} 2 ``` ```liquid Código theme={null} {{ 16 | minus: 4 }} ``` ```liquid Saída theme={null} 12 ``` ```liquid Código theme={null} {{ 183.357 | minus: 12 }} ``` ```liquid Saída theme={null} 171.357 ``` ## `times` Multiplica um número por outro número. ```liquid Código theme={null} {{ 3 | times: 2 }} ``` ```liquid Saída theme={null} 6 ``` ```liquid Código theme={null} {{ 24 | times: 7 }} ``` ```liquid Saída theme={null} 168 ``` ```liquid Código theme={null} {{ 183.357 | times: 12 }} ``` ```liquid Saída theme={null} 2200.284 ``` ## `divided_by` Divide um número por outro número. O resultado é a string obtida pelo `.toString()` do JavaScript do número resultante. ```liquid Código theme={null} {{ 16 | divided_by: 4 }} ``` ```liquid Saída theme={null} 4 ``` ```liquid Código theme={null} {{ 5 | divided_by: 3 }} ``` ```liquid Saída theme={null} 1.6666666666666667 ``` Em JavaScript, float e integer compartilham o mesmo tipo `number` e não podemos distinguir a diferença. Por exemplo: ```javascript theme={null} // always true 5.0 === 5 ``` Você precisará passar outro argumento `integerArithmetic` para forçar divisão inteira: ```liquid Código theme={null} {{ 5 | divided_by: 3, true }} ``` ```liquid Saída theme={null} 1 ``` ## `modulo` Retorna o resto de uma operação de divisão. ```liquid Código theme={null} {{ 3 | modulo: 2 }} ``` ```liquid Saída theme={null} 1 ``` ```liquid Código theme={null} {{ 24 | modulo: 7 }} ``` ```liquid Saída theme={null} 3 ``` ```liquid Código theme={null} {{ 183.357 | modulo: 12 }} ``` ```liquid Saída theme={null} 3.3569999999999993 ``` ## `abs` Filtro Liquid que retorna o valor absoluto de um número. ```liquid Código theme={null} {{ -17 | abs }} ``` ```liquid Saída theme={null} 17 ``` ```liquid Código theme={null} {{ 4 | abs }} ``` ```liquid Saída theme={null} 4 ``` `abs` também funcionará em uma string que contém apenas um número: ```liquid Código theme={null} {{ "-19.86" | abs }} ``` ```liquid Saída theme={null} 19.86 ``` ## `at_least` Limita um número a um valor mínimo. ```liquid Código theme={null} {{ 4 | at_least: 5 }} ``` ```liquid Saída theme={null} 5 ``` ```liquid Código theme={null} {{ 4 | at_least: 3 }} ``` ```liquid Saída theme={null} 4 ``` ## `at_most` Limita um número a um valor máximo. ```liquid Código theme={null} {{ 4 | at_most: 5 }} ``` ```liquid Saída theme={null} 4 ``` ```liquid Código theme={null} {{ 4 | at_most: 3 }} ``` ```liquid Saída theme={null} 3 ``` ## `ceil` Arredonda a entrada para cima para o número inteiro mais próximo. LiquidJS tenta converter a entrada para um número antes do filtro ser aplicado. ```liquid Código theme={null} {{ 1.2 | ceil }} ``` ```liquid Saída theme={null} 2 ``` ```liquid Código theme={null} {{ 2.0 | ceil }} ``` ```liquid Saída theme={null} 2 ``` ```liquid Código theme={null} {{ 183.357 | ceil }} ``` ```liquid Saída theme={null} 184 ``` Aqui o valor de entrada é uma string: ```liquid Código theme={null} {{ "3.5" | ceil }} ``` ```liquid Saída theme={null} 4 ``` ## `floor` Arredonda a entrada para baixo para o número inteiro mais próximo. LiquidJS tenta converter a entrada para um número antes do filtro ser aplicado. ```liquid Código theme={null} {{ 1.2 | floor }} ``` ```liquid Saída theme={null} 1 ``` ```liquid Código theme={null} {{ 2.0 | floor }} ``` ```liquid Saída theme={null} 2 ``` ```liquid Código theme={null} {{ 183.357 | floor }} ``` ```liquid Saída theme={null} 183 ``` Aqui o valor de entrada é uma string: ```liquid Código theme={null} {{ "3.5" | floor }} ``` ```liquid Saída theme={null} 3 ``` ## `round` Arredonda um número para o inteiro mais próximo ou, se um número for passado como argumento, para esse número de casas decimais. ```liquid Código theme={null} {{ 1.2 | round }} ``` ```liquid Saída theme={null} 1 ``` ```liquid Código theme={null} {{ 2.7 | round }} ``` ```liquid Saída theme={null} 3 ``` ```liquid Código theme={null} {{ 183.357 | round: 2 }} ``` ```liquid Saída theme={null} 183.36 ``` ## `sum` Calcula a soma de todos os números em um array. Um argumento opcional especifica qual propriedade dos itens do array somar. Neste exemplo, assuma que o objeto `cart.products` contém um array de todos os produtos no carrinho de um site. Assuma que cada produto do carrinho tem uma propriedade `qty` que fornece a contagem dessa instância de produto no carrinho. Usando o filtro `sum` podemos calcular o número total de produtos no carrinho. ```liquid Código theme={null} The cart has {{ order.products | sum: "qty" }} products. ``` ```liquid Saída theme={null} The cart has 7 products. ``` # Filtros diversos Source: https://docs.kiwify.com.br/members-area/reference/filters/misc Filtros diversos para várias operações em templates Liquid. ## `default` Permite especificar um fallback caso um valor não exista. `default` mostrará seu valor se o lado esquerdo for falsy ou vazio (`string` ou `Array`). Neste exemplo, `product_price` não está definido, então o valor padrão é usado. ```liquid Código theme={null} {{ product_price | default: 2.99 }} ``` ```liquid Saída theme={null} 2.99 ``` Neste exemplo, `product_price` está definido, então o valor padrão não é usado. ```liquid Código theme={null} {% assign product_price = 4.99 %} {{ product_price | default: 2.99 }} ``` ```liquid Saída theme={null} 4.99 ``` Neste exemplo, `product_price` está vazio, então o valor padrão é usado. ```liquid Código theme={null} {% assign product_price = "" %} {{ product_price | default: 2.99 }} ``` ```liquid Saída theme={null} 2.99 ``` ### Permitindo `false` Para permitir que variáveis retornem `false` em vez do valor padrão, você pode usar o parâmetro `allow_false`. ```liquid Código theme={null} {% assign display_price = false %} {{ display_price | default: true, allow_false: true }} ``` ```liquid Saída theme={null} false ``` ## `json` Converte valores para string via `JSON.stringify()`, para propósito de debug. ```liquid Código theme={null} {% assign arr = "foo bar coo" | split: " " %} {{ arr | json }} ``` ```liquid Saída theme={null} ["foo","bar","coo"] ``` ## `parse_json` Converte o valor de uma string para um objeto JSON válido. Caso o valor não seja um JSON válido, o valor retornado será `nil`. ```liquid Código theme={null} {% assign obj = '{"foo": "bar"}' | parse_json %} {% assign arr = '["Hi", "there"]' | parse_json %} {% assign invalid = '{"foo" = "bar"}' | parse_json %} {{ obj.foo }} {{ arr[1]}} {{ invalid }} ``` ```liquid Saída theme={null} bar there ``` ### Space Um parâmetro `space` adicional pode ser especificado para formatar o JSON. ```liquid Código theme={null} {% assign arr = "foo bar coo" | split: " " %} {{ arr | json: 4 }} ``` ```liquid Saída theme={null} [ "foo", "bar", "coo" ] ``` ## `jsonify` Veja json. ## `inspect` Similar ao `json`, mas `inspect` permite estrutura cíclica. Para o escopo abaixo: ``` const foo = { bar: 'BAR' } foo.foo = foo const scope = { foo } ``` ```liquid Código theme={null} {% foo | inspect %} ``` ```liquid Saída theme={null} {"bar":"BAR","foo":"[Circular]"} ``` ### Formatação Um argumento `space` adicional pode ser especificado para a largura da indentação. ```liquid Código theme={null} {{ foo | inspect: 4 }} ``` ```liquid Saída theme={null} { "bar": "BAR", "foo": "[Circular]" } ``` ## `to_integer` Converte valores para número. ```liquid Código theme={null} {{ "123" | to_integer | json }} ``` ```liquid Saída theme={null} 123 ``` # Filtros de string Source: https://docs.kiwify.com.br/members-area/reference/filters/string Filtros de string para manipular texto em templates Liquid. ## `append` Concatena duas strings e retorna o valor concatenado. ```liquid Código theme={null} {{ "/my/fancy/url" | append: ".html" }} ``` ```liquid Saída theme={null} /my/fancy/url.html ``` `append` também pode ser usado com variáveis: ```liquid Código theme={null} {% assign filename = "/index.html" %} {{ "website.com" | append: filename }} ``` ```liquid Saída theme={null} website.com/index.html ``` ## `prepend` Adiciona a string especificada ao início de outra string. ```liquid Código theme={null} {{ "apples, oranges, and bananas" | prepend: "Some fruit: " }} ``` ```liquid Saída theme={null} Some fruit: apples, oranges, and bananas ``` `prepend` também pode ser usado com variáveis: ```liquid Código theme={null} {% assign url = "example.com" %} {{ "/index.html" | prepend: url }} ``` ```liquid Saída theme={null} example.com/index.html ``` ## `capitalize` Torna o primeiro caractere de uma string maiúsculo. ```liquid Código theme={null} {{ "title" | capitalize }} ``` ```liquid Saída theme={null} Title ``` `capitalize` apenas capitaliza o primeiro caractere de uma string, então palavras posteriores não são afetadas: ```liquid Código theme={null} {{ "my great title" | capitalize }} ``` ```liquid Saída theme={null} My great title ``` ## `upcase` Torna cada caractere em uma string maiúsculo. Não tem efeito em strings que já estão todas em maiúsculas. ```liquid Código theme={null} {{ "Parker Moore" | upcase }} ``` ```liquid Saída theme={null} PARKER MOORE ``` ```liquid Código theme={null} {{ "APPLE" | upcase }} ``` ```liquid Saída theme={null} APPLE ``` ## `downcase` Torna cada caractere em uma string minúsculo. Não tem efeito em strings que já estão todas em minúsculas. ```liquid Código theme={null} {{ "Parker Moore" | downcase }} ``` ```liquid Saída theme={null} parker moore ``` ```liquid Código theme={null} {{ "apple" | downcase }} ``` ```liquid Saída theme={null} apple ``` ## `strip` Remove todos os espaços em branco (tabs, espaços e quebras de linha) de ambos os lados esquerdo e direito de uma string. Não afeta espaços entre palavras. ```liquid Código theme={null} BEGIN{{ " So much room for activities! " | strip }}END ``` ```liquid Saída theme={null} BEGINSo much room for activities!END ``` ## `lstrip` Remove todos os espaços em branco (tabs, espaços e quebras de linha) do lado esquerdo de uma string. Não afeta espaços entre palavras. ```liquid Código theme={null} BEGIN{{ " So much room for activities! " | lstrip }}END ``` ```liquid Saída theme={null} BEGINSo much room for activities! END ``` ## `rstrip` Remove todos os espaços em branco (tabs, espaços e quebras de linha) do lado direito de uma string. Não afeta espaços entre palavras. ```liquid Código theme={null} BEGIN{{ " So much room for activities! " | rstrip }}END ``` ```liquid Saída theme={null} BEGIN So much room for activities!END ``` ## `strip_newlines` Remove quaisquer caracteres de quebra de linha de uma string. ```liquid Código theme={null} {% capture string_with_newlines %} Hello there {% endcapture %} {{ string_with_newlines | strip_newlines }} ``` ```liquid Saída theme={null} Hellothere ``` ## `replace` Substitui toda ocorrência do primeiro argumento em uma string pelo segundo argumento. ```liquid Código theme={null} {{ "Take my protein pills and put my helmet on" | replace: "my", "your" }} ``` ```liquid Saída theme={null} Take your protein pills and put your helmet on ``` ## `replace_first` Substitui apenas a primeira ocorrência do primeiro argumento em uma string pelo segundo argumento. ```liquid Código theme={null} {{ "Take my protein pills and put my helmet on" | replace_first: "my", "your" }} ``` ```liquid Saída theme={null} Take your protein pills and put my helmet on ``` ## `replace_last` Substitui apenas a última ocorrência do primeiro argumento em uma string pelo segundo argumento. ```liquid Código theme={null} {{ "Take my protein pills and put my helmet on" | replace_last: "my", "your" }} ``` ```liquid Saída theme={null} Take my protein pills and put your helmet on ``` ## `remove` Remove toda ocorrência da substring especificada de uma string. ```liquid Código theme={null} {{ "I strained to see the train through the rain" | remove: "rain" }} ``` ```liquid Saída theme={null} I sted to see the t through the ``` ## `remove_first` Remove apenas a primeira ocorrência da substring especificada de uma string. ```liquid Código theme={null} {{ "I strained to see the train through the rain" | remove_first: "rain" }} ``` ```liquid Saída theme={null} I sted to see the train through the rain ``` ## `remove_last` Remove apenas a última ocorrência da substring especificada de uma string. ```liquid Código theme={null} {{ "I strained to see the train through the rain" | remove_last: "rain" }} ``` ```liquid Saída theme={null} I strained to see the train through the ``` ## `truncate` Encurta uma string até o número de caracteres passado como argumento. Se o número especificado de caracteres for menor que o comprimento da string, reticencias (...) são adicionadas à string e são incluídas na contagem de caracteres. ### Basic Usage ```liquid Código theme={null} {{ "Ground control to Major Tom." | truncate: 20 }} ``` ```liquid Saída theme={null} Ground control to... ``` ### Reticências personalizadas `truncate` aceita um segundo argumento opcional que especifica a sequência de caracteres a ser anexada à string truncada. Por padrão são reticências (...), mas você pode especificar uma sequência diferente. O comprimento do segundo argumento conta contra o número de caracteres especificado pelo primeiro argumento. Por exemplo, se você quer truncar uma string para exatamente 10 caracteres, e usar reticências de 3 caracteres, use **13** para o primeiro argumento de `truncate`, já que as reticências contam como 3 caracteres. ```liquid Código theme={null} {{ "Ground control to Major Tom." | truncate: 25, ", and so on" }} ``` ```liquid Saída theme={null} Ground control, and so on ``` ### Sem reticências Você pode truncar para o número exato de caracteres especificado pelo primeiro argumento e evitar mostrar caracteres finais passando uma string vazia como segundo argumento: ```liquid Código theme={null} {{ "Ground control to Major Tom." | truncate: 20, "" }} ``` ```liquid Saída theme={null} Ground control to Ma ``` ## `split` Divide uma string em um array usando o argumento como separador. `split` é comumente usado para converter itens separados por vírgula de uma string para um array. ```liquid Código theme={null} {% assign beatles = "John, Paul, George, Ringo" | split: ", " %} {% for member in beatles %} {{ member }} {% endfor %} ``` ```liquid Saída theme={null} John Paul George Ringo ``` ## `truncatewords` Encurta uma string até o número de palavras passado como argumento. Se o número especificado de palavras for menor que o número de palavras na string, reticências (...) são anexadas à string. ```liquid Código theme={null} {{ "Ground control to Major Tom." | truncatewords: 3 }} ``` ```liquid Saída theme={null} Ground control to... ``` #### Reticências personalizadas `truncatewords` aceita um segundo argumento opcional que especifica a sequência de caracteres a ser anexada à string truncada. Por padrão são reticências (...), mas você pode especificar uma sequência diferente. ```liquid Código theme={null} {{ "Ground control to Major Tom." | truncatewords: 3, "--" }} ``` ```liquid Saída theme={null} Ground control to-- ``` #### Sem reticências Você pode evitar mostrar caracteres finais passando uma string vazia como segundo argumento: ```liquid Código theme={null} {{ "Ground control to Major Tom." | truncatewords: 3, "" }} ``` ```liquid Saída theme={null} Ground control to ``` ## `normalize_whitespace` Substitui qualquer ocorrência de espaço em branco com um único espaço. ```liquid Código theme={null} {{ "a \n b" | normalize_whitespace }} ``` ```liquid Saída theme={null} a b ``` ## `number_of_words` Conta o número de palavras em um texto. Este filtro aceita um argumento opcional para controlar o tratamento de caracteres chinês-japonês-coreano (CJK) na string de entrada: * Passar `'cjk'` como argumento contará cada caractere CJK detectado como uma palavra independentemente de ser separado por espaço em branco. * Passar `'auto'` (detecção automática) funciona similar a `'cjk'` mas é mais performático se o filtro for usado em uma string variável que pode ou não conter caracteres CJK. ```liquid Código theme={null} {{ "Hello world!" | number_of_words }} ``` ```liquid Saída theme={null} 2 ``` ```liquid Código theme={null} {{ "你好hello世界world" | number_of_words }} ``` ```liquid Saída theme={null} 1 ``` ```liquid Código theme={null} {{ "你好hello世界world" | number_of_words: "cjk" }} ``` ```liquid Saída theme={null} 6 ``` ```liquid Código theme={null} {{ "你好hello世界world" | number_of_words: "auto" }} ``` ```liquid Saída theme={null} 6 ``` ## `array_to_sentence_string` Converte um array em uma frase. Útil para listar tags. Argumento opcional para conector. ```liquid Código theme={null} {{ "foo,bar,baz" | split: "," | array_to_sentence_string }} ``` ```liquid Saída theme={null} foo, bar, and baz ``` ```liquid Código theme={null} {{ "foo,bar,baz" | split: "," | array_to_sentence_string: "or" }} ``` ```liquid Saída theme={null} foo, bar, or baz ``` # Visão Geral Source: https://docs.kiwify.com.br/members-area/reference/liquid-language Liquid é um engine de template que permite criar páginas web dinâmicas. Liquid é uma linguagem de template open-source criada pela Shopify. É usada para carregar conteúdo dinâmico em websites. O Liquid é projetado para ser simples, seguro e fácil de aprender. Para documentação detalhada, consulte a documentação oficial do [LiquidJS](https://liquidjs.com/tutorials/intro-to-liquid.html) e [Shopify Liquid](https://shopify.dev/docs/api/liquid). ## Básicos da Sintaxe Liquid ### Objetos Objetos representam variáveis que produzem conteúdo na página. Eles são indicados com chaves duplas: ```liquid theme={null} {{ page.title }} {{ product.price }} {{ user.name }} ``` ### Tags Tags criam a lógica e fluxo de controle para templates. Elas são indicadas com chaves e sinais de porcentagem: ```liquid theme={null} {% if user.name == 'João' %} Olá João! {% endif %} {% for product in collection.products %} {{ product.title }} {% endfor %} ``` ### Filtros Filtros alteram a saída de um objeto. Eles são aplicados a um objeto usando o caractere pipe: ```liquid theme={null} {{ "olá mundo" | capitalize }} {{ product.price | money_with_currency }} {{ collection.products | size }} ``` ## Próximos Passos Aprenda sobre todos os objetos Liquid disponíveis e suas propriedades Explore a lista completa de filtros Liquid Descubra todas as tags Liquid e como usá-las ## Exemplos ### Renderização Condicional ```liquid theme={null} {% if user %} Olá {{ user.name }}! {% else %} Olá Visitante! {% endif %} ``` ### Percorrendo Coleções ```liquid theme={null} ``` ### Usando Filtros ```liquid theme={null} {{ "promoção termina em breve" | capitalize | append: "!" }} {{ product.price | money_with_currency }} ``` Lembre-se de consultar a documentação oficial do [LiquidJS](https://liquidjs.com) e [Shopify Liquid](https://shopify.dev/docs/api/liquid) para informações mais abrangentes e detalhadas sobre a linguagem de template Liquid. # Visão Geral Source: https://docs.kiwify.com.br/members-area/reference/objects Entenda os objetos disponíveis dentro da Área de Membros Objetos são variáveis Liquid que representam dados estruturados no seu tema. Eles podem conter um único valor, múltiplas propriedades, ou até referências para outros objetos. Pense neles como containers que organizam e fornecem acesso a diferentes tipos de dados. Existem duas categorias principais de objetos disponíveis no seu tema: * **Objetos integrados**: Estes são objetos globais e locais predefinidos que vêm com o sistema * **Objetos personalizados**: Objetos que você cria para organizar os dados do seu tema A disponibilidade dos objetos depende de onde você os está usando nos arquivos do seu tema. ## Uso Objetos, junto com suas propriedades, são envolvidos por delimitadores de chaves `{{ }}`. Por exemplo, o objeto `all_courses` contém uma propriedade chamada `name` que pode ser usada para exibir o nome de um curso. ```liquid Código theme={null} {{ all_courses["my-course"].name }} ``` ```json Data theme={null} // Apenas um exemplo de dados iniciais, os dados não são reais { "allCourses": { "my-course": { "name": "Meu Curso" } } } ``` ```liquid Saída theme={null} Meu Curso ``` ## Acesso a objetos A maneira como você acessa um objeto depende do objeto e do contexto no qual você quer acessá-lo. Um objeto pode ser acessado das seguintes formas: * **Globalmente**: O objeto pode ser acessado diretamente em qualquer arquivo de tema. * **Em um template**: O objeto pode ser acessado diretamente em templates específicos, ou em seções ou blocos incluídos no template. * **Através de um objeto pai**: Muitos objetos são retornados por outro objeto, ou como uma propriedade de um objeto pai. Consulte cada objeto para aprender sobre como ele pode ser acessado. ## Criando objetos personalizados Você também pode criar suas próprias variáveis usando tags de variável. Variáveis são tratadas como objetos sintaticamente. ```liquid Código theme={null} {% assign my_variable = 'Minha string personalizada.' %} {{ my_variable }} ``` ```liquid Saída theme={null} Minha string personalizada. ``` ## Objetos disponíveis Consulte a documentação detalhada para cada objeto nas seguintes seções: Coleção de todos os cursos disponíveis Coleção de todos os módulos disponíveis Coleção de todas as aulas disponíveis Últimas aulas assistidas pelo usuário atual Informações sobre a área de membros Detalhes e propriedades de cursos individuais Detalhes e propriedades de módulos individuais Detalhes e propriedades de aulas individuais Dados de interação do usuário atual Detalhes de ofertas de compra personalizadas Detalhes do componente de seção Detalhes do componente de bloco # all_courses Source: https://docs.kiwify.com.br/members-area/reference/objects/all_courses O objeto all_courses contém todos os cursos adicionados ao seu clube. Você pode usar `all_courses` para acessar um curso pelo seu ID. Isso retorna o objeto Course para o curso especificado. Se o curso não for encontrado, então `null` é retornado. O objeto all\_courses é determinado em tempo de execução, então não é um objeto estático. É diferente para cada usuário, baseado no grupo ao qual pertencem, se têm aulas desbloqueadas agora, etc. ## Sintaxe ```liquid theme={null} {{ all_courses[course_id] }} ``` ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_courses] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ## Exemplo ```liquid Código theme={null} {{ all_courses["my-course"].name }} ``` ```json Data theme={null} // Apenas dados iniciais de exemplo, os dados não são reais { "all_courses": { "my-course": { "name": "Culinária 101" } } } ``` ```liquid Saída theme={null} Culinária 101 ``` # all_courses_values Source: https://docs.kiwify.com.br/members-area/reference/objects/all_courses_values A lista all_courses_values contém todos os cursos adicionados ao seu clube. Você pode usar `all_courses_values` para listar todos os cursos aos quais o usuário tem acesso. Cada elemento é um objeto Course. A lista all\_courses\_values é determinada em tempo de execução, então não é um objeto estático. É diferente para cada usuário, baseado no grupo ao qual pertencem, se têm aulas desbloqueadas agora, etc. ## Sintaxe ```liquid theme={null} {% all_courses_values.first %} ``` ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_courses_values] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ## Exemplo ```liquid Código theme={null} {% for course in all_courses_values %} - {{ course.name }} {% endfor %} ``` ```json Data theme={null} // Apenas dados iniciais de exemplo, os dados não são reais { "all_courses_values": [ { "name": "Culinária 101" }, { "name": "Culinária Master" }, ] } ``` ```liquid Saída theme={null} - Culinária 101 - Culinária Master ``` # all_lessons Source: https://docs.kiwify.com.br/members-area/reference/objects/all_lessons O objeto all_lessons contém todas as aulas adicionadas ao seu clube. Você pode usar `all_lessons` para acessar uma aula pelo seu ID. Isso retorna o objeto Lesson para a aula especificada. Se a aula não for encontrada, então `null` é retornado. O objeto all\_lessons é determinado em tempo de execução, então não é um objeto estático. É diferente para cada usuário, baseado no grupo ao qual pertencem, se têm aulas desbloqueadas agora, etc. ## Sintaxe ```liquid theme={null} {{ all_lessons[lesson_id] }} ``` ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_lessons] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ## Exemplo ```liquid Código theme={null} {{ all_lessons["my-lesson"].name }} ``` ```json Data theme={null} // Apenas dados iniciais de exemplo, os dados não são reais { "all_lessons": { "my-lesson": { "name": "Como fazer uma torta de maçã" } } } ``` ```liquid Saída theme={null} Como fazer uma torta de maçã ``` # all_modules Source: https://docs.kiwify.com.br/members-area/reference/objects/all_modules O objeto all_modules contém todos os módulos adicionados ao seu clube. Você pode usar `all_modules` para acessar um módulo pelo seu ID. Isso retorna o objeto Module para o módulo especificado. Se o módulo não for encontrado, então `null` é retornado. O objeto all\_modules é determinado em tempo de execução, então não é um objeto estático. É diferente para cada usuário, baseado no grupo ao qual pertencem, se têm aulas desbloqueadas agora, etc. ## Sintaxe ```liquid theme={null} {{ all_modules[module_id] }} ``` ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_modules] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ## Exemplo ```liquid Código theme={null} {{ all_modules["my-module"].name }} ``` ```json Data theme={null} // Apenas dados iniciais de exemplo, os dados não são reais { "all_modules": { "my-module": { "name": "Receitas Básicas" } } } ``` ```liquid Saída theme={null} Receitas Básicas ``` # block Source: https://docs.kiwify.com.br/members-area/reference/objects/block O conteúdo e configurações de um bloco de seção. Para saber mais sobre blocos e como usá-los no seu tema, veja [Blocks](/members-area/theme/blocks). ## Propriedades O identificador único do bloco. Isso é gerado automaticamente no template JSON quando são adicionados pelo editor de tema. O tipo do bloco, conforme definido no schema do bloco. Isso determina que tipo de conteúdo o bloco conterá e como será renderizado. As configurações do bloco. ## Escopo É acessível através da seção. ```mermaid theme={null} graph TD A[Contexto Global] --> B[section] B --> C[block] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold; style C fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ```json theme={null} { "id": "block_123456", "type": "text", "settings": { "color": "#333" } } ``` # club Source: https://docs.kiwify.com.br/members-area/reference/objects/club O objeto club contém informações sobre a área de membros. ## Sintaxe ```liquid theme={null} {{ club.name }} ``` ## Propriedades Identificador único da área de membros. O nome da área de membros, configurado nas configurações da área de membros. O tipo da área de membros, "lite" ou "full", configurado nas configurações da área de membros. URL para a imagem do logo da área de membros. O código de duas letras do idioma da área de membros, configurado nas configurações da área de membros. ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[club] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ```json theme={null} { "id": "area_123456", "name": "Complete Web Developer", "kind": "full", "logo": "https://example.com/logo.jpg", "language": "en" } ``` # course Source: https://docs.kiwify.com.br/members-area/reference/objects/course O objeto course contém informações sobre um curso específico no seu clube. ## Propriedades Identificador único do curso. O nome do curso, configurado nas configurações do curso. A descrição do curso, configurada nas configurações do curso. URL para a imagem do logo do curso. Se o curso tem certificados habilitados. URL para a imagem miniatura do curso. Informações sobre se este curso pode ser comprado dentro da área de membros. Veja [custom\_offer](/members-area/reference/objects/custom_offer) para propriedades detalhadas. Dados específicos da interação do usuário atual com o curso. Veja [user\_data](/members-area/reference/objects/user_data) para propriedades detalhadas. IDs dos módulos do curso. ## Escopo É acessível através do objeto `all_courses` ou do array `all_courses_values`. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_courses] A --> C[all_courses_values] B --> D[course] C --> D classDef globalValue fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold; classDef property fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 class B,C globalValue class D property linkStyle 0,1 stroke:#4B96FF,stroke-width:2px ``` ```json Course theme={null} { "id": "course_123456", "name": "Complete Web Development Bootcamp", "description": "Learn web development from scratch with HTML, CSS, JavaScript and more.", "logo_url": "https://example.com/course-logo.jpg", "certificate_enabled": true, "thumbnail": "https://example.com/course-thumbnail.jpg", "custom_offer": { "enabled": true, "external_link": "https://example.com/purchase/course_123456" }, "user_data": { "progress": 45, "visible": true, "content_count": 24 }, "modules": ["module_123", "module_456"] } ``` # custom_offer Source: https://docs.kiwify.com.br/members-area/reference/objects/custom_offer O objeto custom_offer contém informações sobre se um curso, módulo ou aula pode ser comprado dentro da área de membros. ## Propriedades Se uma oferta personalizada está habilitada para o curso, módulo ou aula. Link externo relacionado à oferta personalizada. ## Escopo É acessível através de um curso, um módulo ou uma aula.
```mermaid theme={null} graph TD A[Contexto Global] --> B[all_courses] A --> C[all_courses_values] A --> D[all_modules] A --> E[all_lessons] B --> F[course] C --> F D --> G[module] E --> H[lesson] F --> I[custom_offer] G --> I H --> I classDef globalValue fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold; classDef property fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 class B,C,D,E globalValue class F,G,H,I property linkStyle 0,1,2,3 stroke:#4B96FF,stroke-width:2px ```
```json Comprável theme={null} { "enabled": true, "external_link": "" } ``` ```json Com link externo theme={null} { "enabled": true, "external_link": "https://buy.me/course_123456" } ``` ```json Não comprável theme={null} { "enabled": false, "external_link": "anything" } ``` # is_preview Source: https://docs.kiwify.com.br/members-area/reference/objects/is_preview A flag is_preview indica se o template está sendo renderizado dentro do editor ou não. Você pode usar a flag `is_preview` para adicionar mensagens, conteúdo de espaço reservado etc. dentro de um template ou bloco ao visualizar a página dentro do editor. ## Sintaxe ```liquid theme={null} {% is_preview %} ``` ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[is_preview] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ## Exemplo ```liquid Código theme={null} {% if is_preview %}

Isso aparece apenas dentro do editor

{% endif %} ```
```liquid Saída theme={null}

Isso aparece apenas dentro do editor

```
# last_watched_lessons Source: https://docs.kiwify.com.br/members-area/reference/objects/last_watched_lessons A lista last_watched_lessons contém o ID das últimas aulas assistidas pelo usuário atual, ordenadas por mais recente Você pode usar a lista `last_watched_lessons` em conjunto com o objeto all\_lessons para criar uma seção de "continuar assistindo" ou "conteúdo recomendado". ## Sintaxe ```liquid theme={null} {% last_watched_lessons.first %} ``` ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[last_watched_lessons] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ## Exemplo ```liquid Código theme={null} {% for lesson in last_watched_lessons %} {% assign lesson_data = all_lessons[lesson] %} - {{ lesson.name }} {% endfor %} ``` ```json Data theme={null} // Apenas dados iniciais de exemplo, os dados não são reais { "all_lessons": { "lesson-a": { "name": "Introdução" }, "lesson-b": { "name": "Introdução ao Curso Avançado" } } "last_watched_lessons": [ "lesson-a", "lesson-b" ] } ``` ```liquid Saída theme={null} - Introdução - Introdução ao Curso Avançado ``` # lesson Source: https://docs.kiwify.com.br/members-area/reference/objects/lesson O objeto lesson contém informações sobre uma aula específica dentro de um módulo. ## Propriedades Identificador único da aula. O nome da aula. Identificador do curso ao qual esta aula pertence. Identificador do módulo ao qual esta aula pertence. Se a aula está publicada e acessível. URL para a imagem miniatura da aula. URL para a miniatura da aula gerada a partir do seu vídeo. URL para a imagem miniatura da aula usada em visualizações de slider. Informações sobre se esta aula pode ser comprada dentro da área de membros. Veja [custom\_offer](/members-area/reference/objects/custom_offer) para propriedades detalhadas. Dados específicos da interação do usuário atual com a aula. Veja [lesson\_user\_data](/members-area/reference/objects/lesson_user_data) para propriedades detalhadas. ## Escopo É acessível através do objeto `all_lessons`. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_lessons] B --> C[lesson] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold; style C fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ```json Lesson theme={null} { "id": "lesson_567890", "name": "JavaScript Variables and Data Types", "course_id": "course_123456", "module_id": "module_789012", "published": true, "thumbnail": "https://example.com/lesson-thumbnail.jpg", "thumbnail_slider_cover": "https://example.com/lesson-slider-cover.jpg", "video_thumbnail": "https://example.com/video-thumbnail.jpg", "custom_offer": { "enabled": false, "external_link": "" }, "user_data": { "progress": 0, "visible": true, "expired": false, "delivery_date": "" } } ``` # lesson_user_data Source: https://docs.kiwify.com.br/members-area/reference/objects/lesson_user_data O objeto lesson_user_data contém informações sobre a interação de um usuário com aulas. ## Propriedades O progresso do usuário através do conteúdo (porcentagem de 0 a 100). Se o conteúdo está visível para o usuário atual. Se o acesso do usuário àquela aula expirou. Data quando a aula estará acessível para o usuário atual, se não estiver imediatamente disponível. Formato: `YYYY-MM-DD`. ## Escopo É acessível através de uma aula. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_lessons] B --> C[lesson] C --> D[lesson_user_data] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold; style C fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; style D fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ```json Aula ativa theme={null} { "progress": 75, "visible": true, "expired": false, "delivery_date": "2023-10-15" } ``` ```json A ser entregue theme={null} { "progress": 0, "visible": true, "expired": false, "delivery_date": "2090-10-15" } ``` ```json Expirada theme={null} { "progress": 75, "visible": true, "expired": true, "delivery_date": "" } ``` ```json Não acessível theme={null} { "progress": 0, "visible": false, "expired": false, "delivery_date": "" } ``` # module Source: https://docs.kiwify.com.br/members-area/reference/objects/module O objeto module contém informações sobre um módulo específico dentro de um curso. ## Propriedades Identificador único do módulo. O nome do módulo. O ID do curso ao qual esse módulo pertence. URL para a imagem miniatura do módulo. URL para a versão desktop da imagem de capa do módulo. URL para a versão mobile da imagem de capa do módulo. Informações sobre se este módulo pode ser comprado dentro da área de membros. Veja [custom\_offer](/members-area/reference/objects/custom_offer) para propriedades detalhadas. Dados específicos da interação do usuário atual com o módulo. Veja [user\_data](/members-area/reference/objects/user_data) para propriedades detalhadas. IDs das aulas do módulo. ## Escopo É acessível através do objeto `all_modules`. ```mermaid theme={null} graph TD A[Contexto Global] --> B[all_modules] B --> C[module] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold; style C fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ```json Module theme={null} { "id": "module_789012", "name": "JavaScript Fundamentals", "course_id": "course_123456", "description": "Learn the core concepts of JavaScript programming language.", "thumbnail": "https://example.com/module-thumbnail.jpg", "cover_image_desktop": "https://example.com/module-cover-desktop.jpg", "cover_image_mobile": "https://example.com/module-cover-mobile.jpg", "custom_offer": { "enabled": false, "external_link": "" }, "user_data": { "progress": 60, "visible": true, "content_count": 8 }, "lessons": ["lesson_123", "lesson_456"] } ``` # section Source: https://docs.kiwify.com.br/members-area/reference/objects/section As propriedades e configurações de uma seção. Você pode acessar informações detalhadas sobre a seção atual sendo renderizada, incluindo suas configurações e blocos, usando o objeto `section`. Para saber mais sobre seções e como usá-las no seu tema, veja [Sections](/members-area/key-concepts/theme/sections). ## Sintaxe ```liquid theme={null} {{ section.id }} ``` ## Propriedades O identificador único da seção. Isso é gerado automaticamente no template JSON quando são adicionados pelo editor de tema. O tipo da seção. Os blocos da seção, acessíveis pelos seus IDs. Os IDs dos blocos da seção, na ordem em que aparecerão. As configurações da seção. ## Escopo É acessível globalmente em qualquer seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[section] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ```json theme={null} { "id": "section_123456", "type": "banner", "blocks": { "slide-a": { // ... }, "slide-b": { // ... } }, "block_order": [ "slide-a", "slide-b" ], "settings": { "margin_top": 0 } } ``` # source Source: https://docs.kiwify.com.br/members-area/reference/objects/source A string source indica dentro de qual editor o template está sendo renderizado. Você pode usar o valor de `source` para adicionar elementos específicos a um dos editores -- de código ou de tema. Os valores possíveis são: * `"theme-editor"`: Quando o template está sendo renderizado dentro do Editor de Tema * `"code-editor"`: Quando o template está sendo renderizado dentro do Editor de Código * `nil`: Quando o template não está sendo renderizado dentro de um editor ## Sintaxe ```liquid theme={null} {% source %} ``` ## Escopo É acessível globalmente, em qualquer template, seção ou bloco. ```mermaid theme={null} graph TD A[Contexto Global] --> B[source] style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 style B fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold linkStyle 0 stroke:#4B96FF,stroke-width:2px ``` ## Exemplo ```liquid Código theme={null} {% if source == 'code-editor' %}

Isso aparece apenas dentro do editor de código

{% endif %} ```
```liquid Saída theme={null}

Isso aparece apenas dentro do editor de código

```
# user_data Source: https://docs.kiwify.com.br/members-area/reference/objects/user_data O objeto user_data contém informações sobre a interação de um usuário com cursos e módulos. ## Propriedades O progresso do usuário através do conteúdo (porcentagem de 0 a 100). Se o conteúdo está visível para o usuário atual. A contagem de itens de conteúdo acessíveis para o usuário atual. ## Escopo É acessível através de um curso ou um módulo.
```mermaid theme={null} graph TD A[Contexto Global] --> B[all_courses] A --> C[all_courses_values] A --> D[all_modules] B --> F[course] C --> F D --> G[module] F --> I[user_data] G --> I classDef globalValue fill:#4B96FF,stroke:#333,stroke-width:1px,color:white,font-weight:bold; classDef property fill:#FFFFFF,stroke:#333,stroke-width:1px,color:#666; style A fill:#f9f9f9,stroke:#333,stroke-width:2px,color:#333,stroke-dasharray: 5 5 class B,C,D globalValue class F,G,I property linkStyle 0,1,2 stroke:#4B96FF,stroke-width:2px ```
```json Conteúdo acessível theme={null} { "progress": 45, "visible": true, "content_count": 24 } ``` ```json Não acessível theme={null} { "progress": 45, "visible": false, "content_count": 24 } ``` # Blocos Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/blocks Documentação detalhada sobre configuração de blocos de seção. ## Propriedades O identificador do tipo de bloco. Deve ser único dentro da seção. O nome do bloco mostrado no editor de tema. O número máximo de blocos deste tipo que podem ser adicionados à seção. Um array de configurações específicas para este tipo de bloco. Usa a mesma estrutura das configurações de seção. Configurações adicionais para o editor de tema: * `icon` - Ícone a ser associado com este tipo de bloco no editor de tema ```json theme={null} { "blocks": [ { "type": "slide", "name": "Slide", "limit": 10, "settings": [ { "type": "image_picker", "id": "image", "label": "Imagem" }, { "type": "text", "id": "heading", "label": "Título" }, { "type": "text", "id": "button_link", "label": "Link do botão" }, { "type": "text", "id": "button_label", "label": "Texto do botão" } ], "kiwi_extra": { "icon": "fas fa-image" } }, { "type": "video", "name": "Vídeo", "limit": 1, "settings": [ { "type": "string", "id": "video_url", "label": "URL do vídeo", } ], "kiwi_extra": { "icon": "fas fa-video" } } ] } ``` # Presets Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/presets Documentação detalhada sobre configuração de presets de seção. ## Propriedades O nome do preset exibido no editor de tema. Valores padrão para configurações de seção para pré-preencher. Blocos padrão incluídos no preset. Cada bloco deve especificar seu tipo e configurações. ```json theme={null} { "presets": [ { "name": "Slideshow de imagens", "settings": { "autoplay": true, "speed": 5, "transition": "slide" }, "blocks": [ { "type": "slide", "settings": { "heading": "Bem-vindo à nossa área de membros", "text": "

Confira nossos cursos mais recentes

" } }, { "type": "slide", "settings": { "heading": "Coleção em destaque", "text": "

Nosso conteúdo mais popular

" } } ] }, { "name": "Slideshow de vídeo", "settings": { "autoplay": true, "speed": 7 }, "blocks": [ { "type": "video", "settings": { "video_url": "https://www.youtube.com/watch?v=example" } } ] } ] } ```
# Visão geral Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings Documentação detalhada sobre configuração de settings de seção. ## Propriedades O tipo de entrada de configuração. Tipos disponíveis: * [checkbox](/members-area/reference/schema/fields/settings/input-types/checkbox) - Botão de alternância booleano * [course](/members-area/reference/schema/fields/settings/input-types/course) - Seletor de curso * [image\_picker](/members-area/reference/schema/fields/settings/input-types/image-picker) - Seleção de imagem * [course](/members-area/reference/schema/fields/settings/input-types/module) - Seletor de módulo * [range](/members-area/reference/schema/fields/settings/input-types/range) - Controle deslizante numérico * [select](/members-area/reference/schema/fields/settings/input-types/select) - Seleção de botão de alternância * [text](/members-area/reference/schema/fields/settings/input-types/text) - Entrada de texto de linha única Identificador único para a configuração. Deve ser único dentro da seção. O rótulo mostrado no editor de tema para esta configuração. Pode ser traduzido usando o prefixo `t:` mais uma chave válida dos arquivos de tradução de schema. Mais detalhes podem ser encontrados em [Locales](/members-area/key-concepts/theme/locales). Valor padrão para a configuração. O tipo depende do tipo de configuração. Informações adicionais mostradas abaixo da configuração no editor de tema. Pode ser traduzido usando o prefixo `t:` mais uma chave válida dos arquivos de tradução de schema. Mais detalhes podem ser encontrados em [Locales](/members-area/key-concepts/theme/locales). Para configurações de seleção, um array de opções com propriedades value, label e icon. Para configurações de range, o valor mínimo permitido. Para configurações de range, o valor máximo permitido. Para configurações de range, o incremento do passo. Para configurações de range, a unidade a exibir (ex., "px", "sec"). Propriedades adicionais para a configuração. Atualmente suportadas: * `hidden`: valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, esta configuração deve ser preenchida com um valor válido ```json theme={null} { "settings": [ { "type": "text", "id": "heading", "label": "Heading", "default": "Hello, world!" }, { "type": "select", "id": "layout", "label": "Layout", "options": [ { "value": "full_width", "label": "Full width", "kiwi_extra": { "icon": "fa fa-arrows-alt-h" } }, { "value": "contained", "label": "Contained", "kiwi_extra": { "icon": "fa fa-compress" } } ], "default": "full_width", "kiwi_extra": { "labeled": true } }, { "type": "range", "id": "padding", "min": 0, "max": 100, "step": 5, "unit": "px", "label": "Padding", "default": 20 } ] } ``` Resulting fields in theme editor # Checkbox Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/checkbox Documentação para o tipo de entrada checkbox em configurações de seção. O tipo de entrada checkbox permite aos usuários alternar um valor booleano ligado ou desligado. ## Propriedades Deve ser definido como "checkbox". Identificador único para a configuração. O rótulo mostrado ao lado do checkbox. Estado padrão do checkbox. O padrão é false. Informações adicionais mostradas abaixo do checkbox. Propriedades adicionais para o checkbox. Atualmente suportadas: * `hidden`: Valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, este checkbox deve estar marcado para ser válido ```json theme={null} { "type": "checkbox", "id": "show_title", "label": "Mostrar título da seção", "default": true, "info": "You can display just an image or the full text" } ``` Checkbox # Curso Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/course Documentação para o tipo de entrada curso em configurações de seção. O tipo de entrada curso permite selecionar um curso registrado no clube. ## Propriedades Deve ser definido como "course". Identificador único para a configuração. O rótulo mostrado no editor de tema. Não suportado para este tipo de entrada. Informações adicionais mostradas abaixo da entrada. Não suportado para este tipo de entrada. Propriedades adicionais para este tipo de entrada. Atualmente suportadas: * `hidden`: Valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, um curso deve ser selecionado para ser válido ```json theme={null} { "type": "course", "id": "course", "label": "Course" } ``` Course selector # Seletor de Imagem Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/image-picker Documentação para o tipo de entrada seletor de imagem em configurações de seção. O tipo de entrada seletor de imagem permite aos usuários selecionar uma imagem da biblioteca de mídia ou fazer upload de uma nova. ## Propriedades Deve ser definido como "image\_picker". Identificador único para a configuração. O rótulo mostrado no editor de tema. Informações adicionais mostradas abaixo do seletor de imagem. Propriedades adicionais para o seletor de imagem. Atualmente suportadas: * `hidden`: Valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, uma imagem deve ser selecionada para ser válida ```json theme={null} { "type": "image_picker", "id": "logo", "label": "Logo", "info": "Upload your store logo" } ``` Image Picker # Módulo Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/module Documentação para o tipo de entrada módulo em configurações de seção. O tipo de entrada módulo permite selecionar um módulo de um curso registrado no clube. ## Propriedades Deve ser definido como "module". Identificador único para a configuração. O rótulo mostrado no editor de tema. Não suportado para este tipo de entrada. Informações adicionais mostradas abaixo da entrada. Não suportado para este tipo de entrada. Propriedades adicionais para a entrada módulo. Atualmente suportadas: * `hidden`: valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, um módulo deve ser selecionado para ser válido ```json theme={null} { "type": "module", "id": "module", "label": "Module", "info": "Selecione o módulo a ser exibido na seção" } ``` module-selector # Visão geral Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/overview Tipos de entrada permitem definir diferentes tipos de configurações nas suas seções de tema. Tipos de entrada são usados para definir como as configurações aparecem e se comportam no editor de tema. Eles permitem criar uma interface amigável para personalizar suas seções de tema. ## Uso Tipos de entrada são definidos no array `settings` do seu schema de seção. Cada configuração deve ter uma propriedade `type` que especifica qual tipo de entrada usar. No exemplo abaixo, definimos uma seção com três tipos de entrada diferentes: uma entrada de texto para o cabeçalho, um grupo de alternância para o layout e um controle deslizante de intervalo para o espaçamento. ```json Schema theme={null} { "settings": [ { "type": "text", "id": "heading", "label": "Heading", "default": "Hello, world!" }, { "type": "select", "id": "layout", "label": "Layout", "options": [ { "value": "full_width", "label": "Full width", "kiwi_extra": { "icon": "fa fa-arrows-alt-h" } }, { "value": "contained", "label": "Contained", "kiwi_extra": { "icon": "fa fa-compress" } } ], "default": "full_width", "kiwi_extra": { "labeled": true } }, { "type": "range", "id": "padding", "min": 0, "max": 100, "step": 5, "unit": "px", "label": "Padding", "default": 15 } ] } ```
Resulting fields in editor
Confira documentação detalhada para cada tipo de entrada: Campo de entrada de texto básico Selecione um valor numérico dentro de um intervalo Grupo de botões de alternância para selecionar uma opção Para representar valores verdadeiro/falso Entradas de imagem Selecione um curso da área de membros Selecione um módulo da área de membros ## Propriedades Comuns Todos os tipos de entrada compartilham essas propriedades comuns: O tipo de entrada a usar. Veja tipos disponíveis acima. Identificador único para a configuração. Deve ser único dentro da seção. O rótulo mostrado no editor de tema. Valor padrão para a configuração. O tipo depende do tipo de entrada. Informações adicionais mostradas abaixo da entrada. Propriedades adicionais para a configuração. Atualmente suportadas: * `hidden`: Valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, esta configuração deve ser preenchida com um valor válido. # Range Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/range Documentação para o tipo de entrada range em configurações de seção. O tipo de entrada range permite aos usuários selecionar um valor numérico dentro de um intervalo especificado usando um controle deslizante. ## Propriedades Deve ser definido como "range". Identificador único para a configuração. O rótulo mostrado no editor de tema. Valor mínimo permitido. Valor máximo permitido. Incremento do passo. O padrão é 1. Unidade a exibir (ex., "px", "sec", "%"). Valor padrão. Deve estar entre min e max. Informações adicionais mostradas abaixo da entrada range. Propriedades adicionais para a entrada range. Atualmente suportadas: * `hidden`: valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, este range deve ter um valor e deve ser maior que zero para ser válido ```json theme={null} { "type": "range", "id": "padding", "label": "Padding da seção", "min": 0, "max": 100, "step": 5, "unit": "px", "default": 20, "info": "Ajustar o padding ao redor do conteúdo da seção" } ``` Range # Select Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/select Documentação para o tipo de entrada select em configurações de seção. O tipo de entrada select permite aos usuários escolher de uma lista predefinida de opções. ## Propriedades Deve ser definido como "select". Identificador único para a configuração. O rótulo mostrado no editor de tema. Array de objetos de opção, cada um contendo: * `value`: O valor armazenado quando esta opção é selecionada * `label`: O texto mostrado no dropdown. Pode ser traduzido usando o prefixo `t:` mais uma chave válida dos arquivos de tradução de schema. Mais detalhes podem ser encontrados em [Locales](/members-area/key-concepts/theme/locales). Valor da opção selecionada por padrão. Deve corresponder a um dos valores de opção. Informações adicionais mostradas abaixo da entrada select. Propriedades adicionais para a entrada select. Atualmente suportadas: * `hidden`: valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `labeled`: valor booleano, indica se rótulos de texto devem ser mostrados junto com ícones em cada opção * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, uma opção deve ser escolhida para ser válida ```json theme={null} { "type": "select", "id": "items_layout", "label": "Layout", "options": [ { "value": "portrait", "label": "Portrait", "kiwi_extra": { "icon": "fa fa-portrait" } }, { "value": "landscape", "label": "Landscape", "kiwi_extra": { "icon": "fa fa-image" } } ], "kiwi_extra": { "labeled": false }, "default": "portrait" } ``` Select # Texto Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/settings/input-types/text Documentação para o tipo de entrada de texto em configurações de seção. O tipo de entrada de texto permite aos usuários inserir uma única linha de texto. ## Propriedades Deve ser definido como "text". Identificador único para a configuração. O rótulo mostrado no editor de tema. Valor de texto padrão. Informações adicionais mostradas abaixo da entrada. Texto de placeholder mostrado quando a entrada está vazia. Propriedades adicionais para a entrada de texto. Atualmente suportadas: * `hidden`: valor booleano, indica se esta configuração deve ser exibida na barra de configuração do Editor de Tema * `validations`: Aplica validações a esta configuração antes de salvar. Atualmente suportadas: * `required`: Valor booleano. Se verdadeiro, esta entrada de texto deve ser preenchida para ser válida ```json theme={null} { "type": "text", "id": "heading", "label": "Título", "default": "Bem-vindo à nossa área de membros", "placeholder": "Digite o texto do título", "info": "Este texto será exibido na parte superior da seção" } ``` Text # Restrições de Template Source: https://docs.kiwify.com.br/members-area/reference/schema/fields/template-restrictions As propriedades `enabled_on` e `disabled_on` permitem restringir uma seção a certos tipos de página de template e tipos de grupo de seção. Você pode usar apenas um entre `enabled_on` ou `disabled_on`. ## Propriedades Uma lista de tipos de página de template onde a seção pode ser usada ou impedida de ser usada. Use \["\*"] para todos os tipos de template. ```json theme={null} { "enabled_on": { "templates": ["index", "login"], } } ``` ```json theme={null} { "disabled_on": { "templates": ["login"], } } ``` ## Tipos de Template Disponíveis * `index` - Página inicial * `login` - Página de login # Visão geral Source: https://docs.kiwify.com.br/members-area/reference/schema/overview O schema de seção permite definir atributos e configurações de seção para personalização de tema. A tag `{% schema %}` permite definir atributos e configurações de seção para habilitar opções de personalização no editor de tema. Define como as seções aparecem, se comportam e quais opções de configuração estão disponíveis para os usuários. Cada seção pode ter apenas uma única tag `{% schema %}`, que deve conter JSON válido usando os atributos listados abaixo. A tag pode ser colocada em qualquer lugar dentro do arquivo de seção, mas não pode ser aninhada dentro de outra tag. > **Nota:**\ > A tag `{% schema %}` é uma tag Liquid. No entanto, ela não exibe seu conteúdo nem renderiza nenhum Liquid incluído dentro dela. ## Propriedades O título da seção mostrado no editor de tema. Pode ser traduzido usando o prefixo `t:` mais uma chave válida dos arquivos de tradução de schema. Mais detalhes podem ser encontrados em [Locales](/members-area/key-concepts/theme/locales). O número máximo de vezes que uma seção pode ser adicionada a um template ou grupo de seção. O padrão é ilimitado. Um array de configurações específicas da seção que permitem aos usuários personalizar a seção. Cada configuração deve ter um ID único dentro da seção. Veja [settings](/members-area/reference/schema/fields/settings) para configuração detalhada. Um array de módulos de conteúdo reutilizáveis que podem ser adicionados, removidos e reordenados dentro de uma seção. Cada bloco deve ter um tipo e nome únicos. Veja [blocks](/members-area/reference/schema/fields/blocks) para configuração detalhada. O número máximo de blocos permitidos na seção. O padrão é 50. Configurações de seção predefinidas que os usuários podem selecionar ao adicionar seções a um template. Veja [presets](/members-area/reference/schema/fields/presets) para configuração detalhada. Configuração padrão para seções renderizadas estaticamente. Restringe uma seção a certos tipos de página de template e tipos de grupo de seção. Veja [template restrictions](/members-area/reference/schema/fields/template-restrictions) para configuração detalhada. Impede que uma seção seja usada em certos tipos de página de template e tipos de grupo de seção. Veja [template restrictions](/members-area/reference/schema/fields/template-restrictions) para configuração detalhada. Configurações adicionais para o editor de tema * `icon` - Ícone a ser associado com este tipo de seção no editor de tema * `blocks_hidden_if` - Objeto representando uma condição que oculta blocos de seção dentro do editor de tema se satisfeita * `setting` - Qual configuração desta seção verificar * `value` - Valor esperado para que a seção de bloco seja ocultada ```json theme={null} { "name": "Slideshow", "tag": "section", "class": "slideshow", "limit": 1, "settings": [ { "type": "checkbox", "id": "autoplay", "label": "Auto-rotacionar slides", "default": true }, { "type": "range", "id": "speed", "min": 3, "max": 9, "step": 1, "unit": "s", "label": "Mudar slides a cada", "default": 5 } ], "blocks": [ { "type": "slide", "name": "Slide", "settings": [ { "type": "image_picker", "id": "image", "label": "Imagem" }, { "type": "text", "id": "heading", "label": "Título" } ] } ], "max_blocks": 10, "presets": [ { "name": "Slideshow de imagens", "category": "Imagem", "settings": { "autoplay": true, "speed": 5 }, "blocks": [ { "type": "slide", "settings": { "heading": "Bem-vindo à nossa área de membros" } } ] } ], "enabled_on": { "templates": ["index"] } } ``` # Visão Geral Source: https://docs.kiwify.com.br/members-area/reference/tags Entenda as tags liquid disponíveis Tags são usadas para adicionar conteúdo dinâmico ao seu tema. Elas permitem inserir variáveis, condicionais e outros elementos nos seus templates. ## Uso Tags são envolvidas por delimitadores de chave e porcentagem `{% %}`. O texto dentro dos delimitadores não produz saída visível quando renderizado. No exemplo abaixo, verificamos se certificados estão habilitados para um curso. Se `certificate_enabled` retorna verdadeiro, então mostramos uma mensagem indicando que certificados estão disponíveis. Caso contrário, mostramos que certificados não estão disponíveis. ```liquid Código theme={null} {% if all_courses["my-course"].certificate_enabled %} Certificados estão disponíveis para este curso! {% else %} Certificados não estão disponíveis para este curso. {% endif %} ``` ```json Data theme={null} // Apenas um exemplo de dados iniciais, os dados não são reais { "all_courses": { "my-course": { "certificate_enabled": true } } } ``` ```liquid Saída theme={null} Certificados estão disponíveis para este curso! ``` Consulte a documentação detalhada para cada tag nas seguintes seções: Tags para controle de fluxo lógico e condições Tags para trabalhar com conteúdo HTML Tags para loops e manipulação de coleções Tags para construtos de sintaxe da linguagem Tags para personalização de tema Tags para trabalhar com variáveis Para documentação completa, consulte a [documentação do LiquidJS](https://liquidjs.com/tags/overview.html). # Tags condicionais Source: https://docs.kiwify.com.br/members-area/reference/tags/conditional Tags condicionais permitem controlar o fluxo dos seus templates. Tags condicionais permitem executar código apenas se uma determinada condição for atendida. Isso permite criar templates dinâmicos que respondem a diferentes estados e dados. ## `if` Executa um bloco de código apenas se uma condição for verdadeira. ```liquid theme={null} {% if condition %} // código a executar se a condição for verdadeira {% endif %} ``` A condição a ser avaliada. ```liquid Código theme={null} {% if user.is_logged_in %} Bem-vindo de volta, {{ user.name }}! {% endif %} ``` ```liquid Saída theme={null} Bem-vindo de volta, João! ``` ## `else` Fornece um bloco alternativo de código para executar quando uma condição `if` é falsa. ```liquid theme={null} {% if condition %} // código a executar se a condição for verdadeira {% else %} // código a executar se a condição for falsa {% endif %} ``` ```liquid Código theme={null} {% if user.is_logged_in %} Bem-vindo de volta, {{ user.name }}! {% else %} Por favor, faça login. {% endif %} ``` ```liquid Saída theme={null} Por favor, faça login. ``` ## `unless` O oposto de `if`. Executa um bloco de código apenas se uma condição for falsa. ```liquid theme={null} {% unless condition %} // código a executar se a condição for falsa {% endunless %} ``` A condição a ser avaliada. ```liquid Código theme={null} {% unless user.is_logged_in %} Por favor, faça login para continuar. {% endunless %} ``` ```liquid Saída theme={null} Por favor, faça login para continuar. ``` ## `case` Executa um dentre vários blocos de código, dependendo do valor de uma variável. ```liquid theme={null} {% case variable %} {% when value1 %} // código a executar se a variável for igual a value1 {% when value2 %} // código a executar se a variável for igual a value2 {% else %} // código a executar se a variável não corresponder a nenhum valor {% endcase %} ``` A variável a ser avaliada. ```liquid Código theme={null} {% assign level = "advanced" %} {% case level %} {% when "beginner" %} Comece com o básico {% when "intermediate" %} Desenvolva seu conhecimento {% when "advanced" %} Aborde conceitos complexos {% else %} Selecione um nível {% endcase %} ``` ```liquid Saída theme={null} Aborde conceitos complexos ``` # Tags HTML Source: https://docs.kiwify.com.br/members-area/reference/tags/html Tags HTML ajudam você a trabalhar com HTML nos seus templates Liquid. Tags HTML no Liquid fornecem maneiras de gerar e manipular conteúdo HTML dinamicamente. ## `style` Permite a inclusão de CSS diretamente em um template. ```liquid theme={null} {% style %} css_content {% endstyle %} ``` O conteúdo CSS a ser incluído. ```liquid Código theme={null} {% style %} .highlighted { background-color: yellow; padding: 5px; font-weight: bold; } {% endstyle %} Este texto está destacado ``` ```liquid Saída theme={null} Este texto está destacado ``` # Tags de iteração Source: https://docs.kiwify.com.br/members-area/reference/tags/iteration Tags de iteração permitem executar blocos de código repetidamente. Tags de iteração permitem executar blocos de código múltiplas vezes, o que é útil para trabalhar com coleções e arrays de dados. ## `for` Faz um loop sobre uma coleção de itens e executa um bloco de código para cada item. ```liquid theme={null} {% for item in collection %} // código a executar para cada item {% endfor %} ``` O nome da variável para a qual cada item será atribuído. O array ou coleção sobre o qual iterar. ```liquid Código theme={null} {% assign fruits = "maçã,banana,laranja" | split: "," %}
    {% for fruit in fruits %}
  • {{ fruit }}
  • {% endfor %}
```
```liquid Saída theme={null}
  • maçã
  • banana
  • laranja
```
## `else` (para loops) Executa um bloco de código se a coleção sendo iterada estiver vazia. ```liquid theme={null} {% for item in collection %} // código a executar para cada item {% else %} // código a executar se a coleção estiver vazia {% endfor %} ``` ```liquid Código theme={null} {% assign items = "" | split: "," %}
    {% for item in items %}
  • {{ item }}
  • {% else %}
  • Nenhum item encontrado
  • {% endfor %}
```
```liquid Saída theme={null}
  • Nenhum item encontrado
```
## `break` Para a execução de um loop for. ```liquid theme={null} {% for item in collection %} {% if condition %} {% break %} {% endif %} // código a executar para cada item {% endfor %} ``` ```liquid Código theme={null} {% assign numbers = "1,2,3,4,5" | split: "," %}
    {% for num in numbers %} {% if num == "3" %} {% break %} {% endif %}
  • {{ num }}
  • {% endfor %}
```
```liquid Saída theme={null}
  • 1
  • 2
```
## `continue` Pula a iteração atual de um loop for. ```liquid theme={null} {% for item in collection %} {% if condition %} {% continue %} {% endif %} // código a executar para cada item {% endfor %} ``` ```liquid Código theme={null} {% assign numbers = "1,2,3,4,5" | split: "," %}
    {% for num in numbers %} {% if num == "3" %} {% continue %} {% endif %}
  • {{ num }}
  • {% endfor %}
```
```liquid Saída theme={null}
  • 1
  • 2
  • 4
  • 5
```
## `cycle` Cicla através de um conjunto de valores e retorna um valor a cada vez que a tag é processada. ```liquid theme={null} {% for item in collection %} {% cycle value1, value2, value3 %} {% endfor %} ``` ```liquid Código theme={null} {% for i in (1..4) %} {% endfor %}
Linha {{ i }}
```
```liquid Saída theme={null}
Linha 1
Linha 2
Linha 3
Linha 4
```
## `tablerow` Cria uma tabela HTML com os itens da sua coleção. ```liquid theme={null} {% tablerow item in collection cols:number %} // código a executar para cada item {% endtablerow %}
``` O nome da variável para a qual cada item será atribuído. O array ou coleção sobre o qual iterar. O número de colunas na tabela. ```liquid Código theme={null} {% assign items = "maçã,banana,laranja,uva,melão,kiwi" | split: "," %} {% tablerow item in items cols:2 %} {{ item }} {% endtablerow %}
```
```liquid Saída theme={null}
maçã banana
laranja uva
melão kiwi
```
# Tags de sintaxe Source: https://docs.kiwify.com.br/members-area/reference/tags/syntax Tags de sintaxe fornecem controle adicional sobre o código do template. Tags de sintaxe ajudam você a controlar como seu código Liquid é processado e exibido nos templates. ## `comment` Permite adicionar comentários que não são renderizados na saída. ```liquid theme={null} {% comment %} Este é um comentário que não será renderizado. {% endcomment %} ``` ```liquid Código theme={null} Isto é visível. {% comment %} Este é um comentário que não aparecerá na saída. {% endcomment %} Isto também é visível. ``` ```liquid Saída theme={null} Isto é visível. Isto também é visível. ``` ## `raw` Desabilita temporariamente o processamento de tags, permitindo que a sintaxe Liquid seja exibida como texto. ```liquid theme={null} {% raw %} Tags Liquid aqui dentro não serão processadas. {% endraw %} ``` ```liquid Código theme={null} {% raw %} No Liquid, você pode usar {% if condition %} para criar condicionais. {% endraw %} ``` ```liquid Saída theme={null} No Liquid, você pode usar {% if condition %} para criar condicionais. ``` ## `liquid` Permite o uso de código Liquid dentro de markup de tags. ```liquid theme={null} {% liquid assign variable_name = value if condition echo 'Imprima se verdadeiro' endif %} ``` ```liquid Código theme={null} {% liquid assign name = "João" if name == "João" echo 'Olá, ' | append: name else echo 'Olá, estranho' endif %} ``` ```liquid Saída theme={null} Olá, João ``` ## `echo` Exibe um valor string. Similar ao uso de `{{ value }}`, mas pode ser usado dentro de tags `{% liquid %}`. ```liquid theme={null} {% echo value %} ``` ```liquid Código theme={null} {% assign greeting = "Olá, mundo!" %} {% echo greeting %} ``` ```liquid Saída theme={null} Olá, mundo! ``` # Tags de tema Source: https://docs.kiwify.com.br/members-area/reference/tags/theme Tags de tema ajudam você a estruturar e organizar seus templates. Tags de tema fornecem ferramentas para construir templates modulares e reutilizáveis. ## `include` Renderiza um template parcial (snippet) dentro do template atual. ```liquid theme={null} {% include 'snippet_name' %} ``` O nome do snippet a ser incluído. ```liquid Código theme={null}
{% include 'product-card' %}
``` ```liquid product-card.liquid theme={null}

Título do Produto

R$ 19,99

```
```liquid Saída theme={null}

Título do Produto

R$ 19,99

```
# Tags de variável Source: https://docs.kiwify.com.br/members-area/reference/tags/variable Tags de variável permitem criar novas variáveis Liquid. Objetos Liquid predefinidos podem ser sobrescritos por variáveis com o mesmo nome. Para garantir que você possa acessar todos os objetos Liquid, certifique-se de que o nome da sua variável não corresponda ao nome de um objeto predefinido. ## `assign` Cria uma nova variável. Você pode criar variáveis de qualquer tipo, incluindo strings, números, arrays e objetos. ```liquid theme={null} {% assign variable_name = value %} ``` O nome da variável a ser criada. O valor a ser atribuído à variável. ```liquid Código theme={null} {% assign username = "João" %} {% assign age = 25 %} {% assign is_admin = true %} {% assign favorite_colors = "vermelho,azul,verde" | split: "," %} Nome de usuário: {{ username }} Idade: {{ age }} Status de admin: {{ is_admin }} Primeira cor favorita: {{ favorite_colors[0] }} ``` ```liquid Saída theme={null} Nome de usuário: João Idade: 25 Status de admin: true Primeira cor favorita: vermelho ``` ## `capture` Captura a string dentro da tag e a atribui a uma variável. A tag `capture` é útil quando você quer combinar múltiplos valores em uma única string. ```liquid theme={null} {% capture variable_name %} conteúdo_a_capturar {% endcapture %} ``` The name of the variable to create. O conteúdo a ser capturado e atribuído à variável. ```liquid Código theme={null} {% assign first_name = "John" %} {% assign last_name = "Doe" %} {% capture full_name %} {{ first_name }} {{ last_name }} {% endcapture %} Nome completo: {{ full_name }} ``` ```liquid Saída theme={null} Nome completo: John Doe ``` ## `increment` Cria uma nova variável numérica com valor inicial de 0 e a incrementa em 1 a cada vez que é chamada. A tag `increment` cria uma nova variável com seu próprio escopo, separada de variáveis criadas com `assign` ou `capture`. ```liquid theme={null} {% increment variable_name %} ``` O nome da variável a ser incrementada. ```liquid Código theme={null} {% increment counter %} {% increment counter %} {% increment counter %} Contador: {{ counter }} ``` ```liquid Saída theme={null} 0 1 2 Contador: 2 ``` ## `decrement` Cria uma nova variável numérica com valor inicial de -1 e a decrementa em 1 a cada vez que é chamada. Como `increment`, a tag `decrement` cria uma nova variável com seu próprio escopo. ```liquid theme={null} {% decrement variable_name %} ``` O nome da variável a ser decrementada. ```liquid Código theme={null} {% decrement counter %} {% decrement counter %} {% decrement counter %} Contador: {{ counter }} ``` ```liquid Saída theme={null} -1 -2 -3 Contador: -3 ``` # Listar participantes Source: https://docs.kiwify.com.br/api-reference/events/list get /events/{product_id}/participants # Deletar webhook Source: https://docs.kiwify.com.br/api-reference/webhooks/delete delete /webhooks/{id} Delete um webhook específico, passando o webhook_id.