sábado, 22 de junho de 2013

Como colocar o efeito apagar luz no blog

Você já deve ter visto aqui no [A Escola Blogger], que os posts de vídeos tem um efeito super interessante que permite você escurecer todo o blog e deixar o vídeo em destaque, seri como apagar a luz do blog.

Click na imagem para ampliar
Click na imagem para ampliar
Vejam que a primeira imagem o vídeo está normal e na segunda imagem o vídeo está em destaque e todo o resto do blog fica escurecido.


Então vamos ao código que é super fácil de fazer ▼
1° Passo: Click em "Modelo", depois "Editar HTML"
2° Passo: De um click com o botão esquerdo do mouse dentro do corpo de códigos de seu blog e em seguida aperte as teclas: "Ctrl + F"
3° Passo: Pesquise por </HEAD> e cole antes de </head> o seguinte código ▼

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
$("#oscuridad").css("height", $(document).height()).hide();
$(".lightSwitcher").click(function(){
$("#oscuridad").toggle();
if ($("#oscuridad").is(":hidden"))
$(this).html("Apagar a Luz").removeClass("turnedOff");
else
$(this).html("Acender as Luzes").addClass("turnedOff");
});
});
//]]>
</script>

4° Passo: Procure agora por: ]]></b:skin> e em seguida cole logo acima o código abaixo ▼


/* Apagar las luces
----------------------------------------------- */
#videoLuces {
position:relative;
z-index:102;
}
#apagador {
max-width:640px;
text-align:left;
position:relative;
height:25px;
display:block;
margin: 25px 0 0 60px;
}
.lightSwitcher {
position:absolute;
z-index:101;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRYlRpQk9oOI6otIk0XLlfHPLehFEmPUNg-6RN6gPDxlydbl9rCt8xt0rEdKOHChtSU2U0WoVZYCcZo3XihQVTUlnFGUpn77CnFTYW5bzmDUFS2liTJHjC3bSZ8H2Pp-YdbZrMJuIJ77w/s16/luces-on.png);
background-repeat:no-repeat;
background-position:left;
padding: 0 0 0 20px;
outline:none;
text-decoration:none;
}
.lightSwitcher:hover {text-decoration:underline;}
.turnedOff {
color:#ffff00 !important;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6yNFk12RnzBSEZIXlPkRJGn32-iOtwK36TX8jyoilXJrWIWDPZDjXtTDtzmvwaeEnA6Foj8wn55IQtgR1Y1eSIuEOm_CWsJbHxghZMJv66AjDiBTGImih4Li3yHilOWVQnRoQ_qE3joo/s16/luces-off.png);
}
#oscuridad {
background:#000;
opacity:0.9; /* Opacidade da Tela */
filter:alpha(opacity=90); /* Opacidade da tela */
position:absolute;
left:0;
top:0;
width:100%;
z-index:100;
}

5° Passo: Procure agora por: </body> e logo acima dele cole o código abaixo ▼


<div id='oscuridad'/>

Visualize e se estiver tudo ok salve

6° Passo: Agora toda vez que você for postar um vídeo em seu blog adicione o seguinte código ▼

<center>
<div id="apagador"><a class="lightSwitcher" href="javascript:void(0);">Apagar as luzes</a></div>
<div id="videoLuces">
...Aqui cole o código do Vídeo...
</div>
</center>

Onde está em vermelho é o local que você colocar o código HTML de seu vídeo.

Espero ter ajudado e até a próxima galera, abraços

Veja o primeiro trailer do filme sobre Steve Jobs


No vídeo, é possível ter uma amostra do longa-metragem que mostra a vida do ex-CEO da Apple.

Via: Tecmundo

quinta-feira, 20 de junho de 2013

Vídeo surpreendente de artes marciais em câmera lenta

Click na imagem para ampliar

Se você gosta de artes marciais, provavelmente vai curtir demais o vídeo produzido pela BBC Earth Productions, que reuniu os garotos do Shaolin Warriors em um vídeo eletrizante, todo feito em câmera lenta, para que você possa se surpreender com o que esses caras conseguem fazer. Assista ao vídeo abaixo e nos conte o que achou. Será que você seria capaz de fazer o que essa galera faz?


Via: Megacurioso

Como criar uma linha em HTML

Olá galera hoje vou mostrar como colocar uma linha em html em seu blog



O código é bem simples basta você copiar e colar onde deseja, ok vamos ao código ▼

<hr align="center" width="40" size="1" color=red>

