BLOG

Já ouviu falar em Brackets?

14 de abril de 2016By pedro0 comment

Uma nova opção para você, desenvolvedor, é a ferramenta Brackets, uma IDE leve usada em criação e edição de arquivos HTML, CSS e JavaScript e com uma configuração fácil que te possibilita trabalhar com PHP.
O software Brackets pertence a Adobe, mas é gratuito e de código-fonte aberto, possibilitando que adicione extensões para personaliza-lo. Brackets também permite trabalhar simultaneamente com vários arquivos de um projeto, possui ferramenta de edição rápida, função para seleção ou conversão de cores, compatibilidade nativa com LESS e suporte a extensões de diversos tipos.

Funcionalidades nativas

Visualização instantânea – Com a visualização instantânea do Brackets, suas mudanças feitas no código podem ser vistas em tempo real. Passando o mouse por cima de algum seletor ou tag, no seu código, pode visualizar onde ele está sendo aplicado.
Editores expandidos – Cansado de ficar saltando entre abas de arquivos? Com seu design simples, Brackets posiciona todos seus arquivos de um modo fácil para serem editados. Para agilizar ainda mais seu trabalho, você pode selecionar um ID, ou uma classe de um elemento no seu HTML e o Brackets vai expandir um editor dentro da sua janela atual, com as informações de estilo do elemento, permitindo trabalhar paralelamente com seu código CSS, sem nenhum popup.
Split mode: vertical ou horizontal – Ter dois monitores é uma grande vantagem para um desenvolvedor, mas se esse não é seu caso, Brackets tem o modo split, onde seu editor divide em duas telas, na horizontal ou na vertical.

Extensões

Nem sempre um editor vem com todas as ferramentas que precisamos, então é sempre legal dar uma incrementada com algumas extensões para facilitar o desenvolvimento ou dar aquele novo visual para o Brackets.
Quick Search – Destaca automaticamente as ocorrências da palavra selecionada.
Emmet – é kit de ferramentas de um desenvolvedor web pode melhorar muito o seu HTML & CSS fluxo de trabalho.

Desvantagens

Uma desvantagem do Brackets, pode ser a utilização das extensões, pois precisará baixar um plugin sempre que precisar de uma funcionalidade diferente. E como o Brackets é uma IDE leve, deixa a desejar quando trabalhamos com código mais pesado.

Diferencial

O grande diferencial do Brackets é sua função Extract (Preview), onde você pode extrair informações de um PSD. Extract for Brackets traz informações de estilo para seu CSS, um código simples e limpo, por meio de dicas. Podem ser extraídos do PSD estilos como: cores, fontes, gradientes e medidas. Além disso também pode gerar imagens a partir das camadas do PSD, sem precisar utilizar o Photoshop, tudo direto do brackets.
Mais detalhes sobre essa funcionalidade, podem ser vistas no nosso vídeo sobre essa integração.

Vamos dar um Tok Digital na sua empresa

12 de abril de 2016By Eduardo Cardillo2 Comments

Bem vind@ a Tok Digital!
Somos uma pequena empresa trabalhando para pequenas empresas, nesse contexto prestamos um serviço que agências maiores prestam, porém a um preço viável para pequenos negócios. Desenvolvemos sites personalizados de verdade!
E nossos projetos são elaborados para quem usa a internet e eventualmente para não usa também, vou explicar:

Internet nos dias de hoje

Cada vez mais pessoas estão usando a rede mundial de computadores (já não é mais de computadores a algum tempo, falaremos sobre isso em breve), em casa no trabalho, caminhando no parque, no ônibus, em qualquer lugar.
Os tipos de conexão (ADSL, fibra ótica, 3G, 4G) variam muito, bem como os dispositivos utilizados, mas o que importa mesmo é: O que pessoas fazem quando estão conectadas na rede?

Redes Sociais

