Para esta aula vamos criar uma pequena aplicação de agendamentos de uma salão de beleza. Observando que Visual Studio é um nome perfeito para um salão de beleza. Vamos para a Interface, note que iremos usar um MonthCalendar para escolher a data em um calendário e um MasketTextBox para mascarar o formato da hora. O […]
Como fazer um overlay com texto no Elementor. Vamos aprender a criar o efeito mostrado no GIF, que uma sobreposição à uma imagem com texto. Note que na imagem existe um efeito de sobreposição (overlay) com texto. Com a versão gratuita do Elemento é possível criar apenas o overlay sem o texto, mas, com um […]
O gerador de Lero Lero é um software que gera textos prolixos. Embora isso possa parecer uma piada, estes tipos de softwares são usados por exemplo para gerar horóscopos, textos de autoajuda e discursos políticos. Criamos na sala de aula um destes geradores de lero lero usando uma tabela disponibilizada na internet, a qual não […]
Quando copiamos imagens dos bancos de imagens, normalmente No projeto de um site é importante usar imagens de boa qualidade e o mais importante; que tenha direito de uso. A maioria das imagens encontradas no Google não oferecem direito de imagem e isso pode ser um grande problema, a solução é pesquisar imagens em bancos […]
Depois do grande sucesso do curso intensivo de WordPress, irei dar continuidade ensinando a criar lojas virtuais usando o plugin WooCommerce, totalmente gratuito capaz de criar um sistema de e-commerce em questões de minutos. Eis o cronograma: Instalação do WP, instalação do tema OceanWP e suas configurações básicas Instalação do plugin WooCommerce as suas configurações […]
É com grande satisfação que formamos a primeira turma de 2018 no curso de criação de sites usando a plataforma WordPress. Além do conhecimento adquirido por estes estudantes, ficou a solidariedade da doação de alimentos que foram encaminhados para uma instituição de caridade que promove a entrega de cesta básicas para famílias carentes de Atibaia. […]
Se você ainda não conhece a biblioteca CSS Animate.CSS, veja a aula aqui – Criando animações em seu site com animate.css Esta biblioteca demonstra nos seus exemplos como criar efeitos durante o carregamento de um elemento, no entanto, podemos também criar efeitos após o elemento já estar carregado na página, um exemplo é um efeito […]
O tema OceanWP é um dos temas gratuitos mais versáteis disponíveis para WordPress atualmente. Ele é um tema Multi-Purpose, ou seja, pode ser utilizados para vários propósitos diferentes, podemos usá-lo para criar sites simples ou mais sofisticados como um e-commerce. O OceanWP também tem um item essencial que irá colaborar diretamente com o sucesso do […]
Em projetos de web sites é sempre importante usar boas imagens. O problema é que muitas das imagens disponibilizadas no Google possuem algum tipo de direito autoral, situação esta que cabe processo em esfera internacional, o autor pode cobrar por uma licença de uso ou alguma espécie de royalties, além de multas pelo uso indevido. […]
As principais empresas de hospedagem de sites já oferecem recursos automáticos que permite a instalação simplificada e rápida do WordPress, normalmente elas oferecem um painel de controle no qual o cliente consegue instalar diversas aplicações no ambiente de hospedagem. Porém, para quem está começando a trabalhar com o WP, é interessante que façamos a instalação […]
As vezes precisamos que o nosso aplicativo abra páginas externas mas não queremos que o usuário tenha que sair do aplicativo para poder navegar. O plugin cordova-plugin-inappbrowser resolve esta paradinha para você. A função abaixo deve ser utilizada junto com a função que verifica a conectividade com a Internet. Se você ainda não sabe como […]
Se em seu aplicativo você precisar checar a conexão com a Internet, o plugin cordova-plugin-network-information resolve esta paradinha para você. A função a seguir retorna se o dispositivo possuiu uma conexão com a internet. internet = 'No'; /* Verifica Conexão com a Internet */ function verificaInternet() { var networkState = navigator.connection.type; var states = {}; […]
Que tal dar um charme ao seu aplicativo? Imagine que na primeira execução do App o usuário veja um tour explicativo sobre os recursos do App e dicas de utilização. Isso é possível usando a biblioteca TinySlider.JS que oferece uma grande varidades de efeitos de slides, vamos lá; Faça o download da bilbioteca gratuita TinySlider.JS […]
Pacote de ícones do Framework 7 Faça o download do pacote de ícones no GitHub; https://github.com/framework7io/framework7-icons Descompacte o arquivo Copie a pasta framework7-icons-master para dentro do seu projeto, cole dentro da pasta www. Como usar os ícones do Framework 7 Edite o arquivo index.html, acrescente a seguinte linha <link rel="stylesheet" href="framework7-icons-master/css/framework7-icons.css"> dentro do bloco <head> […]
Para criar um menu lateral no Framework 7 é bem simples, basicamente precisamos de dois códigos; código do painel lateral (side panel) No index.html, utilize o código abaixo logo após a linha <div id="app">. <div class="panel panel-left panel-reveal"> <div class="block"> <div class="list simple-list"> <ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul> </div> </div> </div> Código […]
Nesta aula eu ensino como criar as páginas internas do App – Como criar uma interface para seu aplicativo mobile usando Framework 7. O código a seguir acrescenta um botão voltar dentro das páginas internas e deve ser colocado dentro da DIV da NAVBAR. <div class="left"> <a href="#" class="back link"> <i class="icon icon-back"></i> </a> </div> […]