Mundo do Blog - O que você procura acha aqui

sábado, 31 de outubro de 2015

Blog do LeoCabral

Posted: 31 Oct 2015 04:32 AM PDT

The post teste appeared first on Léo Cabral.

quarta-feira, 28 de outubro de 2015

O que é um ataque DDoS? – Como se proteger?

Posted: 28 Oct 2015 03:57 AM PDT

Com certeza que o leitor já terá navegado por um site na Internet que, de repente, começa a ficar lento e/ou, inclusivamente, a falhar… enquanto outros sites funcionam normalmente. Entre os diversos motivos que podem ser apontados, destacamos a possibilidade do servidor responsável pelo website estar a ser alvo de um "DDoS attack" (Distributed Denial of Service attack),… Ler Mais » O post O...

Aceda ao nosso site para continuar a ler, clique no título.

terça-feira, 27 de outubro de 2015

Visual Dicas

Gerador de botões em CSS gratuito

Posted: 26 Oct 2015 11:28 AM PDT

Botões personalizados

Nos artigos Crie botões personalizados para o seu Blogger e Crie botões personalizados no Wordpress mostramos algumas formas para você criar botões personalizados e inserí-los em blogs desenvolvidos no Blogger ou no Wordpress.

Botões são elementos de layout que servem para indicar e incentivar os leitores de um blog ao clique, ou seja, levam os seus visitantes a executarem um evento de interação. Por isso, é muito importante que os botões sejam atrativos, fiquem bem localizados e que combinem com o layout do site onde serão incluídos.

Mas se você quer fazer algo mais rápido, bateu uma preguiça ou é iniciante no mundo CSS, vamos apresentar nesta postagem um aplicativo gratuito e bem bacana para você criar seus próprios botões em CSS com apenas alguns cliques. Veja a seguir:

Utilizando o Gerador de botões

Acesse o site: http://css3buttongenerator.com/

1) Defina a font-family (Arial, Georgia ou Couries New), font-color (cor da fonte), font-size (tamanho da fonte) e font-shadow (sombreamento da fonte).

Para definir a font-family mantenha a caixa de seleção acionada e escolha entre as fontes disponíveis (Arial, Georgia ou Couries New).

Para definir a font-color, digite o código da cor ou clique no botão ao lado para definir a cor da fonte do botão.

Para definir o tamanho da fonte, digite o valor em px ou deslize o cursor ao lado.

Para criar sombreamento da fonte, marque a caixa de seleção font-shadow. Defina a cor da fonte e os parâmetros x, y e blur deslizando os cursores. Você poderá testar vários tipos de sombreamento e caso não encontrar o que deseja poderá desativar a caixa de seleção voltando ao padrão sem sombreamento.

2) Defina dimensões da caixa do botão clicando na aba +Box.

Da mesma forma que os ajustes anteriores, defina o box-shadow (sombreamento da borda do botão), padding-top (espaçamento entre o texto e a borda superior do botão), padding-right (espaçamento entre a borda direita e o texto do botão), padding-bottom (entre a borda inferior e o texto do botão) e finalmente padding-left (entre a borda esquerda e o texto do botão).

Atenção: Se você selecionar a caixa padding você definirá o valor dos espaçamentos superior, direito, inferior e esquerdo todos iguais.

3) Na aba +border defina o border-radius (raios dos vértices da borda). Selecione a caixa border caso queira definir a cor, estilo e espessura da borda do botão. Com a caixa border desmarcada a borda do botão terá a mesma cor do fundo.

4) Na aba +Backgroud defina a cor de fundo do botão. Se você selecionar solid, a cor será uma única cor sem efeito gradiente (mistura de cores). Se você optar por gradiente, coloque de preferência a mesma cor com tons diferentes nos parâmetros em start color e end color.

5) Na aba +Hover você irá definir os parâmetros da pseudo classe Hover, ou seja, promoverá uma mudança cor quando passar com cursor do mouse sobre o botão. Para isso escolha cores diferentes da que você utilizou na aba +Background.

Dica: Para facilitar, apenas inverta os valores star-color e end-color dos parâmetros que você utilizou na aba +Background.

