Postagens Recentes

30 de abr. de 2008

Colocando o lápis de edição rápida no Blogger

5 comentários:
Coloque este lápis de edição rápida em seu blog. Fica bem mais fácil entrar nos posts.
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.


Clique em "Layout" depois em "Elementos de página"
Agora clique em "Editar" que está abaixo de "Poatagens do blog"

Agora clique em "Mostrar edição rápida" e salve.




Bom meus amiguinhos, se mesmo assim não apareceu o lápis ao pé de suas postagens, então você terá que o colocar no HTML do seu blog.


Clique em "Expandir modelos de widgets" e procurar pelo seguinte código:

<div class='post-header-line-1'>


Tendo o encontrado troque-o pelo código abaixo e depois salve




<div class='post-header-line-1'>
<span expr:class='&quot;item-control &quot; + data:post.adminClass'>
<a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
<img alt='' class='icon-action' src=' http://www.blogger.com/img/icon18_edit_allbkg.gif '/>
</a>
</span>


Perceba que agora seu lápis de edição estará abaixo do título de seu post

Adicionar 3 colunas ao footer do Blogger

19 comentários:
Para colocar três colunas no footer do Blogger ( parte inferior do Blogger) como AQUI neste exemplo, a primeira coisa a fazer é retirar todo e qualquer widget que lá estiver. Não é preciso deletar, basta arrasta-los para a coluna lateral. Agora vá até o HTML do seu blog, clique em "Expandir modelos de widget"  e procure pelo código:


Esse hack se aplica ao antigo Blogger. Se vc abriu seu blog depois de junho de 2010 veja AQUI como voltar ao modelo antigo. Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.




</div> <!-- end content-wrapper -->


Agora que o encontrou, coloque este próximo código acima dele.





  <div id='footer-wrapper'>
<div id='footer-columna-contenedor'>
<div id='footer1' style='width: 32%; float: left; margin:0 2px; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'>
<b:widget id='Label5' locked='false' title='Marcadores' type='Label'/>
</b:section>
</div>
<div id='footer2' style='width: 34%; float: left; margin:0 5px 0 5px; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'>
<b:widget id='Label6' locked='false' title='Marcadores' type='Label'/>
</b:section>
</div>
<div id='footer3' style='width: 32%; float: right; margin: 0 2px; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'>
<b:widget id='Label7' locked='false' title='Marcadores' type='Label'/>
</b:section>
</div>
</div>
</div>
<div style='clear:both;'/>





Salve e procure por:

  ]]></b:skin>



E cole o próximo código acima dele. Salve


/*Colunas do footer-----------------------------------------*/
#footer-columna-contenedor {
width: 99%;
clear:both;
margin:0 auto;
}
.footer-columna {
padding: 8px;
margin:0 auto;
}
#col1 .widget, #col2 .widget, #col3 .widget{
background: #fff;
  border: 1px dashed $bordercolor;/*cor da borda*/
  color: $sidebartextcolor;/*cor da letra*/
  line-height: 1px;
  padding: 10px;
  margin:0 auto;
}

#col1 .widget-content, #col2 .widget-content, #col3  .widget-content {
border:3px solid #FFB90F;
border-top: none;
margin: 0 0 0;
padding:10px;
background: #fff;
}
#col1 h2, #col2 h2, #col3 h2{/*títulos*/
font-family: 'Wallpoet', arial, serif;
  font-weight: bold;
  background: #FFB90F;
  margin: 2px 0 0 0;
  padding: 20px 0px;
  text-align: center;
  float: center;
  font-size: 18px;
  color:$sidebartextcolor;/*cor da letra*/
  text-shadow:0 1px 0 #f9f9f9;
}

#col1 ul, #col2 ul, #col3 ul{
  list-style:none;
  margin:0 0 0 0;
  padding:6px  0 4px 0;
}

