Artigos sobre: Opções do editor

Previsão do Tempo no app

Caso deseje inserir a previsão do tempo de uma cidade no app você precisará usar uma aba que tenha um espaço em branco para inserção de texto, para que seja possível usar o Código Fonte.

Obs: usaremos uma plataforma embedada em um código html. Portanto estamos limitados às cidades cobertas por essa plataforma.

Veja como a previsão ficará no app.



Colocando no app:

  • Abra uma aba Lista ou Página em Branco e clique no campo "Código-Fonte";

  • Em outra aba busque no navegador por Forecast7 + o nome da sua cidade e entre no resultado do Forecast7;

  • Copie o código do navegador correspondente a previsão do tempo liberada pelo Forecast7 para a sua cidade;

  • Copie o código abaixo e cole na aba de Código-Fonte dentro do editor da Fabapp:


    <style type="text/css">.botoes{

    top: 100%;

    position: fixed;

    z-index: 999;

    display:flex;

    margin:0 auto;

    left:0; right:0;

    width: 242px;

    text-align:center;

    background-color: #f8bc62;

    box-shadow: 0 1px 3px #00000033;

    max-width: calc(100% - 46px);

    min-height: 42px;

    justify-content: center;

    align-items: center;

    border-radius: 24px;

    font-size: 14px;

    font-weight: 600;

    margin-bottom: 22px;

    font-family: "Open sans", sans-serif;

    color: #2a140b;

    }

    </style>

    <iframe srcdoc="&lt;a class='weatherwidget-io' data-cke-saved-href='https://forecast7.com/pt/n23d55n46d63/sao-paulo/' href='https://forecast7.com/pt/n23d55n46d63/sao-paulo/' data-label_1='Sao Paulo' data-label_2='Meteorologia' data-theme='pure' &gt;São Paulo Clima&lt;/a&gt;

    &lt;script&gt;

    !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src='https://weatherwidget.io/js/widget.min.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','weatherwidget-io-js');

    &lt;/script&gt;" style="position:fixed; top:0; left:0; bottom:0; right:0; max-width:315px; height:100%; border:none; margin:0 auto; padding:0; overflow:hidden; z-index:999999;">Your browser doesn&#39;t support iframes</iframe>
  • Agora você deverá alterar os 2 links do código HTML copiado, substituindo pelo link que você obteve na plataforma da Forecast7. Veja a imagem abaixo:


    Importante: Quando for substituir os links não altere mais nada no código! Somente substitua os links, sem retirar as aspas.
  • Se quiser, altere também o nome da cidade de São Paulo que aparece mais abaixo no código. Como mostra a imagem abaixo:

  • Agora clique sobre o botão de Código-Fonte no editor novamente para fechar o campo de edição HTML e clique em salvar. Nesse momento você verá o resultado do seu trabalho no pré visualização do celular que aparece na tela.


    Utilizando outra plataforma de previsão de tempo:

    Caso você não tenha obtido sucesso com a questão acima você pode utilizar a plataforma https://ibooked.com.br/widgets/weather
  • Acesse https://ibooked.com.br/widgets/weather e altere a localização (no canto superior direito). Espere as opções carregarem e selecione a sua cidade;

  • Escolha a terceira opção de widget:



  • Depois clique em obter código HTML e depois a opção "uma imagem";

  • Copie o código que aparecerá em tela e cole dentro do editor de texto da Fabapp selecionando a opção Código-Fonte;

  • Clique novamente sobre a opção Código-Fonte e salve.

Atualizado em: 09/12/2022