Vamos a explicação ▼
1° Passo: O que está em vermelho é a largura da linha, se você deseja que a linha tenha exatamente a largura do seu blogger basta você alterar: "40" por "100%"
2° Passo: O que está em verde é a cor da linha, você pode alterar: color=red> por color= #3b5999> 
3° Passo: Veja outros códigos de cores clicando neste link: http://www.mxstudio.com.br/Conteudos/Dreamweaver/Cores.htm

Espero ter ajudado galera até a proxima e boa 5° feira a todos.

Documentos para Formação e reciclagem de vigilantes

Click na imagem pra ampliar
Olá galera hoje eu estou fazendo este post para os vigilantes que estão indo para a reciclagem e para as pessoas que pretendem fazer o curso de vigilante.

Muitas escolas já fornecem a relação de documentos no seu site outras não.

A relação de documentos e links de sites que irei postar aqui são de uma conceituada escola de vigilantes do Estado de São Paulo.

Caso você seja de outro estado terá que pesquisar na net sobre algumas certidões estaduais beleza, vamos ao post ▼

CURSO DE RECICLAGEM DA FORMAÇÃO DE VIGILANTE
Relação de Documentos:
• Ser brasileiro e maior de 21 anos;
• Cópia da Cédula de Identidade – RG;
• Cópia do CPF (CIC);
• Cópia do Título de Eleitor;
• Cópia do Comprovante de Voto da Última Eleição (1º e 2º Turnos) ou Certidão de Quitação Eleitoral;
• Cópia da Reservista – observar a necessidade de carimbo pelo Ministério da Defesa (Forças Armadas);
• Cópia do Comprovante de Escolaridade – mínimo a 4ª Série do 1º grau;
• Cópia do Certificado de Formação de Vigilantes (frente e verso);
• Cópia do Comprovante de Residência;
• Atestado de Antecedentes Criminais (original – validade 90 dias) - solicitar Junto a Delegacia de Polícia Civil ou Poupa Tempo de sua Cidade 
• Cópia do Registro do SISVIP/DPF na Carteira de Trabalho (Registro Policia Federal) ou a Carteira de Trabalho em via original;
•Caderno e caneta.
•Exame de Saúde – via original;
•Exame Psicotécnico – via original;
•Certidão Negativa de Execuções Criminais – DECRIM (original – validade 90 dias) que poderá ser 
requerida junto ao Fórum Criminal da Cidade;
•Certidão Negativa da Justiça Federal (original – validade 90 dias);
•Certidão de Crimes Eleitorais (original – validade 90 dias);
•Certidão do Tribunal da Justiça Militar Federal (original – validade 90 dias);
•Certidão da Justiça Militar Estadual (original – Validade 90 dias);


[O que está em vermelho não é necessário para quem irá fazer o curso. É somente necessário para o cidadão que já é vigilante e irá fazer a reciclagem ok]

Vamos aos link▼
• Certidão Negativa da Justiça Federal: http://www.trf1.jus.br/servicos/certidao/
• Atestado de antecedentes Criminais: http://www.ssp.sp.gov.br/servicos/atestado.aspx
• Certidão de Crimes Eleitorais: http://www.tse.jus.br/eleitor/certidoes/certidao-de-crimes-eleitorais
• Certidão do tribunal da justiça militar federal: http://www.stm.jus.br/publicacoes/certidao-negativa/emitir-certidao
• Certidao de justiça militar estadual: http://www.tjmsp.jus.br/certidao/solicitarCertidao.aspx



quarta-feira, 19 de junho de 2013

Como colocar uma caixa de fans like a box no blogger

Olá galera tudo beleza com vocês ? Espero que sim!

Bom vamos ao post de hoje.

Todos sabem que o facebook é a maior rede social do momento, então muitos se perguntam como colocar aquela caixa do facebook que aparecem em sites e blogs?

Bom primeiro você tem que criar uma página no facebook e depois pegar o link mais vamos ao detalhes▼

1° Passo: Após criar a sua página no site facebook de um click em página inicial veja a foto abaixo ▼
Click na imagem para ampliar
2° Passo: Copie o link da pagina que você deseja, veja o exemplo na imagem abaixo▼

Click com o botão direito do seu mouse sobre a página que deseja e depois click em "copiar endereço do link"

3° Passo: Apos copiar o endereço do link entre nesse site: http://developers.facebook.com/docs/reference/plugins/like-box/


Onde está em vermelho apague e cole o link que você copiou no lugar.

4° Passo: Depois personalize a seu gosto clicando em: Show Faces | Show Border | Show Header

5° Passo: Após personalizar click em: GET CODE e escolha a opção Inframe, copie o código e cole no html/javascript de seu blog.

