Como criar um blog/site de sucesso

Esse tutorial fica mais como uma dica do que como um passo-a-passo, como estávamos fazendo, mas isso não quer dizer que ele não seja importante. Talvez seja até o mais importante entre todos os outros tutoriais.

Bom eu reuni 8 (oito) importantes tópicos para se ter um blog/site de sucesso. Entretanto, o tuto não vai falar só sobre divulgação (que também é importante). Vamos falar um pouco também sobre ações em seu blog que vai ou não fazer diferença em suas visitas:

#01 - Conteúdo "Único"

(Já cometi esse erro)

Vamos começar falando sobre conteúdo.

Se você recém criou o seu blog, vc provavelmente não tem muita certeza do conteúdo que quer postar nele, correto? Ou se tem, de repente dá uma loka e quer trocar tudo, não é?

Pois saiba que para o seu blog "estabilizar" na net, você precisa ter um conteúdo fixo, chamando a atenção de um determinado público, em específico.

#02 - Conteúdo Exclusivo

(Já cometi esse erro)

É importante que o seu blog/site tenha um conteúdo inovador, que os outros sites não tenham, como a nossa Jutsu Dex, que ainda não estreou ou conteúdos mais raros de se encontrar, como a nossa Attack Dex.

Assim, o seu blog adquirirá uma certa fama especificamente por causa do conteúdo,

tornando-o um especialista no assunto.

#03 - Nada de Plágios

(Já cometi esse erro)

Não copiar nada de outros sites é um passo importante para que o seu blog tenha sucesso. Você deve "editar" as postagens dos outros blogs/sites, como as news. Se tiver algum conteúdo de download, imagem exclusiva (feita por alguém do site), entre outros, é aconselhável que se dê créditos ao site - também aconselho a colocar um link para a postagem original.

#04 - Qualidade NÃO Quantidade

De fato, um blog que tem várias postagens acaba atraindo mais a atenção do público, mas não importa a quantidade e sim, a qualidade. Quanto mais postagens de boa (ou melhor, ótima) qualidade você tiver, melhor será o desempenho do seu blog e mais visitas você terá.

#05 - Redes Sociais

Criar uma página no Facebook ajuda a promover o seu site/blog nas redes sociais. Alguns blogs ainda tem o Twitter. Você ainda pode comparar o números de "Curtir" e "Followers" com o número de Seguidores do blog. Ah, e hoje em dia, ainda tem os Seguidores do Google +.

Os blogs/sites mais antigos ainda possuem um perfil ou comunidade no orkut. Alguns ainda optam por um canal no You Tube, com videos exclusivos.

#06 - Parceria

Criar uma página só para o fechamento de parcerias no seu blog é algo importantíssimo. Se necessitar, utilize este tutorial para criar seus banners/buttons.

Primeiro, troque buttons com blogs que não necessitem de muitas visitas (Cuidado - Visitas e visualizações de página não são a mesma coisa), depois vá aumentando o nível à medida em que as suas vistas crescerem.

Além dos blogs parceiros lhe concederem visitas, você concede visitas à eles também. Legal, não?

#07 - Publicidade

Fazer publicidade é outra coisa que "chama" visitas para seu blog. Para isso, você precisará de um "Button tamanho família" para estampar no blog do 'aliado'. Em troca, você também terá que ter em seu site/blog, o button do aliado, estampado. É quase a mesma coisa na parceria, só que aqui, os buttons são maiores (Bem maiores) e chamam mais atenção.

#08 - Projetos Novos

(Já cometi esse erro)

Não sei porque, mas alguns blogs nunca mudam o seu "roteiro". É importante saber que os leitores estão em, busca de entretenimento, por isso, coisas muito "usadas" não vão ser boas para o blog. De mês em mês, procure criar "quadros" novos para o blog. Matérias, reportagens ,entrevistas com outros blogs e tal, sempre fazem sucesso.

Ah, e sempre que o blog comemorar uma data especial, como aniversário, é bom criar coisas novas também!

Bom, por enquanto era só! Espero que tenham curtido!

Quando o blog tiver 47 ou mais "curtidas" no Facebook, eu faço o próximo tutorial, ok?

Falta pouco.

Como programar postagens no blog

Bom, esse tutorial não tem muito a ver com Design ou HTML, e sim com o blog. afinal, pra vc ter um blog bom, vc tem que saber mexer, não é mesmo? Bom, essa aula de hoje é pra vc que postou alguma coisas antes do tempo e logo reverteu a postagem para o rascunho...