#col1 ul li a:link, #col2 ul li a:link, #col3 ul li a:link{/*link cinza*/
 background:#eee;
  color:#A2B8D7;/*cor da letra cinza claro*/
  border-bottom:1px dashed #ccc;/*borda cinza claro*/
  margin: 0 0 1px 0;
  padding: 15px 0 15px 14px;
  display:block;
}

#col1 ul li a:visited, #col2 ul li a:visited, #col3 ul li a:visited{ /*links visitados ciza escuro*/
background: #ccc;
  color:#808080;/*cor da letra cinza escuro*/
  border-bottom:1px dashed #808080;/*borda cinza escuro*/
  margin: 12px 0 1px 12px;
  padding: 10px 0 5px 14px;
  display:block;
}

#col1 ul li a:hover, #col2 ul li a:hover, #col3 ul li a:hover{
background: #808080;
  color: #5B79A3;
  border-bottom:1px dashed #5B79A3;
}






Clique e veja como ficou



Mudando as cores do fundo do seu Blogger

Um comentário:
Para ter um widget onde o visitante pode mudar a cor do fundo do seu blog, como mostro no exemplo AQUI, vá até o HTML do seu Blogger e procure pelo seguinte código: body {




Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.












Procure pelo código:    background: 

que estará logo abaixo e apague-o até o ponto e vírgula ;



Agora procure pelo código: ]]></b:skin>

e abaixo dele cole o código que está abaixo.


<script language='JavaScript'>
function r(hval)
{document.bgColor=hval; }
</script>







Agora vá até "Elementos de página", clique em "Adicionar um novo elemento de página" e clique em HTML/Javascript, cole o código abaixo e salve.

Se quiser modificar as cores, troque-as, mas atenção, note que as cores sempre se repetem de duas em duas. Outras cores AQUI









<center>
<table border="0" cellpadding="0">
<tr>
<td bgcolor="#ffffff"> <a onmouseover="r('#ffffff'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#BEA1CC"><a onmouseover="r('#BEA1CC'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#5A4C63"><a onmouseover="r('#5A4C63'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#9F0F34"><a onmouseover="r('#9F0F34'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#990033"><a onmouseover="r('#990033'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#9DB1B2"><a onmouseover="r('#9DB1B2'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#C6D2D2"><a onmouseover="r('#C6D2D2'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#B6D6E5"><a onmouseover="r('#B6D6E5'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#F9A028"><a onmouseover="r('#F9A028'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#FCC584"><a onmouseover="r('#FCC584'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#000000"><a onmouseover="r('#000000'); return true" href="javascript:">
<img border="0" width="13" src="" height="13"/></a></td> <td bgcolor="#000000"><a onmouseover="r
('#000000'); return true" href="javascript:">
</a></td></tr>
</table>
</center>


Barra de recados na header do Blogger ( acima da imagem principal)

Um comentário:

Para colocar uma barra de mensagem acima da imagem principal do seu blog como esta que tenho AQUI é bem facinho, basta copiar o código, vá até o HTML do seu blog procurar pelo código: </head>


e cole abaixo dele o código.

Faça as alterações como cor de fundo, border e claro, a sua mensagem. Outras cores AQUI, outros tipos de border AQUI

  • azul--cor da letra
  • vermelho--cor do fundo
  • laranja--tipo de border
  • verde--cor do border


  • Para recado com efeito.


    <div style='color:#ffffff; background-color:#bea1cc; border-bottom: 2px dotted #ffffff; border-top: 2px dotted #ffffff; margin: 0 0 5px 0; padding: 4px 0; font-size: 14px;'><b><center> <marquee>AQUI SEU RECADO</marquee></center> </b></div>






Para recado parado