Em sua imensa maioria usam a internet para acessar redes sociais, e desta forma se aproximar de pessoas sem precisar sair de onde estão.
Facebook, Instagram, Snapchat, WhatsApp, entre outras, você, usuário, mostra sua vida em texto, fotos, vídeos e áudio e seus amigos, fãs, seguidores, curtem, compartilham, comentam, enfim interagem com você através de suas publicações.
Apesar do sucesso estrondoso, as redes sociais são momentâneas, da mesma forma que aparecem enchendo suas páginas de usuários e informações, são engolidas por outras novas que se adaptam melhor ao perfil de “consumo” dos usuários, fazendo com que sua vida lá dentro se resuma a museu a exemplo do Orkut.

App’s

Com o crescimento da venda de smartphones, cada vez mais os usuários procuram aplicativos (apps) que resolvam suas vidas de forma rápida e eficiente.
Com este movimento cada vez mais empresas querem oferecer seus produtos e serviços por meio de apps. Todavia essa estratégia deve ser bem elaborada pois nem todo o negócio funciona com um app, muitas vezes o aplicativo não cumpre uma função de venda mas uma forma de relacionamento ou até mesmo cria uma imagem da empresa para o usuário.

Blogs

Essa mídia foi a porta de entrada da Web 2.0, quando a internet de fato deu voz aos usuários que passaram a expor seus pensamentos em forma de texto, abrindo a oportunidade para diálogos por meio de comentários.
Atualmente segue sendo muito utilizado já que para mecanismos de busca o que conta é ter conteúdo para mostrar que a empresa domina o negócio com o qual trabalha.

Empresas na internet

Existem diversas formas de uma empresa estar presente na internet, desde um espaço publicitário em sites de classificados, passando por páginas em redes sociais até seu próprio ambiente um site, blog, sistema ou até uma loja virtual (e-commerce).
Esses últimos de certa forma são simples de serem criados, basta um cadastro rápido no site que promete a criação de sites grátis e o empresário já terá um site no ar, disponível na internet, alguns inclusive com possibilidade de criação de lojas virtuais.

Benefícios de sites personalizados

O empresário se depara com a questão: se posso criar meu site, eu mesmo, grátis, porque contratar uma empresa para desenvolver um por mim? A resposta é simples e complicada ao mesmo tempo.
Começamos com outras perguntas: o tempo que será gasto na criação o empresário não poderia estar vendendo ou organizando sua empresa? O empresário sabe qual o melhor local na página inicial para se colocar o formulário de contato? E seus produtos, estão acessíveis?
Podemos fazer perguntas mais técnicas: as palavras-chave utilizadas são coerentes com o que os usuários buscam na internet? A estrutura do site auxilia os mecanismos de busca na indexação? O site está cumprindo uma função clara de forma eficiente?
Se sua empresa está querendo fazer um trabalho sério na internet, contrate um profissional para lhe auxiliar, ou seja você arrumar sozinho seu celular ou leva até um técnico?
Somos a Tok Digital, seja bem vind@, teremos o maior prazer em conversar e tomar um café!

Problemas com Produto Variável com preços iguais – WooCommerce

26 de maio de 2015By Eduardo Cardillo2 Comments

Recentemente em um projeto de loja virtual enfrentamos um problema que em um primeiro momento parecia incoerente. Ao criar um Produto Variável, onde as variações tinham o mesmo preço, sua página deixava de mostrar o preço do produto.
Depois de alguns teste e buscas no nosso amigo Google, encontramos uma solução e uma explicação:
“Na realidade, este se destina a ser uma função de melhoria da performance / memória para evitar a renderização e processamento de dados duplicados variação no atributo de dados HTML. Mas ele acaba causando problemas, pois resulta na saída HTML de variações não sendo consistente de produto para produto. Realmente toda esta questão é devido a más práticas sendo usado por WooCommerce para tornar o conteúdo dinâmico para as variações, mas o que você pode fazer.”
Para resolver, basta incluir o código abaixo no arquivo functions.php do seu tema.
add_filter('woocommerce_available_variation', function($available_variations, WC_Product_Variable $variable, WC_Product_Variation $variation) { if (empty($available_variations['price_html'])) { $available_variations['price_html'] = '<span>' . $variation->get_price_html() . '</span>'; }return $available_variations; }, 10, 3);
Espero ter ajudado mais colegas!
Fonte: http://stackoverflow.com/