Quando vc foi postar de novo ela ficou no mesmo lugar que tava não é mesmo? Ela não ficou no lugar da primeira postagem (se vc postou algo depois ((antes?)) dela, é claro). Vamos aprender como se resolve esse problema, então?

Bom, a aula de hoje nos ensina como "programar" as postagens.

1 - Primeiros passos:

Clique em "Programar", nas configurações de Postagens, no lado direito do editor do blog.

Feito isso, clique em "Definir data e hora"...

2 - Data:

Aqui vc vai poder alterar as datas e as horas, mas antes disso, salve a postagem (Caso a data que vc colocou for substituída automaticamente por outra ((em questão de segundos)), coloque novamente a data que vc quer - isso acontece pq o blog vai salvar a postagem sozinha e a data vai voltar a ser a que tinha antes de vc alterar). 

3 - Hora:

Bom, sempre coloque uma hora que já se passou, se vc for postar "hoje" por exemplo, coloque um ou dois minutos antes do horário atual, que seja, mas não põe coisa que ainda vai acontecer (um ou dois minutos no futuro)! Uma vez eu perdi uma postagem com isso! Não sei se isso ainda acontece hoje em dia, mas tome bastante cuidado, hein? Talvez postar em horas futuras funcione para publicar uma postagem sozinha quando tal hora chegar, mas eu nunca tentei isso (depois do incidente)... Se alguém tentar e der certo, me avisa!

4 - Concluindo:

Clique em "Concluído" e Atualize ou publique a postagem! Vc verá que no blog a postagem "andou" e mudou a sua posição, porque ela foi postada em outra data, em outra hora... E para encerrar, digo que vc pode postar inclusive no "ano passado"! Vc, de fato, pode voltar no tempo! Legal, não? Pois é...

Bom, e até a próxima aula!

#Só Faço A Próxima Aula Quando A Fan Page Do Facebook Tiver 40 "Curtir"#

Combinado? É só curtir ali! Tenho certeza que com a sua ajuda, rapidinho chega em 40!

Fui!

Como colocar Slides Simples no Blog

Pessoal, há poucos minutos eu descobri como colocar slides simples no blog! Vamos aprender? Já vou avisando que vc vai ter que mexer com o código HTML do seu blog, portanto, salve o seu template sempre que fizer alguma alteração! Vamos dividir em etapas para vc compreender melhor...

1 - Código

Antes de mais nada vc precisará colocar um código no HTML do seu Blog. Vá em Design/Modelo > Editar HTML > Ctrl + F e procure por

</head>

(coloque as letras em minúsculo e retire os espaços entre os caracteres para pesquisar direitinho) e cole o seguinte código acima:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'/> <script src='http://static.tumblr.com/ifqwhnb/GBsm20q7d/jquery.nivo.slider.pack.js' type='text/javascript'/> <script type='text/javascript'> var $nv4wp = jQuery.noConflict(); $nv4wp(window).load(function() { $nv4wp('#slider').nivoSlider({ effect:'random', slices:15, // For slice animations boxCols: 4, // For box animations boxRows: 2, // For box animations animSpeed:500, // Slide transition speed pauseTime:3000, // How long each slide will show startSlide:0, // Set starting Slide (0 index) directionNav:true, //Next and Prev directionNavHide:true, //Only show on hover controlNav:true, // 1,2,3... navigation controlNavThumbs:false, // Use thumbnails for Control Nav controlNavThumbsFromRel:false, // Use image rel for thumbs controlNavThumbsSearch: '.jpg', // Replace this with... controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src keyboardNav:true, //Use left and right arrows pauseOnHover:true, //Stop animation while hovering manualAdvance:false, //Force manual transitions captionOpacity:0.8, //Universal caption opacity prevText: 'Prev', // Prev directionNav text nextText: 'Next', // Next directionNav text beforeChange: function(){}, // Triggers before a slide transition afterChange: function(){}, // Triggers after a slide transition slideshowEnd: function(){}, // Triggers after all slides have been shown lastSlide: function(){}, // Triggers when last slide is shown afterLoad: function(){} // Triggers when slider has loaded }); }); </script>

Procure também por ]]> e cole esse outro código acima:

/* The Nivo Slider styles */ #slider {position:relative;} #slider img {position:absolute; top:0px; left:0px; display:none;} #slider a {border:0; display:block;} .nivoSlider {position:relative; width: 356px;} .nivoSlider img {position:absolute; top:0px; left:0px;} /* If an image is wrapped in a link */ .nivoSlider a.nivo-imageLink {position:absolute; top:0px; left:0px; width:100%; height:100%; border:0; padding:0;margin:0; z-index:6; display:none;} /* The slices and boxes in the Slider */ .nivo-slice {display:block;position:absolute;z-index:5;height:100%;} .nivo-box {display:block;position:absolute;z-index:5;} /* Caption styles */ .nivo-caption {position:absolute;left:0px; bottom:0px; background:#000; color:#fff; text-transform: uppercase; width: 100%; z-index:50; border-right: 5px solid #;padding: 5px 0;} .nivo-caption p {padding:0 20px;margin:0;font-size:14px;} .nivo-caption a {display:inline !important;} .nivo-html-caption {display:none;} .nivo-directionNav a {position:absolute;top:45%;z-index:99;cursor:pointer;} .nivo-prevNav {left:0px;} .nivo-nextNav {right:0px;} /*============================*/ /*=== Custom Slider Styles ===*/ /*============================*/ .slider {width:100%;} .slider img {position:absolute;top:0px;left:0px;display:none;} .slider a {border:0;display:block;} .nivo-controlNav {display:none;} .nivo-directionNav a {display:block;width:31px;height:34px;background:url(http://twizonebr.com/Novidades/wp-content/themes/twizonebrvrs1/arrowswleft.png) no-repeat;text-indent:-9999px;border:0; } a.nivo-nextNav {background-position:-30px 0;right:15px;} a.nivo-prevNav { left:15px;} .nivo-caption {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;} .nivo-caption a {color:#efe9d1; text-decoration:underline;}

Salve tudo e feche o HTML.

2 - Adicionando os Slides

Agora vamos adicionar os slides em algum, lugar no blog. Vá em Layout > Adicionar um Gadget HTML/JavaScript  e cole esse outro código:

<div id="slide"> <div id="slider"> <a href="LINK" target="_blank"><img src="LINK DA IMAGEM" width="763" height="277" /></a> <a href="LINK" target="_blank"><img src="LINK DA IMAGEM" width="763" height="277" /></a> <a href="LINK" target="_blank"><img src="LINK DA IMAGEM" title="ESCREVA A DESCRIÇÃO"width="763" height="277" /></a> </div> </div>

Vc vai precisar saber o tamanho das imagens e o link. Confira esta legenda:

LINK DA IMAGEM: Link da imagem.

Width: Largura

Height: Altura

LINK: O link.

Fonte: Designer Project

Como colocar vídeos do You Tube no Blog

Pois é, em pleno século 21 tem gente que ainda não aprendeu a colocar vídeos no blog... Mas calma... Vou ensinar como colocar vídeos do You Tube!

Abra o vídeo desejado no You Tube. Agora, clique em Compartilhar:

Continuando, clique em Incorporar:



Abrirá uma caixinha com o código HTML do vídeo. Copie e cole em uma postagem do blog! Mas espera aí! O vídeo ficou grande demais e tá quebrando o design do meu blog!

Temos uma solução:



Clique em umas das caixinhas cinzas (na parte debaixo), ou então escolha os valores em píxeis colocando-os nas caixinhas com a borda azul em "Personalizado". Ainda nesta parte, vc pode aletrar outras configurações, mas aí a escolha é sua.

Após mudar esses valores, a caixa com o código HTML se alterará instantaneamente, então é só copiar e colar na postagem, lembrando que vc precisa entrar no modo "HTML" do editor de textos do blog para colar.

Bom, por enquanto era só!
Até a próxima!

Fui!

Imagem para voltar ao Topo

E aí, galerinha? Blz? Venho aqui para trazer mais um dos tutoriais exclusivos do HQ Union! (Agora eu troquei a imagem, repararam?)

Bom, a aula de hoje nos ensina a colocar uma imagem para retornar ao topo do blog! Clicando nela, o blog volta automaticamente por "início". É um processo meio chatinho de fazer, portanto preste muita atenção!

Certo... Entre no blog -> Layout ->Adicionar um Gadget -> HTML/JavaScript

*O Gadget pode ficar em qualquer lugar do blog, poisa imagem ficará "fixa"*

Bom, a seguir, cole este código:

<div style="position:fixed; bottom:0px; right:0px;"> <a href="#"><img src="URL DA IMAGEM" border="0" /></a></div>

Salve o Gadget imediatamente (Sem colocar título, nem nada)!

Observação::. Se vc clicar em "Formato Rich Text", pode ser que não funcione, por isso, salve o mais rápido possível!!

