1

INSERINDO BANNER HTML NO SIDEBAR DO WORDPRESS Olá leitores, saudações! Este tutorial é o resultado da necessidade que alguns dos nossos parceiros têm de conseguir firmar parceria por meio dos banners em HTML. É um pouco difícil mesmo quando se está começando com o HTML, porém depois de dominar os principais códigos, dá para desenvolver pequenos projeto sem muito esforço, garantindo assim que a qualidade do seu blog/site seja sempre mantida em bom nível. Antes de começar este tutorial, preciso esclarecer três pontos importantes: 

Este tutorial foi baseado nos modelos gratuitos do Wordpress, portanto, possui algumas limitações as quais será necessário um pouco mais de atenção;



É interessante que o colaborador/blogueiro tenha em mente a importância de ter uma página dedicada apenas aos parceiros, especialmente para que se possa haver mais integração (mais informações no final deste manual);



Qualquer

dúvida

ou

sugestão

pode

ser

encaminhada

para

[email protected]. Vou respondendo sempre que for possível, mas não deixo ninguém sem resposta! Agora sim. Vamos ao tutorial?

Buscando e inserindo banners do Monografando

Os banners do blog Monografando se encontram disponíveis na nossa página de parceiros. Na verdade, apenas um único banner de parceria (os demais, caso necessários, devem ser solicitados pelo futuro parceiro), que possui as dimensões de 300x137 pixels, dimensões consideravelmente boas, que divulgam sem estragar a estética da maioria dos blogs. Para adquirir o código é algo extremamente simples. Basta seguir os passos a seguir, sempre levando-se em conta que não se deve alterar os códigos (do contrário eles não irão funcionar), e os mesmos devem, se dentro do corpo da página (e não no widget adequado) serem inseridos na edição em modo HTML do Wordpress. O Wordpress não interpreta, diferentemente do Blogger, o HTML automaticamente, e monografandoblog.wordpress.com

2

esta já foi o tipo da questão que me deu muita dor de cabeça no início do processo de blogagem nesta plataforma. Vamos ao passo a passo. Figura 02

Figura 01

Ao clicar no link “Blogs parceiros” você Na página de parceiros, clique no link será automaticamente direcionado para a assinalado “Clique aqui”. Observação, página

dos

monografando.

parceiros

do

blog caso o seu navegador restrinja pop ups, mantenha pressionada Control (CTRL) no seu teclado antes de clicar no link.

A partir deste ponto, você será direcionado à página do Google Drive onde são hospedados todos os documentos do blog Monografando:

Figura 03

monografandoblog.wordpress.com

3

O link HTML padrão não precisa ser baixado ( ), pois ele permite a leitura e você pode simplesmente recortar e colar o mesmo na área adequada no Wordpress para tal finalidade. Exportando o banner para a plataforma Wordpress. Considerando que você já criou a sua página de blogs parceiros, a próxima etapa é, dentro da página, inserir o widget adequado para as suas necessidades, no caso, para a inclusão do banner em HTML. Figura 04

Essencial para os próximos passos que seja criada a página de blogs parceiros, a menos que o seu template gratuito tenha a opção “sidebar”, nesse caso, o parceiro poderá fazer o mesmo procedimento, porém com uma resposta diferente do ponto de vista do layout final do blog.

Passo 1 – abra o painel de controle na aba “meu site” do Wordpress e localize no menu a opção “temas”, a qual deverá ter ao lado, a opção “personalizar”. É essencial que se clique em “personalizar. Ao clicar em “temas”, você vai para o menu de templates do Wordpress, o que você já não precisa, uma vez que já escolheu o template adequado. A

localização

do

menu “temas” é o primeiro passo para a criação da sua página de parceiros. A Figura 05

seguir,

duas

possibilidades a ser observadas.

monografandoblog.wordpress.com

4

Passo 2 – selecione a sua página de parceiros, para ter acesso às funcionalidades disponíveis no seu template. Esta Figura 06

etapa

essencial,

é

porque

todos os aspectos do template direcionam para cada uma das páginas

que

são

criadas

como

nos

sites profissionais. Passo 3 – veja, no sidebar do seu template, a opção widgets. Ela abrirá um menu com todas as possibilidades de widgets disponíveis para o template escolhido (fig. 07):