É isso galera espero ter ajudado qualquer coisa só perguntar no bloco mensagem ▼
Click na imagem para ampliar

Att.
Danilo Hernani Silva





terça-feira, 18 de junho de 2013

99 Windgets

Olá galera hoje eu vim falar um pouco sobre o site: 99windgets

Este site é bem interessante pois ele permite você criar:
Salas De chat / bate papo
Um bloco de mensagens
Entre outros aplicativos

Com certeza este site irá ajudar muito você a personalizar e turbinar seu blog

Para começar usar o site você precisa de cadastrar o cadastro é bem simples apenas email e senha de acesso

Link do site: http://www.99widgets.com/

Qualquer dúvida envie para mim no aplicativo mensagem aqui do blog ▼
Click na imagem para ampliar

Dupla cria série digital incluindo justiceiros da ficção em imagens de manifestações que vêm acontecendo em todo o país.

Click na foto para ampliar
Todo mundo está acompanhando de perto — e muitos inclusive estão participando ativamente — as manifestações que estão acontecendo em todo Brasil, não é mesmo? Imagine, então, se além da população, um time de Super-Heróis se unisse à multidão para dar uma forcinha durante os protestos?

Capitão América contra a tropa de choque

Homem de Aço

Hulk e os pequenos

União e força

Homem-Aranha

Sem violência!

Não temam! Rorschach está aqui.

Vai disparar?

O Batman chegou

via: megacurioso



sexta-feira, 14 de junho de 2013

DEUS USA CRIANÇA, PARA LIGAR PRA UMA RÁDIO NOS EUA.

Quando comecei a ver o vídeo me emocionei.





Somos ingratos reconheço que somos fracos ou eu sou fraco, fui consagrado a diácono e hoje me encontro desviado mais sei que DEUS e o pai de todos nós e espero um dia encontrar a força novamente para me aproximar de DEUS e nesse dia eu irei agarra-lo para nunca mas solta-lo

Vejam o vídeo abaixo ▼ é maravilhoso.

Espero que gostem abraço.

Botão voltar ao topo personalizado

Ola galera hoje vou mostrar como colocar um botão voltar ao topo personalizado, diferente dos tradicionais que é apenas uma imagem ou texto.

Esse modo que irei mostrar a imagem só aparece após o usuário estar vendo a parte de baixo de seu blog ▼

E quando clicar em voltar ao topo ele irá dar um efeito bem legal

Vamos ao processo:
1° Passo: Faça o Backup antes de mecher no código de seu blog.
2° Passo: Vá em modelo + Editar HTML
3° Passo: Click com o botão esquerdo de seu mouse dentro do corpo de códigos e em seguida aperte Ctrl+L
4° Passo: Procure por;
]]></b:skin>

5° Passo: Acima dela cole esse código CSS;
 /* to top */
    #toTop {
   <span style="color: #38761d;"> width:50px;</span>  /* Largura do botão * /
    border:1px solid #000; /* Cor e tipo da borda */
    text-align:center; /* Alinhamento do texto */
    padding:5px; /* Distancia entre texto e borda */
    position:fixed; /* Posição que faz com que ele corra por toda a página*/
    bottom:5px; 
    right:5px;
    cursor:pointer;
    color:#eee; /* Cor da fonte do botão */
    text-decoration:none;
    font-weight:700;  /* Define o negrito da fonte */
    -moz-border-radius:5px;  /* Definições para o ângulo do botão */
    -khtml-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    }

6° Passo: Agora vamos adicionar o script que faz o botão funcionar
Procure por:
</body>

7° Passo: Preste bastante atenção o código deve ser colacado acima ▲ de </body> ok
 <a href='#' id='toTop'><img src='AQUI O ENDEREÇO DE SUA IMAGEM'> </img></a>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> 