Fácil, é fácil, mas o ruim é esse Rich Text que muda o código original e assim, não acaba funcionando, portanto fiquem ligados, que ainda hoje, prometo trazer uma aula nova!

Fui!

Título ao passar o mouse sobre a imagem

É, eu sei que mais uma vez isso não é uma aula de HTML (Até tô achando que devo mudar o título para Tutoriais), mas isso merece um espacinho nas nossas aulas. Bom, o lance dessa vez é que descobri uma coisa nova no blog! Não sei se isso já tinha antes, mas... Bom, em primeiro lugar abra o blogger.

Clique em cima de uma imagem e uma "tirinha azul" vai aparecer. Clique então em "propriedades".

Vai abrir uma janelinha onde vc pode adicionar o Texto do Título e ainda um Texto Alternativo para descrever a imagem.

Bom, por enquanto era só!

Até a próxima!

Como criar Banners/Buttons para seu blog!

Pessoal, essa é uma grande dúvida, ou melhor, dificuldade, que muitos têm, por isso, vim explicar o passo-a-passo com essa pequena aulinha, que não é de HTML, mas merece estar entre os tutoriais (que eu parei de fazer já faz um bom tempo).

Bom, primeiro, vamos dividir a aula em etapas...

1 - Criando a imagem:

Vamos usar o programa PhotoFiltre, que é bem fácil de mexer!

Ao abrir o programa, clique em Arquivo e uma janela se abrirá. Nela vc pode escolher o tamanho da imagem que quer criar. Coloque 88 pixeis de largura por 31 pixeis de altura.

Pronto! Agora é com vc! Ao lado, em verde, temos a paleta de cores, que é "personalizável". Ao clicar em uma das setas, dá pra "pular" de paleta em paleta. Vc pode escolher as mais diversas cores e tonalidades para fazer o fundo de seu button.

Agora que preencheu o fundo com uma cor de sua preferência (ou não), clique em Camada > Novo > Abrir como camada e selecione uma imagem para colocar em cima da imagem atual, ou seja, o button.

A imagem irá aparecer centralizada, mas ao segurar com o mouse em cima dela, é possível arrastá-la.

Se colocar mais de uma, a telinha em laranja, na imagem, vai mostrar a nova camada e vc pode arrastá-las pra cima ou pra baixo, definindo qual vai se sobrepor à outra.

E por último, mas não menos importante, o texto. Para colocar um texto na sua imagem, é só clicar na ferramenta em destaque na imagem. Uma janelinha vai se abrir e ali vc pode personalizar como quiser o seu texto, colocando vários efeitos... Fique à vontade para criar o seu "logo".

Se o seu banner não for animado, ele estará pronto aqui,
mas, se vc quiser fazer uma animação, terá de criar várias imagens para torná-las frames das animações. Portanto, siga nossa próxima etapa!

2 - Criando a animação:

Para criar a animação, vamos precisar de outro programa, o PhotoScape...

Ao abrir a interface do programa, escolha a opção "Animação GIF", como na imagem:

Ao clicar ali, uma nova tela se abrirá. No canto direito, uma janelinha com as pastas de seu computador se abrirá. Ache sua imagem, clique em cima dela e arraste-a para a área que diz "Solte sua foto aqui"

Coloque as imagens que formarão sua animação em ordem, uma atrás da outra e elas já começarão a "piscar". Está tudo pronto, mas vc ainda pode trocar o efeito da animação, o tempo, entre outros...

Clique em salvar e seu banner está pronto! Agora é só hospedar em algum site de fotos (no blog é mais fácil) e pegar o código HTML da imagem e colocar no seu site, para que os "parceiros" possam distribuir por seus sites/blogs.

----------------------------------------------

Os programas que foram utilizados para fazer essa aula são:

*PhotoScape
*PhotoFiltre (Antigo PhotoFiltre Studio X)

Ambos podem ser baixados facilmente pela internet!

Aliás, vcs podem, clicar nos nomes dos programas acima que serão redirecionado para suas páginas de Download no Baixaki! Só tem um porém: as versões dos programas parecem estar bem mais atualizadas que as minhas versões, por isso, vai ser um pouco mais complicado mexer, mas é basicamente a mesma coisa ((se vc baixar os programas corretos, é claro))!

Então, boa sorte na criação de seus Banners e até a próxima!

----------------------------------------------

Créditos a baixaki.com.br pelos downloads
e
Créditos aos  desenvolvedores dos programas que foram utilizados nesta aula !!!

Tutoriais