Pronto, agora é só copiar o código CSS e inserí-lo no blog.

Colocando o código CSS no blog

Se você estiver utilizando as plataformas CMS do Blogger ou Wordpress, siga os tutoriais abaixo:

Como inserir códigos CSS no Blogger

Como usar CSS no Wordpress

Utilizando o código CSS nas suas postagens

Para você definir um botão com o estilo criado no CSS Button Generator, basta colocar a classe btn em qualquer hyperlink HTML que você utilizar nas suas postagens, como mostramos no exemplo abaixo:

<a class="btn" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Se você tem dúvidas sobre como colocar códigos HTML nas postagens do blog, leia:

Como inserir códigos HTML nas postagens do Wordpress

Como inserir códigos HTML nas postagens do Blogger

Testando o botão

Para testar os botões antes de colocar no seu blog, acesse o Squids Editor no link: Tente você mesmo »

(Para visualizar os resultados clique no botão [Enviar código]).

Observe que em uma página HTML o código CSS deverá estar compreendido entre as tags <style> e </style>.

Criando botões 3D através de programação CSS

Para conhecer mais sobre como criar botões em CSS utilizando a programação, leia as postagens:

Crie botões personalizados para o seu Blogger

Crie botões personalizados no Wordpress

Criando botões personalizados

Outros serviços de criação de botões

Conheça os melhores serviços geradores de botões da Web no nosso Portal: www.visualdicas.com.br

byALF

sábado, 24 de outubro de 2015

Como bloquear um IP através do cPanel | Anti SPAM

Posted: 24 Oct 2015 01:15 PM PDT

Costuma receber SPAM, ou outro tipo de ataque de um determinado IP? Saiba como usar o “IP Address Deny Manager” do cPanel para bloquear os acessos mal intencionados ao seu Website. Por exemplo, no WordPress você poderia bloquear o IP dos comentários de SPAM, reduzindo significativamente o tempo perdido a eliminar os comentários inúteis. É importante salientar que… Ler Mais » O...

Aceda ao nosso site para continuar a ler, clique no título.

terça-feira, 20 de outubro de 2015

Visual Dicas

Crie botões personalizados no Wordpress

Posted: 19 Oct 2015 06:12 PM PDT

Crie botões personalizados no Wordpress - Visual DicasCrie botões personalizados para o seu Blogger - Visual Dicas

Botões personalizados

Botões são elementos de layout que servem para indicar e incentivar os leitores de um blog ao clique, ou seja, levam os seus visitantes a executarem um evento de interação. Por isso, é muito importante que os botões sejam atrativos, fiquem bem localizados e que combinem com o layout do site onde serão incluídos.

Neste tutorial vamos criar botões personalizados com efeito 3D utilizando HTML e CSS. Nosso objetivo é criar botões simples, porém visualmente atraentes para serem utilizados nos layouts de blogs desenvolvidos para o Wordpress.

Veja abaixo os botões que iremos criar neste tutorial:

Adicionando código CSS no Wordpress

Primeiro copie o código CSS abaixo e insira no Editor da folha de estilos CSS do painel do Wordpress.org seguindo o tutorial: Como usar CSS no Wordpress.

Atenção: Não apague os códigos já inseridos em [Editar CSS]. Insira o novo código copiado no final do painel do Editor da folha de estilos CSS, como mostra o exemplo abaixo.

Copiar o Código CSS abaixo:

        .bt {          
border:1px solid #25692A;           
border-radius:4px;           
display:inline-block;           
cursor:pointer;           
font-family:Verdana;           
font-weight:bold;           
font-size:14px;           
padding:7px 10px;           
text-decoration:none;           
}
             
