Teste Magui 018

sexta-feira, 1 de junho de 2012

EXTRA-PhotoShop-Efeito Explosão

Postado por Magdiel da Silva às 05:30 0 comentários

LEIA MAIS...

quinta-feira, 31 de maio de 2012

Popups Redes Sociais

Postado por Magdiel da Silva às 09:00 0 comentários

Olá, abaixo deixo o código de uma PopUp configurada com Cookies para usar em seu Blogger.

Antes de mais nada você deve fazer um backup de seu template para depois editar o código.

Vamos lá:

1º – Acesse o design do seu blog.
2º – Em seguida, clique no Botão Editar HTML.
3º – Segure as teclas CTRL+F e procure por:

</head>

4º – Acima da tag head cole o seguinte código:

<link href='http://dl.dropbox.com/u/44914301/codigos/colorbox.css' media='screen' rel='stylesheet'/>
<script src='https://dl-web.dropbox.com/get/jquery.js?w=47105892'/>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js'/>
<script src='http://dl.dropbox.com/u/44914301/codigos/jquery.colorbox-min.js'/>
<script type='text/javascript'>
  jQuery(document).ready(function(){
    if (document.cookie.indexOf(&#39;visited=true&#39;) == -1) {
        var fifteenDays = 1000*60*60*24*15;
        var expires = new Date((new Date()).valueOf() + fifteenDays);
        document.cookie = &quot;visited=true;expires=&quot; + expires.toUTCString();
    $.colorbox({width:&quot;700px&quot;, inline:true, href:&quot;#subscribe&quot;});
        }
});
</script>


<style>
 #subscribe {font: 12px/1.2 Arial,Helvetica,san-serif;}
#subscribe a,#subscribe a:hover,#subscribe a:visited {text-decoration:none;}
.box-tagline {color: #999;font-size: 14px;margin: 0;text-align: center;}
.box-side.left {padding: 0 30px 0 15px;border-right: 1px solid #ecedf3;}
.box-side.left li { list-style:none; margin-bottom:20px;}
.box-icon {width: 72px;height: 54px;padding: 6px 0 0 0;margin: 0 auto;}
.box-icon a.rss{display: block;width: 70px;height: 56px;margin: 0 auto;}
.box-icon a{display: block;width: 72px;height: 54px;}
.box-icon a.email img,.box-icon a.rss img {margin: -5px 0 0;border: 0 none;}
.box-side h4, .box-side h4 a {font-size: 14px;line-height: 14px;color: #f26535;font-weight: bold;}
.box-side h4 { margin: 20px 0 10px 0; }
.box-side h5 {font-size: 11px;color: #5e6066; line-height: 18px;margin: 0 0 20px 0;}
.box-side h4 a:hover {color: #f26535;}
.demo {display:none;}
#subscribe{font:12px/1.2 Arial,Helvetica,san-serif;}
#subscribe a,#subscribe a:hover,#subscribe a:visited{text-decoration:none;}
#subs-container{position:relative;padding:35px 0 30px;}
.box-icon{width:72px;height:54px;margin:0 auto;padding:6px 0 0;}
.box-icon a.rss{display:block;width:70px;height:56px;margin:0 auto;}
.box-icon a{display:block;width:72px;height:54px;}
.box-icon a.email img,.box-icon a.rss img{border:0 none;margin:-5px 0 0;}
.box-side h4,.box-side h4 a{font-size:14px;line-height:14px;color:#f26535;font-weight:700;}
.box-side h4{margin:20px 0 10px;}
.box-side h5{font-size:11px;color:#5e6066;line-height:18px;margin:0 0 20px;}
.box-side h4 a:hover{color:#f26535;}
</style>

5º – Segure as teclas CTRL+F e procure por:

<body>

6º – Abaixo cole o seguinte código:

<div style='display:none'>
<div id='subscribe' style='padding:10px; background: url(http://i1212.photobucket.com/albums/cc447/wesleyextreme/Fatia-cabealho-popup.png) repeat-x top;'>
<h2 class='box-title' style='text-transform: uppercase;color: #ffffff;font-size: 20px;font-weight: 700;text-align: center;margin: 10px 0;'>Assine Nossa Newslatter gratuitamente!</h2>
<h3 class='box-tagline' style='color: #fea63f;font-size: 14px;text-align: center;margin: 0;'>Receba Nossas Atualizações em Seu E-mail:</h3>
<div class='clearfix' id='subs-container' style='position: relative;padding: 35px 0 0px;'>
<div class='box-side left' style='width:350px;text-align: center;border-right:1px solid #ecedf3;padding:0 20px 0 15px;'>
<li>
<div style=' background:#fff url(http://i1212.photobucket.com/albums/cc447/wesleyextreme/curtirFacebook-tecwindows-1.png) no-repeat top right; width:350px; height:180px;'>


<iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FID DA PÁGINA DO FACEBOOK AQUI&amp;width=350&amp;height=180&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false' style='border:none; overflow:hidden; width:350px; height:180px;'/>

</div>
 </li>

<li style='font-size: 14px;font-family: arial;background-image: url(http://i1212.photobucket.com/albums/cc447/wesleyextreme/bullet-bullet.png);background-position: 0px 0px;text-shadow: 0px 0px 1px #B5B5B5;font-weight: normal;background-repeat: no-repeat;padding-left: 35px;margin-bottom: 10px;line-height: 27px;text-align: justify;color: black;list-style-type: none;text-transform: uppercase;'>Seu Email Nunca Será Revelado!!!</li>

</div>
<div class='box-side right' style='width: 240px !important;float:right;margin-top:-236px;margin-right:10px;'>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=NOME DO SEU FEED AQUI&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='padding:3px;text-align:center;' target='popupwindow'><img alt='Assine nosso feed gratis' src='http://i1212.photobucket.com/albums/cc447/wesleyextreme/Assinar_rss_assinaturadefeed.png' style='margin-top: -2px;width: 124px;height: 125px;' title='Assine nosso feed gratis'/><p>
<input name='email' onblur='if (this.value == &apos;&apos;) {this.value = &apos;Digite seu e-mail aqui!&apos;;}' onfocus='if (this.value == &apos;Digite seu e-mail aqui!&apos;) {this.value = &apos;&apos;;}' size='30' style='background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOjlJ7VYwu9VKm89H_eENF_NYurAboGE7VZXhBmbKF5BAwHVBnEAlML0pCjJZtWRpDoR_Ke95lyGfx7hoc0DDYr1-kR5Ao6tvFsjUEFkH2JCcIWCIlzZhyNNTl2hJyUNJxAc-CUBIJa1Q/s1600/lightbox-text-box.png);margin-bottom: 5px;border: 0px;line-height: 20px;padding-right: 10px;padding-top: 12px;margin-left: 3px;background-repeat: no-repeat;padding-bottom: 12px;width: 230px;color: #555;font-family: Helvetica, Arial, sans-serif;font-size: 14px;padding-left: 10px;background-color: transparent;background-position: left center;outline: none;' type='text' value='Digite seu e-mail aqui!'/>
</p><input name='uri' type='hidden' value='NOME DO SEU FEED AQUI'/><input name='loc' type='hidden' value='pt_BR'/><input style='width: 255px;height: 47px;margin-bottom: 5px;margin-left: auto;margin-right: auto;background: url(http://i1212.photobucket.com/albums/cc447/wesleyextreme/boto-de-assinatura.png) no-repeat;text-align: center;border: none;font-size: 19px;color: white;font-family: Helvetica, Arial, sans-serif;font-weight: bold;text-shadow: 1px 1px 0px black;text-transform: uppercase;letter-spacing: -1px;line-height: 45px;' type='submit' value='INSCREVER-SE!'/></form><br/>
<span style='float: left;margin-top: -30px;color: gray;margin-left: -400px;font-size: 13px;'>Desenvolvido Por <b><a href='http://www.maguisilva-wd.blogspot.com.br/' style='color: #004D97 !important;' target='_blank'>MaguiSilva</a></a></b></span>
</div></div><br/><br/></div></div>

Antes de salvar você deve substituir a marcação azul pala "ID da sua página de fãs do facebook" e o vermelho pelo "nome do feed".
11º - Após ter feito os passos acima basta salvar e pronto.

Espero que tenham gostado deste Tutorial.
Comente deixando sua opinião.

LEIA MAIS...

Redes Sociais expansível

Postado por Magdiel da Silva às 08:45 0 comentários

Olá, hoje aprenderemos a inserir uma caixa de divulgação expansível com os botões +1 do Google+, curtir do Facebook e seguir do Twitter. O objetivo desse botões é aumentar o tráfego para as redes sociais e assim seus leitores poderão acompanhar seu blog. Dessa forma, deixa a divulgação das redes sociais mais bonita e mais simples, além de que ocupa menos espaço, afinal, para mostrar os botões, você primeiro precisa clicar no botão “Compartilhar nosso blog”. e aproveitando peço que ajudem o blog aqui para que venha mais tutoriais e video aulas.

Vamos ao lá:

1º – Acesse o design do seu blog.
2º – Em seguida, clique no Botão Editar HTML.
3º – Segure as teclas CTRL+F e procure por:
]]></b:skin>

4º – Acima cole o seguinte código:

#loginContainer{position:relative;float:left;font-size:12px}
#loginButton {
padding: 8px;
font-family: Arial, sans-serif;
display: inline-block;
position: relative;
z-index: 30;
cursor: pointer;
background: #4092E2;
background: -moz-linear-gradient(top, rgba(64, 146, 226, 1) 0%, rgba(26, 117, 221, 1) 100%);
background: -webkit-gradient(linear, left top, left bottom,  color-stop(0%,rgba(64, 146, 226, 1)), color-stop(100%,rgba(26, 117, 221,  1)));
background: -webkit-linear-gradient(top, rgba(64, 146, 226, 1) 0%,rgba(26, 117, 221, 1) 100%);
background: -o-linear-gradient(top, rgba(64, 146, 226, 1) 0%,rgba(26, 117, 221, 1) 100%);
background: -ms-linear-gradient(top, rgba(64, 146, 226, 1) 0%,rgba(26, 117, 221, 1) 100%);
background: linear-gradient(top, rgba(64, 146, 226, 1) 0%,rgba(26, 117, 221, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4092e2', endColorstr='#1a75dd',GradientType=0 );
border: 1px solid #176ABB;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
#loginButton:hover {
background: #499BEA;
background: -moz-linear-gradient(top, rgba(73, 155, 234, 1) 0%, rgba(32, 124, 229, 1) 100%);
background: -webkit-gradient(linear, left top, left bottom,  color-stop(0%,rgba(73, 155, 234, 1)), color-stop(100%,rgba(32, 124, 229,  1)));
background: -webkit-linear-gradient(top, rgba(73, 155, 234, 1) 0%,rgba(32, 124, 229, 1) 100%);
background: -o-linear-gradient(top, rgba(73, 155, 234, 1) 0%,rgba(32, 124, 229, 1) 100%);
background: -ms-linear-gradient(top, rgba(73, 155, 234, 1) 0%,rgba(32, 124, 229, 1) 100%);
background: linear-gradient(top, rgba(73, 155, 234, 1) 0%,rgba(32, 124, 229, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5',GradientType=0 );
text-decoration: none;
}
#loginButton.active {
background: #4092E2;
border-bottom: 0;
-webkit-border-radius: 4px 4px 0 0px;
}
#loginButton span {
display: block;
padding-top: 2px;
font-weight: normal;
font-size: 16px;
color: white;
text-shadow: 1px 1px 1px #176ABB;
}
#loginForm {
width: 284px;
border: 1px solid #176ABB;
border-radius: 0px 3px 3px 3px;
-moz-border-radius: 3px 0 3px 3px;
background: #4092E2;
margin-top: -7px;
border-image: initial;
padding: 6px;
}
#loginBox {
top: 52px;
right: 0;
display: none;
z-index: 29;
}
div#body {
background: white;
border-radius: 3px;
-moz-border-radius: 3px;
margin: 0;
padding: 2px 5px;
padding-bottom: 4px;
}
#loginContainer li {
list-style: none;
border-bottom: 0px;
}
#social-btn0 {
padding: 10px;
}
#social-btn {
border-top: 1px solid #C6C6C6;
padding: 10px;
padding-bottom: 4px;
padding-top: 8px;
}
#social-btn1 {
padding: 5px;
border-top: 1px solid #C6C6C6;
padding-top: 9px;
}

5º – Segure as teclas CTRL+F e procure por:

</head>

6º – Acima cole o seguinte código:

<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'>
{lang: 'pt-BR'}
</script>
<script src='http://connect.facebook.net/pt_BR/all.js#xfbml=1' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js'/>
<script type='text/javascript'>
// Caixa de Login
$(function() {
var button = $('#loginButton');
var box = $('#loginBox');
var form = $('#loginForm');
button.removeAttr('href');
button.mouseup(function(login) {
box.toggle();
button.toggleClass('active');
});
form.mouseup(function() {
return false;
});
$(this).mouseup(function(login) {
if(!($(login.target).parent('#loginButton').length > 0)) {
button.removeClass('active');
box.hide();
}
});
});
</script>

7º – Clique em Salvar Modelo.

8º – Clique na Guia Layout.

9º – Clique em Adicionar Gadget e selecione HTML/Javascript.

10º – Dentro do conteúdo do Gadget, cole o seguinte código:

<div id="loginContainer"><li><span><a id="loginButton" class=""><span> Compartilhe nosso Blog </span></a></span></li><div style="clear:both"></div><div id="loginBox" style="display: none; "><div id="loginForm"><div id="body" class="body-login"> <div id="social-btn0">
<div class="g-plusone" data-annotation="inline" data-width="280" data-href="ENDEREÇO DO BLOG"></div>
</div>
<div id="social-btn">
<div class="fb-like" data-send="false" data-href="ENDEREÇO DO BLOG" data-width="260" data-show-faces="false" data-font="arial"></div>
</div>
<div id="social-btn1" class="group">
<a href="https://twitter.com/NOME-DE-USUÁRIO-DO-TWITTER" class="twitter-follow-button" data-show-count="true" data-lang="pt">Follow @NOME-DE-USUÁRIO-DO-TWITTER</a>
</div></div></div></div></div>

Antes de salvar você deve substituir as duas vezes que pede o endereço do seu blog e as duas vezes que pede o seu nome de usuário do Twitter.

11º - Após ter feito os passos acima basta salvar e pronto.

Espero que tenham gostado deste Tutorial.

Comente deixando sua opinião.

LEIA MAIS...

terça-feira, 29 de maio de 2012

Agendamento de postagem no blogger

Postado por Magdiel da Silva às 11:07 0 comentários

Aprenda deixar suas postagens agendadas para serem postadas automaticamente, quando você nao pode postar.

LEIA MAIS...

Box Flutuante de Redes Sociais nas postagens

Postado por Magdiel da Silva às 05:05 0 comentários

Olá pessoal, alguns de vocês devem ter percebido em alguns blogs um box flutuante de redes sociais ao lado dos posts e muitos até se perguntaram como se coloca o mesmo. Então hoje estou ensinando a você a fazer isso. Como podem ter percebido, o box esta ligado ao Twitter, Google+ e Facebook

Vamos ao que interessa:

1º - Acesse o Painel de seu Blog e clique no Botão Editar HTML.

2º - Em seguida clique em Editar Modelo selecione a caixa ” Expandir modelos Widgets” .

3º - Agora pressione as teclas CTRL + F (atalho de busca na página) e procure pelo seguinte:

4º - Acima adicione o seguinte código:

5º - Agora iremos procurar pela seguinte Tag:

6º - E acima dela adicione o seguinte código:

7º - Agora iremos procurar pela seguinte Tag:

8º - E abaixo dela adicione o seguinte código:

9º – Depois clique em Salvar Modelo.

Comente deixando sua opinião...

LEIA MAIS...

segunda-feira, 28 de maio de 2012

Quer aprender mais sobre Linux?

Postado por Magdiel da Silva às 21:51 0 comentários

Se você é uma das pessoas que se interessa por assustos sobre este tipo de sistema e quer aprender mais sobre o mesmo, então você vai gostar dos links a seguir. Trata-se de uma coleção de livros sobre Linux que podem ser lidos on-line gratuitamente. É muita informação, e com certeza aumenta o gabarito de qualquer pessoa que trabalha ou gosta de informática.

Kurumin 7, Guia Prático

Linux, Ferramentas Técnicas 2ª Edição

Redes e Servidores Linux 2ª Edição

Linux, Entendendo o Sistema

Entendendo e Dominando o Linux