Deixo aqui pra vocês alguns tutoriais bem básicos de HTML e alguns mais comuns para o melhor uso de seu blog com funções simples e até mesmo mais difíceis que vão deixar sua postagem/interface cada vez mais legal:

#01 - Caixinha de Texto

#02 - Texto em Movimento

#03 - Como criar Banners/Buttons para seu blog
#04 - Título ao passar o mouse sobre a imagem
#05- Imagem para voltar ao Topo
#06- Como colocar vídeos do You Tube no blog
#07- Como colocar Slides Simples no Blog
#08- Como programar postagens no Blog
#09- Como criar um blog/site de Sucesso
#10-

Se for copiar, coloque a mão em seu coração e dê créditos.

Texto em Movimento

E aí, galera? Venho aqui com + um cursinho de HTML! Desta vez venho ensinar como colocar texto se mexendo no blog e como usar isso em imagens!

Bom, tudo é muito simples! É colocar o seguinte código:

<marquee direction="right" onmouseover="this.stop();" onmouseout="this.start();" scrollamount="5">SEU TEXTO</marquee>

...E adicionar o seu texto.

Aliás, vc pode trocar a direção para qual ele se move, trocando "Right" (Direita) por:

"Left" - Esquerda
"Up" - Pra cima
"Down" - Pra baixo

Para fazer isso com uma imagem, é usar o código a seguir, antes de todas as imagens:

<marquee direction="up" scrollamount="4" with="200" height="200" onmouseout="this.start()" on="" onmouseover="this.stop()"><div align="center">

OBS: Você pode alterar os valores de With (Largura) e Height (Altura) de acordo com o tamanho das imagens.

Depois de todas as imagens, utilize este código:

</div> </div> </marquee>

E Pronto!

Sua "animação" foi concluída!

*Se copiar, favor colocar créditos*

Como Adicionar Caixinha de Texto no Blog

Pessoal, recebi um comentário me perguntando, então venho aqui trazer pra todos vcs, como colocar uma caixinha de texto no blog. É muito simples. É só colocar o HTML na postagem (ou no Gadget):

Como eu não consegui colocar o código aqui no blog,sem que ele fosse alterado, deixo o link de onde eu consegui:

Cliquem aqui

OBS: Vcs podem alterar as medidas mudando os valores de rows (linhas) e cols (número de letras).

Como fica:

ESCREVA AQUI O SEU TEXTO

Fonte: Tudo para seu blog

Como Capturar Pokémons

Como Capturar Pokémons

Para capturar os pokémons, em primeiro lugar, você deve ter no mínimo 1 pokéball, mas só para garantir a captura, tenha sempre, no mínimo, 5. Existem vários tipos de pokéballs, você deve escolher o melhor tipo para se usar.

Primeiro, você deve ficar andando sobre os matinhos até encontrar o pokémon (Em gramas que se mechem, águas borbulhantes ou terra se mexendo é só pisar em cima delas). Quando você encontrar o pokémon, a tela irá mudar e você irá parar na arena.

 

Escolha a opção Fight e escolha o melhor ataque contra o pokémon adversário. Use vários ataques,até que o HP (Vida) no adversário fique vermelho.

Quando acontecer isso, selecione Bag e escolha a pokéball que mais lhe agrada. Clique sobre ela e você lançará ela no pokémon adversário.

Ele entrará dentro da Pokéball e se estiver bem fraco, com o HP de preferência quase acabando, a Pokébola ficará preta e a captura será concluída.

Você será direcionado para um local onde tem a informação do pokémon capturado e um local onde se pode dar um apelido par o pokémon. Após concluir todas as operações, você voltará automaticamente para onde estava antes de entrar na arena.

Pode vir ao caso de você achar dois pokémons selvagens ao mesmo tempo (Em B/W nos matinhos mais escuros; em Gerações anteriores, só quando vc está acompanhado). Você pode escolher qual pokémon deseja redirecionar o ataque, mas cuidado: alguns ataques podem ferir o seu pokémon ao lado.

Conteúdo compartilhado por: HQ Union e Pokémon R5

By: Ri Lima.

 Se pegar, por favor, dar os devidos Créditos.

Tutorial: Criando uma Fanfic Pokémon!

Um Tutorial de primeira! Vou ensinar a vocês como se faz uma fanfic pokémon (Já que sou eu mesmo que posto as fanfics).

Opinião Intermediária de escritor de Fanfics

Iniciante eu não sou e profissional também não. Essa é uma opinião intermediária de escrever fanfics. Coisa que eu aprendi com o tempo, eu vim trazer trazer para vocês.

Clique em Mais informações>> para ver o tutorial.