Figura 07

A partir deste ponto, basta saber exatamente qual espaço você deve escolher. No caso do template Monografando, temos diversas opções de “footer”, que são os menus que estão abaixo do nosso blog, mas certamente os modelos que têm mais sidebars permitirão que esses menus devam ser constantemente modificados, especialmente nas suas localizações. O menu que nos interessa, no entanto, como mostrado na imagem a seguir, é o menu “lateral”, que certamente apresenta as opções de widgets para o que irá aparecer nas laterais do seu blog. Atenção ao conteúdo que já estiver disponível nele, porque a inclusão do widget lateral acaba por fazer mudanças drásticas no visual da página. Então, se não houver certeza sobre o que

monografandoblog.wordpress.com

5

será colocado, melhor formatar todos os banners dos seus parceiros após a criação deste widget.

Figura 08

Passo 4 selecione a opção “adicionar um widget” (

) para abrir as opções.

Figura 09

Existem vários widgets disponíveis para o uso no Wordpress. Muitos deles, em um primeiro momento não são opções muito interessantes, especialmente pra quem tá iniciando. Outros, ao contrário, são muito legais, servem bastante pra divulgar outros trabalhos, caso dos widgets do Facebook, Twitter e instagram. Claro, o blogueiro esperto vai pesquisar e selecionar aqueles que melhor atendem às suas necessidades, desde que, claro, eles não impliquem em uma grande mudança para a qual o mesmo não esteja preparado, Mas, de qualquer forma, o uso desses widgets vai facilitar e muito a vida de quem quer divulgar suas atividades. monografandoblog.wordpress.com

6

Passo 4 – Selecione e instale o widget “texto”, em seguida cole o banner HTML recortado anteriormente. Siga

o

link

disponível

na

página de parceiros do

blog

Monografando. Em seguida, recorte o Figura 10

código HTML. Insira

título

se

necessário e cole o banner no espaço apropriado para tal. Em

seguida

aguarde. Figura 11

Observe o seguinte:

Figura 12

Ao colar a imagem do banner na caixa de texto apropriada, o próprio blog já apresenta o texto pronto. Ou seja, se o método não deu certo, muito simples. Basta revisar e acrescentar o que for necessário, como por exemplo, corrigir códigos, incluir novos monografandoblog.wordpress.com

7

códigos. Caso tenha dado tudo certo, basta simplesmente confirmar a inserção do banner no blog, clicando em “salvar e publicar” (

). O widget em questão tem

a opção de inserir parágrafos automaticamente, porém, se no processo de desenvolvimento do seu widget os banners aparecerem juntos, é muito simples de resolver. Dê um “enter” e na linha a baixo insira a tag “

” (sem as aspas), e pronto. Automaticamente será criado um espaço em branco entre cada um dos posts.

Dicas úteis para melhorar a sua página de parceiros

Se a sua página de parceiros já existe, dê uma melhorada nela seguindo algumas dicas simples, porém viscerais para torna-la mais atraente. 

Transforme em um mini espaço para os seus parceiros. Renove os banners, coloque descrições das matérias importantes e sempre comunique os parceiros das alterações, geralmente eles endossam e divulgam toda menção às suas atividades.



Se o seu parceiro não tem um banner próprio, o jeito é você mesmo criar um. Proponha esse pequeno favor e aproveite pra colher os frutos dessa parceria. Caso ele tenha dificuldades para colocar tudo no site, indique este material. Ele vai adorar.



Nas redes sociais, sempre dê um destaque. Seu blog/site tem página do Facebook e Twitter? Ótimo, divulgue a sua página de parceiros como se estivesse divulgando uma nova postagem de vez em quando. Sempre peça pra os seus parceiros colaborarem dando retweets e compartilhando as suas principais publicações no Facebook.



Recrute mais parceiros. Sempre que for possível, visite os bloggers que curtirem suas postagens. Isso significa que alguém curtiu seu conteúdo, o que pode ser mais um parceiro para a sua rede.

Esse foi o nosso tutorial para a inserção de banner HTML no blog/site com plataforma gratuita Wordpress. Qualquer dúvidas, manda pro email na página inicial, e não deixa de curtir e comentar lá no blog, Facebook e canal do Youtube. Sucesso a todos! monografandoblog.wordpress.com