.bt-vd {          
border-color:#68b465;           
background:linear-gradient(to bottom, #abd5aa 5%, #68b465 100%);           
box-shadow:inset 0px 1px 0px 0px #e3f1e3;           
color:#fff;           
text-shadow:0px 1px 0px #000;           
}           
  
.bt-lj {           
border-color:#eb9b48;           
background:linear-gradient(to bottom, #f7d6b3 5%, #eb9b48 100%);           
box-shadow:inset 0px 1px 0px 0px #fdf7f0;           
color:#333;           
text-shadow:0px 1px 0px #ffee66;           
}           
  
.bt-az {           
border-color:#46a7f5;           
background:linear-gradient(to bottom, #86c6f8 5%, #46a7f5 100%);           
box-shadow:inset 0px 1px 0px 0px #d7ecfd;           
color:#fff;           
text-shadow:0px 1px 0px #528009;           
}           
  
.bt-vm {           
border-color:#f61f0e;           
background:linear-gradient(to bottom, #fca8a1 5%, #f61f0e 100%);           
box-shadow:inset 0px 1px 0px 0px #fff4f3;           
color:#fff;           
text-shadow:0px 1px 0px #528009;           
}           
  
.bt-vd:hover {           
background:linear-gradient(to bottom, #68b465 5%, #abd5aa 100%);           
}           
  
.bt-lj:hover {           
background:linear-gradient(to bottom, #eb9b48 5%, #f7d6b3 100%);           
}           
  
.bt-az:hover {           
background:linear-gradient(to bottom, #46a7f5 5%, #86c6f8 100%);           
}           
  
.bt-vm:hover {           
background:linear-gradient(to bottom, #f61f0e 5%, #fca8a1 100%);           
}           
  
.bt:active {           
position:relative;           
top:2px;}

No código CSS acima criamos 4 botões 3D, sendo 1 verde, 1 laranja, 1 azul e 1 vermelho. Se desejar, você também poderá criar novas cores e formatos. Veja como no nosso tutorial Criando botões personalizados em CSS.

Depois que o código CSS foi copiado e colado no Editor da folha de estilos CSS no painel do Wordpress, clique no botão [Salvar folha de estilo].

Pronto, agora você já poderá inserir seus botões nas postagens. Veja como a seguir:

Criando botões nas postagens

Botões podem ser criados de várias formas escritas em HTML, como nos exemplos:

<button class="bt bt-vd" onclick="alert('Olá')">Abrir</button>      
<a class="bt bt-lj" href="#">Acessar</a>       
<input class="bt bt-az" type="submit">       
<a class="bt bt-vm" onclick="alert('Olá')">Clique aqui</a>

Neste tutorial vamos mostrar apenas a forma simples de hiperlink utilizando a tag <a>, onde você clicando no botão será redirecionado para uma nova página. Entretanto, você poderá utilizar qualquer dos formatos acima.

1) Vamos então criar o hiperlink através do código HTML abaixo:

<a href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados"  target="_blank">Como criar botões</a>

Depois vamos inserir o código HTML na nossa postagem.

ATENÇÃO: Se você não sabe como colocar códigos na postagem do Wordpress, leia o nosso tutorial: Como inserir códigos HTML nas postagens do Wordpress

Veja como abaixo o resultado do código HTML sem acrescentarmos os estilos do nosso botão:

Como criar botões

2) Agora vamos inserir a classe padrão do botão ".bt", conforme o código CSS que colocamos no modelo do nosso blog.

<a class="bt" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

3) Para colocar as cores, basta inserir as classes de cores definidas no código CSS ao lado da classe padrão, separados por um espaço, ficando:

Verde (bt-vd)

<a class="bt bt-vd" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Laranja (bt-lj)

<a class="bt bt-lj" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Azul (bt-az)

<a class="bt bt-az" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Vermelho (bt-vm)

<a class="bt bt-vm" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Visualizar exemplo no Wordpress

Pronto, agora que você já viu como criar os botões, veja nosso exemplo no link: http://visualdicas.com.br/byalf/?p=50.

Observação: No exemplo acima foi necessário a utilização de correção nas cores dos links conforme orientação abaixo:

Correção nas cores dos links

ATENÇÂO: Em função da pseudo classe "link" e do sistema de hierarquia CSS, poderá ocorrer uma divergência nas cores dos links, que devem ser: branco (botões verde, azul e vermelho) e preto (botão laranja). Para corrigir isto adicione o código CSS abaixo no final do editor da folha de estilos CSS no painel do Wordpress.

/* correção cores dos links */

a.bt-vd:link, a.bt-az:link, a.bt-vm:link {
color:#fff;
text-decoration:none;
}

a.bt-vd:visited, a.bt-az:visited, a.bt-vm:visited {
color:#fff;
text-decoration:none;
}

a.bt-lj:link, a.bt-lj:visited {
color:#000;
text-decoration:none;
}

Após copiar e colar o código CSS no painel do Wordpress, clique em [Salvar folha de estilo].

Obs.: Para testar os botões antes de colocar no seu blog, acesso o Squids Editor no link: Tente você mesmo » (Para visualizar os resultados clique no botão [Enviar código]).

byALF

domingo, 18 de outubro de 2015

DMCA: a lei que protege o Copyright

Posted: 18 Oct 2015 10:58 AM PDT

Em primeiro lugar, é essencial que o leitor compreenda o que significa o termo "Copyright", mais vulgarmente resumido ao símbolo ©. Copyright, ou direitos de autor, impede a cópia ou exploração de uma dada propriedade intelectual – por exemplo: música, imagens, livros, trabalhos gráficos… – sem permissão prévia do proprietário ou de um agente autorizado. Entenda-se por "agente… Ler Mais » O...

Aceda ao nosso site para continuar a ler, clique no título.

quinta-feira, 15 de outubro de 2015

Visual Dicas

Crie botões personalizados para o seu Blogger

Posted: 14 Oct 2015 01:49 PM PDT

Crie botões personalizados para o seu Blogger - Visual DicasCrie botões personalizados para o seu Blogger - Visual Dicas

Botões personalizados

Veja abaixo os botões que iremos criar neste tutorial:

Adicionando código CSS no Blogger

Primeiro copie o código CSS abaixo e insira no Editor do Designer do Painel do Blogger seguindo o tutorial: Como inserir códigos CSS no Blogger.

Atenção: Não apague os códigos já inseridos em [Adicionar CSS]. Insira o novo código copiado no final do painel do Designer de modelo do Blogger como mostra a figura abaixo.

Código CSS

        .bt {          
border:1px solid #25692A;           
border-radius:4px;           
display:inline-block;           
cursor:pointer;           
font-family:Verdana;           
font-weight:bold;           
font-size:14px;           
padding:7px 10px;           
text-decoration:none;           
}
             
.bt-vd {          
border-color:#68b465;           
background:linear-gradient(to bottom, #abd5aa 5%, #68b465 100%);           
box-shadow:inset 0px 1px 0px 0px #e3f1e3;           
color:#fff;           
text-shadow:0px 1px 0px #000;           
}           
  
.bt-lj {           
border-color:#eb9b48;           
background:linear-gradient(to bottom, #f7d6b3 5%, #eb9b48 100%);           
box-shadow:inset 0px 1px 0px 0px #fdf7f0;           
color:#333;           
text-shadow:0px 1px 0px #ffee66;           
}           
  
.bt-az {           
border-color:#46a7f5;           
background:linear-gradient(to bottom, #86c6f8 5%, #46a7f5 100%);           
box-shadow:inset 0px 1px 0px 0px #d7ecfd;           
color:#fff;           
text-shadow:0px 1px 0px #528009;           
}           
  
.bt-vm {           
border-color:#f61f0e;           
background:linear-gradient(to bottom, #fca8a1 5%, #f61f0e 100%);           
box-shadow:inset 0px 1px 0px 0px #fff4f3;           
color:#fff;           
text-shadow:0px 1px 0px #528009;           
}           
  
.bt-vd:hover {           
background:linear-gradient(to bottom, #68b465 5%, #abd5aa 100%);           
}           
  
.bt-lj:hover {           
background:linear-gradient(to bottom, #eb9b48 5%, #f7d6b3 100%);           
}           
  
.bt-az:hover {           
background:linear-gradient(to bottom, #46a7f5 5%, #86c6f8 100%);           
}           
  
.bt-vm:hover {           
background:linear-gradient(to bottom, #f61f0e 5%, #fca8a1 100%);           
}           
  
.bt:active {           
position:relative;           
top:2px;}

Depois que o código CSS foi copiado e colado no painel do modelo do Blogger, clique no botão [Aplicar no blog].

Pronto, agora você já poderá inserir seus botões nas postagens. Veja como a seguir:

Criando botões nas postagens

Botões podem ser criados de várias formas escritas em HTML, como nos exemplos:

<button class="bt bt-vd" onclick="alert('Olá')">Abrir</button>      
<a class="bt bt-lj" href="#">Acessar</a>       
<input class="bt bt-az" type="submit">       
<a class="bt bt-vm" onclick="alert('Olá')">Clique aqui</a>

1) Vamos então criar o hiperlink através do código HTML abaixo:

<a href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados"  target="_blank">Como criar botões</a>

Depois vamos inserir o código HTML na nossa postagem.

ATENÇÃO: Se você não sabe como colocar códigos na postagem do Blogger, leia o nosso tutorial: Como inserir códigos HTML nas postagens do Blogger

Veja como abaixo o resultado do código HTML sem acrescentarmos os estilos do nosso botão:

Como criar botões

2) Agora vamos inserir a classe padrão do botão ".bt", conforme o código CSS que colocamos no modelo do nosso Blogger.

<a class="bt" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

3) Para colocar as cores, basta inserir as classes de cores definidas no código CSS ao lado da classe padrão, separados por um espaço, ficando:

Verde (bt-vd)

<a class="bt bt-vd" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Laranja (bt-lj)

<a class="bt bt-lj" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Azul (bt-az)

<a class="bt bt-az" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Vermelho (bt-vm)

<a class="bt bt-vm" href="http://visualdicas.com.br/tutoriais/css/18-css-em-acao/9-criando-botoes-personalizados" target="_blank">Como criar botões</a>

Veja na postagem:

Como criar botões

Correção nas cores dos links

ATENÇÂO: Se você tiver problemas com as cores dos links dos botões, adicione o código CSS abaixo no final do painel do modelo do Blogger.

/* correção cores dos links */

a.bt-vd:link, a.bt-az:link, a.bt-vm:link {
color:#fff;
}

a.bt-vd:visited, a.bt-az:visited, a.bt-vm:visited {
color:#fff;
}

a.bt-lj:link, a.bt-lj:visited {
color:#000;
}

Após copiar e colar o código CSS no painel do modelo do Blogger, clique em [Aplicar no blog].

Obs.: Para testar os botões antes de colocar no seu blog, clique no link: Tente você mesmo » (No Squids Editor não esqueça de clicar o botão [Enviar código] para visualizar os resultados).

byALF

sexta-feira, 9 de outubro de 2015

Como instalar o IIS no Windows 8 e Windows 10

Posted: 09 Oct 2015 10:41 AM PDT

O IIS (Internet Information Services) é um servidor Web incorporado no Windows, que lhe oferece uma plataforma de hospedagem de sites, serviços e aplicativos, sendo muito apreciado por Webmasters. O recurso IIS só está disponível nas versões Windows PRO e Enterprise. Para verificar a versão do seu Windows, pressione as teclas Windows + X e selecione a opção… Ler Mais » O post Como instalar...

Aceda ao nosso site para continuar a ler, clique no título.

Páginas

sábado, 31 de outubro de 2015

quarta-feira, 28 de outubro de 2015

terça-feira, 27 de outubro de 2015

Botões personalizados

Utilizando o Gerador de botões

Colocando o código CSS no blog

Utilizando o código CSS nas suas postagens

Testando o botão

Criando botões 3D através de programação CSS

Outros serviços de criação de botões

sábado, 24 de outubro de 2015

terça-feira, 20 de outubro de 2015

Botões personalizados

Adicionando código CSS no Wordpress

Criando botões nas postagens

Visualizar exemplo no Wordpress

Correção nas cores dos links

domingo, 18 de outubro de 2015

quinta-feira, 15 de outubro de 2015

Botões personalizados

Adicionando código CSS no Blogger

Criando botões nas postagens

Correção nas cores dos links

sexta-feira, 9 de outubro de 2015

Afilia-se na NetAffiliation

Ganhe dinheiro com os Programas de Afiliados