<script type='text/javascript'>     
/*-----------------------      
* jQuery Plugin: Scroll to Top      
* by Craig Wilson, Ph.Creative (http://www.ph-creative.com)      
*       
* Copyright (c) 2009 Ph.Creative Ltd.      
* Description: Adds an unobtrusive &quot;Scroll to Top&quot; link to your page with smooth scrolling.      
* For usage instructions and version updates to go http://blog.ph-creative.com/post/jquery-plugin-scroll-to-top.aspx      
*       
* Version: 1.0, 12/03/2009      
-----------------------*/ 
$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr(&quot;href&quot;);if($(window).scrollTop()!=&quot;0&quot;){$(this).fadeIn(&quot;slow&quot;)}var   scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()==&quot;0&quot;){$(scrollDiv).fadeOut(&quot;slow&quot;)}else{$(scrollDiv).fadeIn(&quot;slow&quot;)}});$(this).click(function(){$(&quot;html,  body&quot;).animate({scrollTop:0},&quot;slow&quot;)})}}); 
  $(function() {     
                $(&quot;#toTop&quot;).scrollToTop();      
            });      
        </script>

Onde está em Vermelho você coloca a URL da imagem que desejar ok

Salve e visualize.

É isso galera até aproxima

via: elainegaspareto

Call of Duty: Fantasmas

Trailer de lançamento de Call of Duty / Ghosts

Pra que é fan do game isso foi sensacional

via: mataleone

Opções de banners para blogger

E ai galera beleza, vamos falar um pouco sobre banners, existem várias formas dee se fazer um banner, mais para você que não profissional no assunto existe dois sites que eu gosto muito e os usei bastante logo quando comecei no mundo blog em meados de 2010.

Vamos aos sites: Banner Fans

É um excelente site que fornece um variação enorme de fontes, cores sombras e por ai vai.
Vale apena você conferir.

Outro site legal é o create funny logo, ele fornece várias opções de fonte com as principais marcas do momento como: Facebook, Twitter e Google entre outros.


Já pensou em ter um site com o nome igual a fonte do google veja o exemplo abaixo ▼
Exemplo
Espero que tenham gostado, abraço.

Como colocar páginas numeradas no blogger

Olá pessoal hoje eu vou mostrar como colocar páginas numeradas no blogger ficara parecido com as que eu utilizo aqui no [A Escola Blogger]

Veja a imagem ▼

Como o blog dessa maneira da um tom de profissionalismo e facilita a navegação de seus leitores.

Para instala-lo é bem simples, simples mesmo veja a imagem abaixo ▼


Vamos ao código ▼


<style>#blog-pager{clear:both;margin:20px 0 20px;font-size: 12px;padding:10px 0;}#blog-pager-newer-link{float: left;}#blog-pager-older-link{float: right;}.Profile img{border:3px solid;float:left;margin:5px 10px 5px 0;padding:2;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.profile-data{color:#999999;font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif;font-variant:small-caps;margin:0;text-transform:capitalize;}.profile-datablock{margin:0.5em 0;}.profile-textblock{line-height:1.6em;margin:0.5em 0;}a.profile-link{clear:both;display:block;font:80% monospace;padding:10px 0;text-align:center;text-transform:capitalize;}h2.date-header, .PageList h2{display:none;}#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link,.showpageNum a,.showpage a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinGQVfxMHE4NeFKH0LPUymaHjnQe3dSWaHIfVsiB9z2V4iuziS3GBfe1JkwIy7wtgR61iA5nAy11hplsj504fCge9ZxS7OM8Fimqu5ZcKKr6RnDxT3LLwdZbYEAtCcJhXD2rgOFolVEtI/s1600/nav.jpg) repeat-x;border:1px solid #ae4402;color:#fff;margin:2px;padding:6px 10px 5px;text-decoration:none;text-shadow: 1px 0 1px #000;}#blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover,.showpageOf,.showpagePoint,.showpageNum a:hover,.showpage a:hover{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7LC2m9du0mkXzCZpEQOziNCnJAHDwMt4u2tcT-_ldzfLY_eRhT-F-ALQ0KQqIIYjP1XByXEJC1JlFlMnaudC5X5xsZpm96HQ39oPzu31F5phl3KygqZynGvy87sxsvtIu0m-gFJA-F2A/s1600/nava.jpg) repeat-x;border:1px solid #000000;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}</style><script type='text/javascript'>var postperpage=10;var numshowpage=5;var upPageWord="Anterior";var downPageWord="Pr&oacute;xima";var urlactivepage=location.href;var home_page="/"</script><script src='http://code.helperblogger.com/hb-page-navi.js' type='text/javascript'></script>

Não tem segredo galera:
1° Passo: Vá em modelo + Layout
2° Passo: Click em Adicionar um gadget, escolha a opção <HTML JavaScript>
3° Passo: Cole e arraste como a figura acima ▲ mostra

É isso galera falei que seria simples, abraço

Como achar ícones legais para colocar no blogger

Olá galera hoje vou falar de um site que utilizo muito e que me ajuda pra caramba na hora de fazer um post ou montar um novo blog.

O site chama: iconfinder

É como se fosse o "Google" só que somente de ícones


o site conta com uma grande variação de ícones inclusive de redes sociais veja o exemplo abaixo ▼












































É isso galera espero que tenham gostado

Abraços