Colocação de widgets

O que é: Um widget é um bloco de conteúdo (texto, lista, slider, etc.) que pode ser colocado numa secção de uma página. Aqui define qual widget aparece em qual secção de cada página. Os widgets de sistema (OTA, atrações, experiências) já têm implementação; os que criar ficam disponíveis para colocar — a implementação no HTML/JS fica a seu cargo.

Fluxo de uso

• 1. Criar widget (opcional): Se precisar de um widget novo, indique um id (slug: só letras minúsculas, números e _) e um nome. O id é o que o código usa para identificar o widget.
• 2. Escolher página: Selecione a página HTML (ex.: Proprietários, Detalhe experiência).
• 3. Atribuir por secção: Para cada secção listada, escolha no dropdown qual widget exibir (ou «Nenhum»). Pode marcar «Visível» para exibir na página pública e definir a «Ordem» (menor número = primeiro). Guarde.
• 4. Ver resultado: Use «Ver página» para abrir a página pública e confirmar.

Como implementar um widget numa página HTML

Para uma secção receber widgets, a página deve ter um slot com o data-widget-slot igual ao id da secção. Exemplo:

<section id="widget-slot-ota_section" data-widget-slot="ota_section"><div id="ota-widget-placeholder"></div></section>

No JavaScript da página: (1) obter o nome do ficheiro (ex. owners.html); (2) pedir GET api/page_widgets.php?page=owners.html; (3) na resposta placements, ver se existe uma entrada com section === "ota_section" e widget === "ota_platforms"; (4) se sim, mostrar a secção e injectar o conteúdo do widget no placeholder (por exemplo criar o DOM e chamar a API de OTAs). Se o widget for personalizado, o código deve tratar esse widget id e gerar o HTML/JS correspondente.

Secções disponíveis por página estão definidas na API (page_widgets.php). Para adicionar novas páginas ou secções é necessário editar esse ficheiro.