Transparência (linear, radial) em imagens no Adobe Illustrator

6 de abril de 2014By Eduardo Cardillo15 Comments

Depois de vasculhar a internet e usar várias soluções paliativas resolvi acabar com isso e pesquisar a fundo o tema: Como criar transparências lineares e/ou radiais em imagens no Adobe Illustrator?
Pois bem, fui direto na fonte, adobe.com, e lá comecei a ler o manual do software, não encontrei este item especificamente, mas encontrei algo que me levou a solução do meu problema. Pois bem vamos ao que interessa.
Selecione sua imagem e abra a janela Transparência. Se a janela Transparência não estiver ativa, clique no menu Janela > Transparência.
Clique em Criar máscara. A corrente ao lado da imagem, na janela Transparência, vai ser habilitada e ao lado da corrente um quadrado preto irá aparecer. Sua imagem vai ficar invisível.
Clique sobre o quadrado preto, na janela Transparência para entrar na máscara recém criada.

Com a Ferramenta Retângulo (M) crie um retângulo sobre a imagem e aplique um preenchimento gradiente na janela Gradiente. Se a janela Gradiente não estiver ativa clique no menu Janela > Gradiente.
Pronto, agora é só ajustar conforme necessário e quando estiver pronto, volte a janela Transparência e clique no quadrado da imagem para sair da máscara.

Não sei você, mas isso me liberou algum tempo de trabalho!

Dúvidas, sugestões ou qualquer outra coisa, use a vontade o formulário de comentários abaixo.
Obrigado pela visita!

Gerar Mapa do Site no WordPress

31 de agosto de 2013By Eduardo Cardillo0 comment

Uma das ações para melhorar a indexação do seu site pelos buscadores é disponibilizar um sitemap (Mapa do Site). Com ele os buscadores conhecerão o conteúdo completo do seu site, com link para as páginas.
Tenho utilizado para isso um Plugin que faz esse trabalho de forma automática e dinâmica, com pouca configuração e confiável.

Google XML Sitemap

MSN agora é Skype! Saiba como vincular…

18 de julho de 2013By Eduardo Cardillo1 Comment

Desde o mês de abril deste ano (2013) a Microsoft deixou de manter o MSN Messenger no Brasil, último país a sofrer esta mudança. A partir disto os usuários precisam baixar e instalar o Skype, novo sistema de mensagens instantâneas da Microsoft, para manter suas conversas com seus amigos do MSN.
Antes disto acontecer, muitos usuários já haviam migrado suas conversas, por mensagens instantâneas, para o Facebook, já que “todos” seus amigos estão lá e sempre online. O fato é que em muitas empresas o acesso a redes sociais é bloqueado para melhorar a produtividade de suas equipes, então muitas pessoas ainda sentem a necessidade de usar o extinto MSN.
Pois bem, vou mostrar que em pouco passos você terá uma conta no Skype e ainda terá todos seus amigos do MSN no Skype.
1. Baixe o Skype, clicando na imagem abaixo, e instale em sua máquina.

2. Após instalar o Skype, execute-o, e na janela que abrir clique em Conta Microsoft a direita da janela.

3. Preencha seus dados de acesso ao antigo MSN (e-mail e senha) e clique em Entrar.

4. Se você já possui uma conta no Skype clique em Tenho uma conta do Skype (botão à esquerda), caso contrário clique em Sou novo no Skype (botão à direita) para criar uma conta.

4.1. Se você clicou no botão à esquerda, pois já possui uma conta no Skype, preencha suas credenciais de acesso ao Skype (usuário e senha) para vincular as duas contas (MSN + Skype) e clique em Conectar.

4.1. Se você clicou no botão à direita, pois não possui uma conta Skype, confirme se deseja receber informações sobre novos produtos entre outros e clique em Aceito – criar uma conta do Skype para criar.

Janela para criar uma nova conta do Skype.

5. Quase pronto! Agora você irá conferir as configurações do seu computador para garantir boas conversar. Clique em Continuar.
6. Teste seu fone, microfone e webcam:

