25 de janeiro de 2011

Tutorial: Sexy BookMarks no Blogspot

Aumente as visitas do seu blog colocando social bookmarks. Uma dica interessante para que você melhore seus resultados é a adição do sexy bookmarks, um plugin feito para wordpress contendo links dos artigos para envio as redes sociais como twitter, digg,facebook,stambleupon e outros.  Agora você já pode usar o sexy bookmarks na plataforma do blogger. Acompanhe este tutorial de implementação e deixe seu blog mais bonito e social. 

Esta imagem abaixo mostra como ficará a exibição do plugin no seu blog:

Para que você possa exibir corretamente os links de social bookmarks em seu blog entre no painel de controle do blogger procure pela aba "layout" e depois clique em "Editar HTML" para exibir o código fonte do seu template. Antes de editar seu template clique em baixar modelo completo para fazer um backup do theme evitando assim erros posteriores que possam ocorrer em seu blog. Depois de feito o backup, clique em "Expandir modelos de widgets" copie e cole os códigos a seguir antes da tag: </head>


<!-- sexybookmarks -->
 <script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function() {
// xhtml 1.0 strict way of using target _blank
jQuery(&#39;.sexy-bookmarks a.external&#39;).attr(&quot;target&quot;, &quot;_blank&quot;);
// this block sets the auto vertical expand when there are more than
// one row of bookmarks.
var sexyBaseHeight=jQuery(&#39;.sexy-bookmarks&#39;).height();
var sexyFullHeight=jQuery(&#39;.sexy-bookmarks ul.socials&#39;).height();
if (sexyFullHeight&gt;sexyBaseHeight) {
jQuery(&#39;.sexy-bookmarks-expand&#39;).hover(
function() {
jQuery(this).animate({
height: sexyFullHeight+&#39;px&#39;
}, {duration: 400, queue: false});
},
function() {
jQuery(this).animate({
height: sexyBaseHeight+&#39;px&#39;
}, {duration: 400, queue: false});
}
);
}
// autocentering
if (jQuery(&#39;.sexy-bookmarks-center&#39;)) {
var sexyFullWidth=jQuery(&#39;.sexy-bookmarks&#39;).width();
var sexyBookmarkWidth=jQuery(&#39;.sexy-bookmarks:first ul.socials li&#39;).width();
var sexyBookmarkCount=jQuery(&#39;.sexy-bookmarks:first ul.socials li&#39;).length;
var numPerRow=Math.floor(sexyFullWidth/sexyBookmarkWidth);
var sexyRowWidth=Math.min(numPerRow, sexyBookmarkCount)*sexyBookmarkWidth;
var sexyLeftMargin=(sexyFullWidth-sexyRowWidth)/2;
jQuery(&#39;.sexy-bookmarks-center&#39;).css(&#39;margin-left&#39;, sexyLeftMargin+&#39;px&#39;);
}
});
</script>

<style type='text/css'>
div.sexy-bookmarks{margin:20px 0 0 0; border: 0;outline: none;clear:both !important}
div.sexy-bookmarks-expand{height:29px; overflow:hidden}
.sexy-bookmarks-bg-sexy, .sexy-bookmarks-bg-love{background-image:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7X7QV93qp0ZGfNfFNMa-r37RMrp4y0Nw1AbwsgMxq6VfFZwOJYnL-OavK6gOux3W0ApLWZT9yZe5tECI_Jo86GGwFXDcoFHw_g0XoCKglkDgWeFvuOpv6pWwnzvkUNgr9n23fOR9G3NSn/&#39;) !important; background-repeat:no-repeat}
div.sexy-bookmarks-bg-love{padding:26px 0 0 10px; background-position:left -1148px !important}
div.sexy-bookmarks ul.socials{width:95% !important; margin:0 !important; padding:0 !important; float:left}
div.sexy-bookmarks ul.socials li{display:inline !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:60px !important; cursor:pointer !important; padding:0 !important}
div.sexy-bookmarks ul.socials li:before, div.sexy-bookmarks ul.socials li:after, div.sexy-bookmarks ul.socials li a:before, div.sexy-bookmarks ul.socials li a:after{content:none !important}
div.sexy-bookmarks ul.socials a{display:block !important; width:60px !important; height:29px !important; text-indent:-9999px !important; background-color:transparent !important}
div.sexy-bookmarks ul.socials a:hover{background-color:transparent !important}
.sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumbleupon, .sexy-stumbleupon:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoobuzz, .sexy-yahoobuzz:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-scriptstyle, .sexy-scriptstyle:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-comfeed, .sexy-comfeed:hover, .sexy-newsvine, .sexy-newsvine:hover, .sexy-linkedin, .sexy-linkedin:hover, .sexy-google, .sexy-google:hover, .sexy-friendfeed, .sexy-friendfeed:hover{background:url(&#39;http://bnote.googlecode.com/files/sexy-sprite-new.png&#39;) no-repeat !important;border: 0;outline: none;}
.sexy-digg{background-position:-980px bottom !important}
.sexy-digg:hover{background-position:-980px top !important}
.sexy-reddit{background-position:-700px bottom !important}
.sexy-reddit:hover{background-position:-700px top !important}
.sexy-stumbleupon{background-position:-630px bottom !important}
.sexy-stumbleupon:hover{background-position:-630px top !important}
.sexy-delicious{background-position:-1190px bottom !important}
.sexy-delicious:hover{background-position:-1190px top !important}
.sexy-yahoobuzz{background-position:-1120px bottom !important}
.sexy-yahoobuzz:hover{background-position:-1120px top !important}
.sexy-blinklist{background-position:-1260px bottom !important}
.sexy-blinklist
.sexy-technorati{background-position:-560px bottom !important}
.sexy-technorati:hover{background-position:-560px top !important}
.sexy-myspace{background-position:-770px bottom !important}
.sexy-myspace:hover{background-position:-770px top !important}
.sexy-twitter{background-position:-490px bottom !important}
.sexy-twitter:hover{background-position:-490px top !important}
.sexy-facebook{background-position:-1330px bottom !important}
.sexy-facebook:hover{background-position:-1330px top !important}
.sexy-mixx{background-position:-840px bottom !important}
.sexy-mixx:hover{background-position:-840px top !important}
.sexy-scriptstyle{background-position:-280px bottom !important}
.sexy-scriptstyle:hover{background-position:-280px top !important}
.sexy-designfloat{background-position:-1050px bottom !important}
.sexy-designfloat:hover{background-position:-1050px top !important}
.sexy-newsvine{background-position:left bottom !important}
.sexy-newsvine:hover{background-position:left top !important}
.sexy-google{background-position:-210px bottom !important}
.sexy-google:hover{background-position:-210px top !important}
.sexy-comfeed{background-position:-420px bottom !important}
.sexy-comfeed:hover{background-position:-420px top !important}
.sexy-linkedin{background-position:-70px bottom !important}
.sexy-linkedin:hover{background-position:-70px top !important}
.sexy-friendfeed{background-position:-1750px bottom !important}
.sexy-friendfeed:hover{background-position:-1750px top !important}
.sexy-link{ margin-left:25px; float:left}
.sexy-link A{padding:10px 0; width:470px; text-align:right; border:0; outline:none}</style>
<!-- sebookmarks -->

Salve seu template. Se tudo correr bem repita o processo dessa vez para copiar o código que vai aparecer em baixo das suas postagens clicando novamente em "expandir modelo de widgets" procure pela tag: "<data:post.blog/>" ou <data:post.body/> cole logo abaixo desta tag. Salve novamente e pronto você já estará exibindo o sexy bookmarks no rodapé dos seus posts. 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='sexy-bookmarks sexy-bookmarks-expand sexy-bookmarks-bg-love' style='margin:20px 0 0 0 !important; padding:25px 0 0 10px !important; height:29px;/*the height of the icons (29px)*/ display:block !important; clear:both !important;'>
<ul class='socials'>
<li class='sexy-delicious'><a class='external' expr:href='&quot;http://del.icio.us/post?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Compartilhe isto no del.icio.us'>Compartilhe isto no del.icio.us</a></li>
<li class='sexy-digg'><a class='external' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Digg this!'>Digg this!</a></li>
<li class='sexy-stumbleupon'><a class='external' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'>Stumble upon something good? Share it on StumbleUpon</a></li>
<li class='sexy-reddit'><a class='external' expr:href='&quot;http://reddit.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Compartilhe isto no Reddit'>Compartilhe isto no Reddit</a></li>
<li class='sexy-google'><a class='external' expr:href='&quot;http://www.google.com/bookmarks/mark?op=add&amp;bkmk=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Add this to Google Bookmarks'>Add this to Google Bookmarks</a></li>
<li class='sexy-twitter'><a class='external' expr:href='&quot;http://twitter.com/home?status=Reading: &quot; + data:blog.title + &quot; - &quot; + data:post.url + &quot; (@NAME)&quot;' rel='nofollow' title='Tweet This!'>Tweet This!</a></li>
<li class='sexy-facebook'><a class='external' expr:href='&quot;http://www.facebook.com/share.php?u=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Compartilhe isto no Facebook'>Compartilhe isto no Facebook</a></li>
<li class='sexy-mixx'><a class='external' expr:href='&quot;http://www.mixx.com/submit?page_url=&quot; + data:post.url' rel='nofollow' title='Compartilhe isto no Mixx'>Compartilhe isto no Mixx</a></li>
<li class='sexy-comfeed'><a class='external' expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' rel='nofollow' title='Subscribe'>Subscribe</a></li>
<li class='sexy-yahoobuzz'><a class='external' expr:href='&quot;http://buzz.yahoo.com/submit/?submitUrl=&quot; + data:post.url' rel='nofollow' title='Buzz up!'>Buzz up!</a></li>
<li class='sexy-linkedin'><a class='external' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Compartilhe isto no Linkedin'>Compartilhe isto no Linkedin</a></li>
<li class='sexy-designfloat'><a class='external' expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Submit this to DesignFloat'>Submit this to DesignFloat</a></li>
<li class='sexy-technorati'><a class='external' expr:href='&quot;http://technorati.com/faves?add=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Compartilhe isto no Technorati'>Compartilhe isto no Technorati</a></li>
<li class='sexy-scriptstyle'><a class='external' expr:href='&quot;http://scriptandstyle.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Submit this to Script &amp; Style'>Submit this to Script &amp; Style</a></li>
<li class='sexy-myspace'><a class='external' expr:href='&quot;http://www.myspace.com/Modules/PostTo/Pages/?u=http&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Post this to MySpace'>Post this to MySpace</a></li>
<li class='sexy-blinklist'><a class='external' expr:href='&quot;http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;Url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Compartilhe isto no Blinklist'>Compartilhe isto no Blinklist</a></li>
<li class='sexy-friendfeed'><a class='external' expr:href='&quot;http://friendfeed.com/?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Compartilhe isto no FriendFeed'>Compartilhe isto no FriendFeed</a></li>
<li class='sexy-newsvine'><a class='external' expr:href='&quot;http://www.newsvine.com/_tools/seed&amp;save?u=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Seed this on Newsvine'>Seed this on Newsvine</a></li>
</ul><div style='clear:both;'/></div>
</b:if>


Obs.: O Sexy Bookmarks será exibido somente na post independente.

A rede social

O homem é bem um ser social, dado que não pode sobreviver sem uma relação com algo ou alguém para além de si. Há mesmo quem diga que o homem está diretamente implicado com o mundo no qual vive, com suas nuances e peculiaridades; e há ainda quem afirme que o homem vive em meio ao social e cria laços significativos para a sua existência. No entanto, este mesmo homem, dos tempos modernos ao tempo de hoje, tem atravessado grandes mudanças e vivido alguns fenômenos típicos deste período histórico que parecem contradizer (ou paradoxalmente reforçar) a dimensão social de sua existência. Fenômenos como o individualismo e o niilismo são marcas do homem contemporâneo, como já previa Nietzsche nos anos 1800 e como já havia notado Heidegger em meados dos século passado.


O filme dirigido por David Fincher, "A Rede Social", confirma essa caraterização. Curiosamente um filme que narra a aventura de um nerd cuja principal forma de existência é o computador e que cria uma rede social virtual. A "rede social" que ele cria conecta milhões de pessoas de todo o mundo facilitando a troca de informações, mensagens e até de arquivos, a depender dos aplicativos utilizados. O filme "A Rede Social" não é só a história de criação de um site de sucesso, pois retrata a geração dos jovens de hoje, cada vez mais ávidos por informação e cada vez mais ágeis na obtenção de tal informação.

Sem uma análise mais criteriosa, é fácil perceber que estamos sempre mais conectados, todavia, sempre mais presos e dependentes ao computador, que virou amigo de confiança. A rede social de um suposto mundo virtual ganha força com a troca de informações do mundo real, o que me faz afirmar que mesmo o virtual é real. No entanto, o que está em jogo aqui é a dependência que as ferramentas tecnológicas podem exercer sobre a pessoa, uma vez que criam uma nova forma de intermediário na relação interpessoal. A pessoa tende a depender de algum instrumento para estabelecer ou mesmo fortalecer suas relações, pois ela mesma não é capaz de encarar o mundo e o outro de forma direta como forma de se proteger.


Com as diversas redes sociais espalhadas na internet, é possível perceber que se por um lado elas são bastante úteis para aproximar as pessoas, por outro podem ser prejudiciais quando criam dependência ou quando em nada contribuem para o florescimento das relações pessoais no dia-a-dia de cada usuário. Se há quem se conecte para dizer o que está fazendo ou sentindo para as suas centenas de "amigos", há quem se conecte porque não há amigos de fato e o computador é um intermediário na sua relação com mundo. Em suma, mesmo com a expansão das redes sociais na rede mundial de computadores, não há nada que se compare com os contatos pessoais. Facebook, Orkut, MySpace, dentre outras redes, precisam ser espaços bem utilizados, de modo a complementar ou enriquecer o universo pessoal de quem as utiliza. Do contrário, será somente mais uma evidência do crescente (e paradoxal) isolamento do homem de hoje.


Agora chegou a Rede social para você conhecer os seus vizinho e VIZINHAS*


Hoje, com a difusão da Internet, temos cada vez mais amigos virtuais, colecionamos figurinhas de pessoas que só vimos uma vez na vida ou às vezes nunca vimos. Por outro lado, não sabemos nem os nomes dos nossos vizinhos e perdemos a oportunidade de fazer boas amizades com pessoas que muitas vezes podem ter o mesmo interesse e que moram a poucos metros da nossa casa. Enfim, são muitas possibilidades e vantagens em saber quem são e quais os interesses dos seus vizinhos.

Com esse intuito foi criado o CROMAZ, uma rede social que organiza seus usuários de forma geográfica, identificando os que estão mais próximos de você. E tudo feito com muita segurança e sigilo, pois os nomes de bairros e ruas não são exibidos em momento algum nas telas. Um usuário só consegue saber a rua ou bairro de outra pessoa se ambos estiverem cadastrados no mesmo endereço, além da troca de endereço do cadastro ser permitida somente uma vez a cada três meses.
O mais interessante é que o CROMAZ é uma rede social… social de fato. Que permite encontrar vizinhos e amigos potenciais, pessoas de verdade, muito mais que simplesmente colecionar contatos.



Para finalizar, faço o convite para assistir ao filme citado e tirar as próprias conclusões! São muitas as questões que podem ser levantadas sobre este argumento e certamente poderei retomá-las em outras oportunidades. Enquanto isso, você também pode manifestar as suas reflexões clicando no link logo abaixo do trailer.



Fonte sedentario.org blog.maisestudo.com

 
Design by @cleidimarviana | Bloggerized by Cleidimar Viana - Diário de Sistema