<div style='color:#ffffff; background-color:#bea1cc; border-bottom: 2px dotted #ffffff; border-top: 2px dotted #ffffff; margin: 0 0 5px 0; padding: 4px 0; font-size: 14px;'><b><center>AQUI SEU RECADO</center> </b></div>








      Barra com imagem


      <div style='color:#ffffff; background-color:#bea1cc; border-bottom: 2px dotted #ffffff; border-top: 2px dotted #ffffff; margin: 0 0 5px 0; padding: 4px 0; font-size: 14px;'><b><center><img src='ENDEREÇO DA IMAGEM AQUI'/>ESCREVA AQUI</center></b></div>

      29 de abr. de 2008

      Fundo do seu blog em movimento

      3 comentários:
      Com este código é possível dar movimento ao fundo do seu blog. Clique AQUI e veja o exemplo. Mas é calro que para isso você terá que ter uma imagem de fundo em seu blog, nean ?!

      Copie o código vá até elementos de página, "Adicionar um novo elemento de página" e depois clique em "HTML/Javascript", cole-o e salve. Prontinho



      Movimenta para cima
      Pegar código




        <script language="JavaScript">
        var backgroundOffset=138; //must be equel to maxSize
        function scrollBG(maxSize)
        { backgroundOffset-=1;
        if (backgroundOffset<0) backgroundOffset=maxSize;
        document.body.style.backgroundPosition="0 "+backgroundOffset;
        }
        var ScrollTimer=window.setInterval("scrollBG(138)",64);
        // -->
        </script>




      Movimenta para baixo



      Pegar código




        <script language="JavaScript">
        <!-- Begin
        var backgroundOffset = 0;
        var bgObject = eval('document.body');
        function scrollBG(maxSize) {
        backgroundOffset = backgroundOffset + 1;
        if (backgroundOffset > maxSize) backgroundOffset = 0;
        bgObject.style.backgroundPosition = "0 " + backgroundOffset;
        }
        var ScrollTimer = window.setInterval("scrollBG(307)", 64);
        // End -->
        </script>

      Bloquear imagens

      5 comentários:
      Com este código você poderá bloquear imagens específicas.


      Aqui sem o código




      Aqui com o código





      <img oncontextmenu="return false" src="ENDEREÇO DA IMAGEM AQUI" border="0" />

      Tipos de border

      3 comentários:
      Tipos de border (margem) ou tipos de borda.



      DOTTED

       border: 5px dotted #FEE4FE;



      DASHED

      border: 5px dashed #FEE4FE;



      SOLID

      border: 5px solid #FEE4FE;



      DOUBLE

      border: 5px double #FEE4FE;



      GROOVE

      border: 5px groove #FEE4FE;



      RIGDGE

      border: 5px ridge #FEE4FE;



      INSET

      border: 5px inset #FEE4FE;


      Tem como deixa-las arredondadas também (mas só funciona no Mozilla e no Chrome :-(

      O código é este:

      -moz-border-radius:8px;
      -webkit-border-radius:8px;

      Portanto, se você quer deixa-la com essa aparência o código ficará assim:

      border: 5px solid #FEE4FE;
      -moz-border-radius:8px;
      -webkit-border-radius:8px;


      SOLID

      border: 5px solid #FEE4FE;
      -moz-border-radius:8px;
      -webkit-border-radius:8px;

      Claro que este código deverá ficar no local adequado para que colunas, posts, header fiquem com a aparência desejada, ou não dará certo.

      Pullquote facil

      Nenhum comentário:
      Pullquote sáo essas caixinhas que você coloca em seu post para dar destaque a algo em seu post. Há muitas maneiras de fazê-los eu já ensinei uma maneira AQUI, mas agora colocarei aqui uma maneira bem fácil, assim, você não precisará mexer nem no HTML do seu Blogger. Basta copiar o código e cola-lo no modo "EDITAR HTML" no local onde você escreve.



      * Em vermelho é a cor de seu fundo
      * Em verde é a cor da margem
      * Em azul é o tipo de margem, para ver outros modelos, clique AQUI

      Veja outras cores AQUI

      Assim você dá destaque a algo que queira escrever em seu post. Fácil, fácil. Você poderá modificar as cores do fundo, o border ( essa margem)




      Pegar código




        <p style="float:right;width:30%;padding:8px;border:3px solid #000000;font-size:.8em;margin:20px;background-color:#cc0000;">
        <strong> ESCREVA AQUI O SEU TEXTO</strong><br>
        </p>









      Para fazer assim, com imagem de fundo não é nada difícil, assim você terá um pullquote bem personalizado, rsrrsrsr

      Atenção, o Blogger possui pullquote, para saber mais, clique AQUI

      28 de abr. de 2008

      Calendário de arquivos

      2 comentários:
      Este é um calendário que funciona como arquivo do seu blog, mostrando os dias que você postou, as postagens daquele dia, assim, tudo que estiver relacionado a um determinado dia, o calendário apontará.


      Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.




      Clique AQUI e veja o exemplo.

      Mais uma dica do blog Purple Moggy's

      Copie o primeiro código e cole em seu HTML antes do código : </head>
      ATENÇÃO: coloque o endereço de seu blog no local em vermelho ( mas sem a barra final / ) e o horário do seu relógio no local em azul.

      Pegar 1º código






        <!-- CODIGO CALENDARIO -->
        <!-- PARTE 1 -->
        <script src='http://yui.yahooapis.com/2.2.0/build/yahoo-dom-event/yahoo-dom-event.js' type='text/javascript'/>
        <script src='http://yui.yahooapis.com/2.2.0/build/calendar/calendar-min.js' type='text/javascript'/>
        <link href='http://yui.yahooapis.com/2.2.0/build/calendar/assets/calendar.css' rel='stylesheet' type='text/css'/>
        <!-- FIN DE PARTE 1 -->
        <!-- PARTE 2 -->
        <script type='text/javascript'>
        //<![CDATA[
        /*
        Created by: PurpleMoggy
        http://purplemoggy.blogspot.com
        */
        var _yourBlogUrl = "AQUI O ENDEREÇO DO SEU BLOG"; //edit this
        var _yourBlogTimeZone = "+01:00"; //edit this
        _yourBlogTimeZone = encodeURIComponent(_yourBlogTimeZone);
        var _dayTitles = new Array("","","","","","","","","","","","","","","","","","","","","","","","","","","","","","","");
        YAHOO.namespace("example.calendar");
        function cal1Init() {
        YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1","cal1Container");
        YAHOO.example.calendar.cal1.addMonthRenderer(1, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(2, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(3, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(4, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(5, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(6, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(7, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(8, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(9, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(10, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(11, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.addMonthRenderer(12, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
        YAHOO.example.calendar.cal1.selectEvent.subscribe(mySelectHandler, YAHOO.example.calendar.cal1, true);
        YAHOO.example.calendar.cal1.changePageEvent.subscribe(myChangePageHandler, YAHOO.example.calendar.cal1, true);
        YAHOO.example.calendar.cal1.renderEvent.subscribe(syncMonthYear);
        YAHOO.example.calendar.cal1.render();
        myChangePageHandler();
        };
        var myChangePageHandler = function(type,args,obj) {
        var month = YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getMonth() + 1;
        if (month.toString().length == 1) {
        month = "0" + month;
        }
        var year = YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getFullYear();
        document.getElementById("cal1Titles").innerHTML = "";
        _dayTitles = new Array("","","","","","","","","","","","","","","","","","","","","","","","","","","","","","","");
        checkPostsForMonth(month, year);
        };
        function checkPostsForMonth(month,year) {
        document.getElementById("cal1loadimg").style.display = "block";
        var script = document.createElement("script");
        script.setAttribute("type", "text/javascript");
        var theUrl = _yourBlogUrl +"/feeds/posts/summary?alt=json-in-script&callback=checkPostsCallback&published-min=" + year + "-" + month + "-01T00%3A00%3A00" + _yourBlogTimeZone + "&published-max=" + year + "-" + month + "-31T23%3A59%3A59" + _yourBlogTimeZone + "&max-results=100";
        script.setAttribute("src", theUrl);
        document.documentElement.firstChild.appendChild(script);
        };
        function checkPostsCallback(json) {
        if (json.feed.entry) {
        for(i = 0; i < json.feed.entry.length; i++) {
        var month = json.feed.entry[i].published.$t.substr(5,2);
        var year = json.feed.entry[i].published.$t.substr(0,4);
        var day = json.feed.entry[i].published.$t.substr(8,2);
        var date = month + "/" + day + "/" + year;
        var href = json.feed.entry[i].link[0].href;
        var title = json.feed.entry[i].title.$t;
        if (day.substr(0,1) == "0") {
        day = day.substr(1);
        }
        document.getElementById("cal1Titles").innerHTML += "<li><a href='" + href + "'>" + title + "</a>";
        _dayTitles[day] += "<li><a href='" + href + "'>" + title + "</a>";
        YAHOO.example.calendar.cal1.addRenderer(date, myCustomRenderer);
        }
        YAHOO.example.calendar.cal1.render();
        }
        document.getElementById("cal1loadimg").style.display = "none";
        };
        function showDayTitles(day) {
        document.getElementById("cal1Titles").innerHTML = _dayTitles[day];
        }
        var myCustomRenderer = function(workingDate, cell) {
        var day = workingDate.toString().substr(8,2);
        if (day.substr(0,1) == "0") {
        day = day.substr(1);
        }
        cell.innerHTML = '<div onmouseover="showDayTitles(' + day + ');"><a href="javascript:void(null);" >' + YAHOO.example.calendar.cal1.buildDayLabel(workingDate) + "</a></div>";
        YAHOO.util.Dom.addClass(cell, YAHOO.example.calendar.cal1.Style.CSS_CELL_SELECTABLE);
        YAHOO.util.Dom.addClass(cell, YAHOO.example.calendar.cal1.Style.CSS_CELL_HIGHLIGHT1);
        return YAHOO.widget.Calendar.STOP_RENDER;
        }
        var mySelectHandler = function(type,args,obj) {
        var dates = args[0];
        var date = dates[0];
        var year = date[0];
        var month = date[1];
        if (month.toString().length == 1) {
        month = "0" + month;
        }
        var day = date[2];
        var element = YAHOO.util.Dom.getElementsByClassName("d" + day, "td", "cal1Container")[0];
        if (day.toString().length == 1) {
        day = "0" + day;
        }
        if (element.className.indexOf("highlight1") != -1) {

        window.location = _yourBlogUrl + "/search?updated-min=" + year + "-" + month + "-" + day +
        "T00%3A00%3A00" + _yourBlogTimeZone + "&updated-max=" + year + "-" + month + "-" + day +
        "T23%3A59%3A59" + _yourBlogTimeZone;
        }
        };
        var changeDate = function() {
        YAHOO.example.calendar.cal1.setMonth(parseInt(YAHOO.util.Dom.get("cal1monthselect").value));
        YAHOO.example.calendar.cal1.setYear(parseInt(YAHOO.util.Dom.get("cal1yearselect").value));
        YAHOO.example.calendar.cal1.render();
        myChangePageHandler();
        }
        var syncMonthYear = function(type) {
        YAHOO.util.Dom.get("cal1monthselect").value = parseInt(YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getMonth());
        var fullYear = parseInt(YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getFullYear());
        var isYearFound = false;
        var i = 0;
        while(i < document.getElementById("cal1yearselect").options.length && !isYearFound) {
        if (document.getElementById("cal1yearselect").options[i].value == fullYear) {
        isYearFound = true;
        }
        i++;
        }
        if (!isYearFound) {
        var option = document.createElement("option");
        option.setAttribute("value", fullYear);
        var text = document.createTextNode(fullYear);
        option.appendChild(text);
        document.getElementById("cal1yearselect").appendChild(option);
        }
        YAHOO.util.Dom.get("cal1yearselect").value = fullYear;
        };
        YAHOO.util.Event.addListener(window, "load", cal1Init);
        YAHOO.util.Event.addListener("cal1dateselect", "click", changeDate);
        //]]>
        </script>
        <!-- FIN DE PARTE 2 -->








      Agora vá até "Elementos de página", clique em "Adicionar um elemento de página" e clique em HTML/Javascript, e cole o segundo código.

      Pegar 2º código




        <div id="cal1wrapper">
        <div id="cal1select">
        <select id="cal1monthselect" name="cal1monthselect">
        <option value="0"/>Janeiro
        <option value="1"/>Fevereiro
        <option value="2"/>Março
        <option value="3"/>Abril
        <option value="4"/>Maio
        <option value="5"/>Junho
        <option value="6"/>Julho
        <option value="7"/>Agosto
        <option value="8"/>Setembro
        <option value="9"/>Outubro
        <option value="10"/>Novembro
        <option value="11"/>Dezembro
        </select>
        <select id="cal1yearselect" name="cal1yearselect">
        <option value="1995"/>1995
        <option value="1996"/>1996
        <option value="1997"/>1997
        <option value="1998"/>1998
        <option value="1999"/>1999
        <option value="2000"/>2000
        <option value="2001"/>2001
        <option value="2002"/>2002
        <option value="2003"/>2003
        <option value="2004"/>2004
        <option value="2005"/>2005
        <option value="2006"/>2006
        <option value="2007"/>2007
        <option value="2008"/>2008
        <option value="2009"/>2009
        <option value="2010"/>2010
        <option value="2011"/>2011
        <option value="2012"/>2012
        <option value="2013"/>2013
        <option value="2014"/>2014
        <option value="2015"/>2015
        <option value="2016"/>2016
        <option value="2017"/>2017
        <option value="2018"/>2018
        <option value="2019"/>2019
        </select>
        <input id="cal1dateselect" value="-->" type="button"/>
        </div>
        <div id="cal1Container"><img style="vertical-align:middle;
        " src="http://img239.imageshack.us/img239/9057/40lf8.gif"/&gt; Carregando...</div>
        <div style="clear:both;"></div>
        <div id="calbackloadimg">
        <pre id="cal1loadimg" style="display:none;"><img style="vertical-align:middle;" src="






      Agora pegue este 3º código, volte ao HTML do seu blog e cole antes de : ]]></b:skin>
      o código abaixo, para que não apareçam as postagens abaixo do calendário. *OPCIONAL



      #calbackloadimg{
      display:none;
      }

      Ranking Technorati

      Nenhum comentário:
      O blog Purple Moggy's desponibilizou um código para sabermos qual o nosso ranking no Technorati quantos são os blogs que tem links para nosso blog. Claro que para isso você tem que estar cadastrado no site da Technorati. Copie os códigos e coleque-os nos locais indicados colocando o endereço do seu blog no local indicado.

      Vá até o HTML do seu blog e procure pelo código: ]]></b:skin>



      ATENÇÃO: onde está em verde é o endereço da imagem, querendo outro é só trocar pelo endereço da imagem de sua preferência.



      Pegar código





        div.tec_name {
        display:none;
        }
        div.tec_rank {
        background: url(http://static.technorati.com/static/css/img/icn/talkbubble.png) 0 2px no-repeat;
        padding-left:16px;
        }
        div.tec_rank a:link, div.tec_rank a:visited {
        color: #390;
        text-decoration:none;
        }
        div.tec_rank a:hover {
        border-bottom:1px dashed #390;}



      Agora copie o próximo código e cole-o em HTML/Javascript, faça a mudança para o endereço de seu blog no local em vermelho e salve.


      Pegar 2º código





        <script src=" http://purplemoggy.clawsorpaws.com/technorati/rank.php?u=AQUI O ENDEREÇO DE SEU BLOG" type="text/javascript"/<</script<

      Gerador de cores

      Um comentário:
      Vá passando o mouse por cima do círculo e tomando nota das cores. Para personalizar o template, os posts, etc.








      27 de abr. de 2008

      Cartoom com suas fotos

      Nenhum comentário:
      Faça efeitos em suas imagens no site Befunky. Você pode fazer o efeito cartoom, colocar adereços, fazer caricatura e outras coisinhas. Recomendo !!!














      Redirecionar itens dentro do texto

      4 comentários:
      Este código permite que você faça um redirecionamento dentro do próprio post. Veja o exemplo. Clique nos títulos dos links abaixo.

      Mas atenção, copie o código e cole em seu bloco de notas fazendo lá as modificações necessárias. Cole em "Editar HTML" onde você escreve e publique pois, caso você clique em escrever para ver como ficou, o Blogger automaticamente modifica o código





      O amor é fogo que arde
      Se tanta pena
      Descalça vai a frente
      Mudam-se os tempos
      Qual tal a borboleta



      O amor é fogo que arde

      O amor é fogo que arde

      Amor é fogo que arde sem se ver

      Amor é fogo que arde sem se ver;
      É ferida que dói e não se sente;
      É um contentamento descontente;
      É dor que desatina sem doer;

      É um não querer mais que bem querer;
      É solitário andar por entre a gente;
      É nunca contentar-se de contente;
      É cuidar que se ganha em se perder;

      É querer estar preso por vontade;
      É servir a quem vence, o vencedor;
      É ter com quem nos mata lealdade.

      Mas como causar pode seu favor
      Nos corações humanos amizade,
      Se tão contrário a si é o mesmo Amor?

      Luís de Camões


      Se tanta pena

      Se tanta pena

      Se tanta pena tenho merecida

      Se tanta pena tenho merecida
      Em pago de sofrer tantas durezas,
      Provai, Senhora, em mim vossas cruezas,
      Que aqui tendes u~a alma oferecida.

      Nela experimentai, se sois servida,
      Desprezos, desfavores e asperezas,
      Que mores sofrimentos e firmezas
      Sustentarei na guerra desta vida.

      Mas contra vosso olhos quais serão?
      Forçado é que tudo se lhe renda,
      Mas porei por escudo o coração.

      Porque, em tão dura e áspera contenda,
      ƒÉ bem que, pois não acho defensão,
      Com me meter nas lanças me defenda.

      Luís de Camões


      Descalça vai a frente

      Descalça vai a frente


      Descalça vai para a fonte

      Descalça vai para a fonte
      Lianor pela verdura;
      Vai fermosa, e não segura.

      Leva na cabeça o pote,
      O testo nas mãos de prata,
      Cinta de fina escarlata,
      Sainho de chamelote;
      Traz a vasquinha de cote,
      Mais branca que a neve pura.
      Vai fermosa e não segura.

      Descobre a touca a garganta,
      Cabelos de ouro entrançado
      Fita de cor de encarnado,
      Tão linda que o mundo espanta.
      Chove nela graça tanta,
      Que dá graça à fermosura.
      Vai fermosa e não segura.

      Luís de Camões


      Mudam-se os tempos

      Mudam-se os tempos



      Mudam-se os tempos, mudam-se as vontades

      Mudam-se os tempos, mudam-se as vontades,
      Muda-se o ser, muda-se a confiança;
      Todo o mundo é composto de mudança,
      Tomando sempre novas qualidades.

      Continuamente vemos novidades,
      Diferentes em tudo da esperança;
      Do mal ficam as mágoas na lembrança,
      E do bem, se algum houve, as saudades.

      O tempo cobre o chão de verde manto,
      Que já coberto foi de neve fria,
      E em mim converte em choro o doce canto.

      E, afora este mudar-se cada dia,
      Outra mudança faz de mor espanto:
      Que não se muda já como soía.

      Luís de Camões






      Qual tal a borboleta

      Qual tal a borboleta



      Qual tem a borboleta por costume

      Qual tem a borboleta por costume,
      Que, enlevada na luz da acesa vela,
      Dando vai voltas mil, até que nela
      Se queima agora, agore se consume,

      Tal eu correndo vou ao vivo lume
      Desses olhos gentis, Aónia bela;
      E abraso-me por mais que com cautela
      Livrar-me a parte racional presume.

      Conheço o muito a que se atreve a vista,
      O quanto se levanta o pensamento,
      O como vou morrendo claramente;

      Porém, não quer Amor que lhe resista,
      Nem a minha alma o quer; que em tal tormento,
      Qual em glória maior, está contente.

      Luís de Camões













      Pegar código



        <CENTER><P>
        <A HREF = "#FAQ1">Título 1</A>
        <A HREF = "#FAQ2">Título 2</A>
        <A HREF = "#FAQ3">Título 3</A>
        <A HREF = "#FAQ4">Título 4</A>
        <A HREF = "#FAQ4">Título 5</A>
        </CENTER>
        <p><HR><p><A NAME = "FAQ1"><U>Título 1</U></A><p> AQUI O TEXTO DE NUMERO 1
        <p><HR><p><A NAME = "FAQ2"><U>Título 2</U></A><p>AQUI O TEXTO DE NUMERO 2
        <p><HR><p><A NAME = "FAQ3"><U>Título 3</U></A><p>AQUI O TEXTO DE NUMERO 3
        <p><HR><p><A NAME = "FAQ4"><U>Título 4</U></A><p>AQUI O TEXTO DE NUMERO 4
        <p><HR><p><A NAME = "FAQ5"><U>Título 5</U></A><p> AQUI O TEXTO DE NUMERO 5
        <p><HR><p>



      Template Azul 2 Tons

      Nenhum comentário:

      Free Image Hosting at www.ImageShack.us

      Visualizar




      Download

      Ou pegue o código AQUI


      26 de abr. de 2008

      Novo blog

      Nenhum comentário:
      Bom pessoal, ainda estou com este blog em construção e ele será um diretório sobre dicas de alguns blogs brasileiros. Caso você tenha um blog de dicas e queira participar é só deixar um comentário. Atenção, este blog não tem posts, apenas os links de alguns blogs, ele não será atualizado e caso o seu blog estiver lá e não for do seu agrado, avise-me que o retirarei imediatamente.


      Visite, link, divulgue, não é um blog meu, é um blog para o usuário e o fiz linkando alguns blogs que gosto e frequento. Beijinhos















      24 de abr. de 2008

      Imagem antes de comentários ao pé do post

      Um comentário:
      Para colocar uma imagem antes dos comentários ao pé do post do Blogger, vá até o HTML do seu Blogger e clique em "Expandir elementos de widgets". Agora procure pelo código:




      <span class='post-comment-link'>



      E abaixo delecole o seguinte código:





      <img src="AQUI O ENDEREÇO DE SUA IMAGEM"/>





      Abaixo alguma imagens que fiz. Salve em seu pc e depois as hospede.






      Algumas imagens que encontrei na net

      Imagem antes de marcadores, ao pé do post no Blogger

      11 comentários:

      Para colocar uma imagem antes de "MARCADORES" ao pé de cada post no Blogger, vá até o HTML do seu blog e clique em "Expandir modelo de widget", agora procure pelo código:

      <a expr:href='data:label.url' rel='tag'>

      Troque pelo código abaixo e insira no local indicado o endereço da imagem




      <a expr:href='data:label.url' rel='tag'><img src='AQUI O ENDEREÇO DE SUA IMAGEM '/>



      Você pode colocar a imagem que quiser. Abaixo algumas imagens de TAG que fiz. Salve em seu pc e hospede-os em algum site.



      Essas abaixo foram encontradas na net, só modifiquei as cores



      Copyright © Templates e Acessórios |
      Design by Elke di Barros | Tecnologia do Blogger
        Twitter Facebook Google + YouTube