Fone: Clique em Teste o som, uma gravação do Skype deve ser escutada por você;
Microfone: enquanto você fala a barra de volume deve se mecher;
Webcam: Se sua webcam (caso tenha uma instalada) estiver funcionando normalmente você estará aparecendo na tela.

7. Decida entre escolher uma foto para seu perfil agora ou mais tarde. Esta foto pode ser escolhida de um arquivo em seu computador ou até ser tirada na hora usando sua webcam. Clique na opção desejada no canto inferior direito.
Observe que no final do segundo parágrafo, está o seu nome de usuário Skype (sem o “live:”), anote-o e passe para seus amigos para que eles o adicionem.
8. Se decidiu por adicionar uma foto agora, tire sua foto usando sua webcam clicando em Tirar foto no canto inferior direito ou escolha uma imagem de seu computador clicando em Procurar… também no canto inferior direito.
9. Pronto! A esquerda da janela aparecerão seus amigos e abaixo de seus nomes estará indicado se foram adicionados pelo Skype ou são amigos do MSN.
Divirta-se conversando por chat com seus amigos ou fazendo chamadas de audio e vídeo.
Se durante este processo algo não aconteceu como esperava ou algum de seus componentes (fone, microfone ou webcam) não estão funcionando, talvez eu possa lhe ajudar, basta deixar um comentário abaixo.

Corel substitui "aspas duplas" por «setas duplas»

3 de junho de 2013By Eduardo Cardillo21 Comments

Instalei o novo Corel Draw X6, que já nem mais tão novo é assim, e surpreso descobri que por padrão ao inserir aspas duplas ele substitui por setas duplas. Algumas pessoas estão atribuindo este fato a configurações de teclado do próprio sistema operacional (Techmundo, Yahoo), porém o problema é resolvido facilmente no próprio Corel Draw X6.
Conforme outras ocorrências parece que este “problema” vem desde a versão X4 do Corel Draw (ScriptBrasil).
Resolva em três passos simples:

Vá ao menu Ferramentas e clique em Opções.
Na tela que abrir, procure na lista de itens a sua esquerda o item “Texto” e clique no sinal de +, em seguida clique em “Correção rápida”.
Na área de configurações de Correção Rápida altere os campos Abrir e Fechar referente a aspas duplas, clique em OK.

Observe que nesta mesma tela você ainda tem outras opções que podem estar lhe incomodando diariamente e talvez possam ser alteradas.

Inserindo imagens em posts/páginas no WordPress

23 de maio de 2013By Eduardo Cardillo1 Comment

Escolhendo…

Posicione o cursor do mouse no ponto do texto onde você deseja inserir a imagem depois clique em “Adicionar Mídia”.
Abrirá uma janela mostrando as imagens constantes na sua biblioteca, imagens que já foram utilizadas em outros posts ou páginas, se desejar usar uma delas, clique sobre a imagem desejada, caso contrário clique em “Fazer upload dos arquivos” que fica logo abaixo do título Inserir Mídia.

Configurando…

Detalhes do anexo
Após ter feito upload ou ter selecionado uma das imagens constantes em sua biblioteca, você precisará configurar esta imagem usando os campos a seguir:

Título: aparece quando o usuário passa o mouse sobre a imagem;
Legenda: fica abaixo da imagem;
Texto alternativo: aparece no lugar da imagem quando, por algum motivo, ela não é carregada;
Descrição: descreve com mais detalhes a imagem e aparece quando o usuário clica sobre ela;
Alinhamento: posiciona a imagem perante o texto;
Link para: indica o que acontece quando usuário clicar sobre a imagem;
Tamanho: defini o tamanho da imagem no post, sendo que ao clicar irá mostrar o tamanho original da imagem.

Clique em “Inserir no post” no canto inferior direito da janela.

Adicionar/Editar Post no WordPress

22 de maio de 2013By Eduardo Cardillo4 Comments

Para facilitar o gerenciamento do seu novo site em WordPress, vou postar toques de como utilizar esta maravilhosa ferramenta. Começo mostrando como adicionar ou editar posts no WordPress, que podem estar sendo utilizados para diversas funções, vou explicar:
Esta ferramenta originalmente foi desenvolvida para gerenciar Blog’s e com o tempo foi se aprimorando até que hoje podemos utiliza-la para diferentes tipos de publicações na internet (blog, site, loja virtual, hotsite, portal, etc). Para cada tipo de publicação usa-se a estrutura do WordPress de forma diferente. Então quando entrego um site costumo orientar meus clientes como devem proceder para atualizar seus sites.

Então vamos aos posts: acesse seu Painel Administrativo, para os sites mais recentes use o endereço abaixo, insira seu usuário e senha.

www.seusite.com.br/prd/wp-admin

Para adicionar ou editar um post basta passar o mouse sobre o menu Posts na lateral esquerda do Painel Administrativo e escolher a opção desejada.
Neste mesmo item você poderá ainda gerenciar suas categorias e tags, que assim como os posts tem funções diferentes de acordo com o site. Em geral categorias separam os posts por assunto enquanto tags são as palavras-chave de cada post.

Na página de adição/edição temos alguns campos principais que vou explicar agora, são eles:
Para blogs o nome do campo já diz tudo, mas para uma empresa que usa posts para mostrar seus projetos esse é o campo onde se coloca o nome do projeto por exemplo;
Neste local é inserido o conteúdo do post (textos, imagens, formulários, tabelas, etc). Vou criar um post especificamente para falar sobre essa área que tem muitos recursos;
O resumo serve para apresentar uma prévia do post quando este aparecer em uma lista na página inicial ou página de categorias;
Discussão é onde você define se o post irá ter comentários ou não, se não deseja que o usuário comente sobre este conteúdo clique para tirar a seleção deste item;
Publicar já diz tudo, onde você irá publicar o post e ele passará a aparecer no site. Durante a edição do post o WordPress salva automaticamente seu post por motivo de segurança, mas se você quiser escrever um pouco em cada dia, pode clicar em “Salvar como rascunho” e voltar outra hora para continuar de onde parou, ele ficará salvo na sua lista de posts no painel administrativo mas não aparecerá no site.
Clicando em “Visualizar” abrirá outra janela mostrando como ficará o post quando publicado. Ali pode-se ainda mudar o status, de publicado para rascunho por exemplo para tirar um post do ar, alterar a visibilidade para que todos vejam ou somente pessoas autorizadas, mudar a data de publicação e até programar uma publicação e mandar o post para a lixeira, que funciona como a lixeira do seu computador;
Escolha a categoria(s) a qual o post pertence e selecione. Quando selecionado uma categoria filha não é obrigatório selecionar a mãe, essa necessidade vai depender de como foi desenvolvido seu site, eu sempre informo essa necessidade se houver. Você pode adicionar categorias nesta página e decidir se ela será filha ou mãe, mas detalhes sobre ela (descrição, slug) somente serão editados no menu Posts > Categorias;
Digite as palavras-chave do post, separadas por vírgula, ou escolha entre as mais usadas no seu site.
Aqui será selecionada a imagem-chave do post, ela geralmente é usada junto com o resumo.

Faça suas postagens, publique e pronto! Simples assim, agora se ficou alguma dúvida, fique a vontade para me questionar aqui embaixo, em “Deixe seu comentário”.

Porque uso WordPress

23 de novembro de 2012By Eduardo Cardillo0 comment

Para aqueles que nunca ouviram falar em WordPress, primeiramente vou explicar o que é, melhor vou passar a explicação para quem o conhece melhor do que ninguém, os integrantes do Fórum WordPress Brasil:

O WordPress é uma plataforma semântica de vanguarda para publicação pessoal, com foco na estética, nos Padrões Web e na usabilidade. O WordPress é ao mesmo tempo um software livre e gratuito. Em outras palavras, o WordPress é o que você usa quando você quer trabalhar e não lutar com seu software de publicação de blogs.

Então se você deseja ter um site, ou já possui um mas sua atualização é complicada, essa é a ferramenta que você está precisando!
Agora que você já sabe o que vou elogiar, vamos as vantagens:

Melhor Custo × Benefício

Claro, a maior de todas as vantagens, pensando como empresa, já que estamos falando de um sistema grátis! Sim, ao contrário de muitas aplicações o WordPress é grátis, então você não precisará desembolsar nenhum tostão para usá-lo ou ainda, não vai precisar ficar se “culpando” por estar utilizando um sistema de forma ilegal!

Lembrando que estamos falando apenas do sistema que irá gerenciar seu site, não quer dizer que você não terá custos com ele, não podemos esquecer que você precisa ter um domínio, que no Brasil custa R$ 40,00 / ano, um servidor para hospedar seu site, que você pode encontrar boas empresas de hospedagens por preços a partir de R$ 14,00 / mês, e um desenvolverdor que você pode entrar em contato por aqui para conversarmos sobre seu projeto 😉

Praticidade

O WordPress oferece um suporte ao desenvolvedor muito importante, fazendo com que este não precise escrever alguns processos, e usar o tempo para se preocupar com a estética do seu site e aprimorar a experiência dos usuários ao visitá-lo.

O seu colaborador por sua vez, é o maior beneficiado pela praticidade do WordPress, pois é ele que irá usá-lo como sua ferramenta de trabalho, incluindo e atualizando conteúdo a qualquer hora de onde estiver, quer seja de um computador, de um tablet ou até mesmo do seu celular. Com telas que facilitam o trabalho e destacam os recursos disponíveis o colaborador faz seu trabalho com muito mais eficiência.

Usabilidade

Com sua base de dados inteligente, o usuário navega em seu site de forma simples, encontrando o que procura com naturalidade, já que o WordPress auxilia na indexação e distribuição do conteúdo em seu site.

Dinamismo

Atualmente as notícias caem na internet como uma rede de pesca solta seus peixes no barco “uns em cima dos outros”, então seu site precisa acompanhar este rítmo. Pra isso o WordPress conta com Plugins que ajudam na interação do usuário com as novidades do seu site, mostrando a todo o momento novos conteúdos publicados, integrando seu site com redes sociais e muito mais, fazendo todo esse trabalho sozinho, sem precisar que você clique ou arraste nenhum botão na área administrativa.

Flexibilidade

Este é um ponto importante, pois é uma das qualidades de qualquer CMS (Content Management System). Contudo o WordPress em especial faz o que muitos, e estou falando de aplicações pagas, não fazem, ele deixa as portas abertas para você entrar, sem chaves nem maçanetas, simples assim é só empurrar e as portas se abrem.

O que eu quero dizer com isso? Se seu site precisa de uma funcionalidade muito específica, e nem o WordPress, nem o Plugin dão jeito de resolver, uma simples abertura de arquivo de configuração e alteração de duas ou mais linhas resolvem, simples assim! Sem precisar contactar o suporte, esperar dias até o consultor te atender e blá blá blá.

Fique calmo, esta flexibilidade toda é apenas para administradores do site, isso tudo não quer dizer que qualquer pessoa podem entrar nos arquivos de configuração do site e sair fazendo modificações. Podemos dizer que as portas internas não possuem chaves, mas a porta externa, a principal, essa sim, possui chave e tranca de ferro, e uma barra de ferro atravessada, e….

Confiança

Sim, pode deixar suas informações nas mãos deste poderoso CMS que ele não vai sair espalhando para quem quiser saber. O fato de ser grátis não faz com que o WordPress deixe de ser seguro. Possui uma poderosa ferramenta administrativa que classifica os usuários cadastrados em níveis de segurança para que cada tenha acesso apenas as funções que lhe competem. E como disse antes, fecha bem a porta de entrada para quem não pode entrar.

Estabilidade

Bem, para o quesito estabilidade, podemos dizer que é influenciado por uma série de fatores, externos e internos, mas no que tange a responsabilidade do WordPress, pode confiar pois ele é muito confiável, não lhe deixará na mão.

Gostou do que leu? Está pensando em fazer um site ou atualizar o seu?
Entre em contato, tenho certeza que podemos resolver isso rápido e barato!
Está em dúvidas? Conheça alguns projetos feitos com o WordPress.