Some High-Tech Tips

This post in English

Antes de se modificar os aspectos da template do blog, é crítico fazer uma cópia de segurança da template. Se algo correr mal, pode-se depois voltar a trás com esta com esta cópia.

Como fazer cópia de segurança da template (ou modelo, em português)

1. Entrar no blog e clicar em Design
   
    
2. Clicar em Editar HTML
   
    
3. Clicar em Transferir modelo completo
   
     
4. Guardar o ficheiro algures no disco. É um ficheiro do tipo XML, que é basicamente texto com a template do blog. Pode ser aberto com qualquer editor de texto simples (exemplo: Notepad do Windows; recomendo o uso do Notepad++).

Está feito.

Como usar a cópia de segurança da template para desfazer um erro decorrente de se ter alterado a template do blog

1. Entrar no blog e clicar em Design
   
   
2. Clicar em Editar HTML
   
   
3. Escolher o ficheiro guardado no ponto anterior (clicar em Browse/Procurar, dependendo da língua usada) e clicar em Carregar.
   
    
4. Podem aparecer mensagens como a que se segue:
   
   Esta mensagem significa que o ficheiro que se está a carregar contém menos coisas do que a template em uso. Se a modificação que se fez na template foi acrescentar coisas, é normal que a versão anterior tenha menos coisas. Por isso, clicar em Eliminar Widgets. Caso contrário, ter a certeza de que o ficheiro que se está a carregar corresponde de facto à última versão da template que esteve online.
   Dica: em caso de dúvida, fazer a 1ª etapa (backup da template) para se guardar o que haja a guardar antes de carregar a template.
   
5. Depois de carregado o ficheiro, as alterações entram em funções imediatamente.
   

Nota: se se pretender ver as alterações da template antes de a carregar como se acabou de descrever, pode-se copiar o conteúdo da template e colá-lo na caixa seguinte (depois de se ter apagado o respectivo conteúdo):

De seguida, basta clicar em Pré-visualizar.

Este tutorial explica como formatar imagens nos posts escritos com o Windows Live Writer.

Nível de dificuldade: baixo

Comecei por detestar a abordagem da suite Live, especialmente do Live Messager, que tornava publica informação minha sem meu consentimento (sim, pode-se ir à configuração e mudar mas o default é abusivo). Mas o Live Writer é uma killer app e já escrevi alguns posts sobre a forma de o usar.

Já abordei a forma como se instala este software e alguns aspectos da sua utilização (sobre captura de imagens e sobre o ping para o Twingly e para o Wordpress). Agora debruço-me sobre a inclusão de fotos nos posts. Este aspecto é um pouco manhoso mas depois de umas configurações, é impec.

As imagens seguintes reflectem as configurações que uso regularmente para as imagens. Experimente defini-las (para isso, inserir uma imagem e depois clicar nela para activar os painéis de opções) e depois clicar no guardar como predefinições. Desta forma, a próxima imagem que inserir estará com as definições que deseja.

NOTA: estas imagens são copiadas do Windows Live Writer XP. A última versão (Windows Live Writer 2011) tem um aspecto diferente mas os conceitos são os mesmos. Basta um pouco de esforço para encontrar as mesmas coisas.

Imagem 1	- inline para o uso habitual no blog (por vezes coloco Esquerda para o texto contornar a image) - sem margens (fica o default do blog) - limites (border): gosto da imagem com uma linha à volta. o papel fotográfico tb é interessante especialmente quando o centro do post é a fotografia - hiperligação: na maior parte dos casos não quero nenhuma ligação. mas pode ter interesse ter a ligação para um URL (exemplo: recorte de uma notícia e link para a origem) ou então para a imagem de origem (neste caso ver a imagem 6)
Imagem 2	- tamanho médio (clicar no esquadro para definir o que é tamanho médio (ver a imagem 3) - incluir um texto descritivo da imagem (ajuda o google na pesquisa de imagens)
Imagem 3	- definir os valores dos tamanhos pré-definidos. - no Aventar, uma imagem não deve passar muito dos 550 pixéis de largura (se não passar por cima da barra lateral ou fica cortada).
Imagem 4	nada de especial a referir mas ver a lista de efeitos possíveis
Imagem 5	lista de possibilidades de hiperligações das imagens
Imagem 6	na maior parte dos casos, quero que, quando a imagem liga para a imagem de origem, seja apresentada a imagem no seu tamanho original. fazer esta pré-definição aqui.
Imagem 7	Depois de feitas as pré-definições, clicar no guardar como predefinições e assim a próxima imagem inserida terá de imediato estas características

UM TRUQUE
Por vezes quero inserir uma série de imagens iguais mas diferentes destas predefinições. Exemplo: incluir 10 imagens com tamanho 100x100 e a apontar para a imagem de origem mas redimensionada para um máximo de 800x600. Para poupar tempo, insiro a primeira imagem, formato-a assim e, tendo-a seleccionada clico no guardar como predefinições. Desta forma as próximas 9 imagens que inserir terão as mesmas características. Depois volto a colocar as predefinições genéricas a usar nas restantes postagens.

Fica aqui um link com informação detalhada sobre como instalar o Windows Live Writer. 

http://hitech-tips.blogspot.com/2010/02/bloggers-prestem-atencao-ao-windows.html

E aqui mostro como fazer capturas de ecrãs:

http://hitech-tips.blogspot.com/2010/02/faca-posts-de-forma-rapida-e-eficaz.html

Sobre este programa de captura de ecrãs (há muitos), é de realçar um aspecto muito prático e que é o facto do software poder gravar automaticamente em disco a imagem capturada. É especialmente se se estiverem a fazer várias capturas. Também permite copiar automaticamente para o clipboard a imagem capturada (muito útil também). No anterior link explico como se faz isso.

Boas postagens :)

Links para download do Windows Live Writer:

• Versão 2011 (aspecto como o Office 2011):
  http://explore.live.com/windows-live-writer?os=other
   
  
• Versão 2009 (aspecto como o Office XP):
  http://explore.live.com/windows-live-writer-xp
  

This tutorial shows how to add the "Share This" buttons to your blogger blog. At the end, you will have something like this:

tip level: intermediate

1. First of all, backup your template. See how: Template actions: download, backup, edit and restore. If anything goes wrong, this is your chance to go back.

2. Now, setup an AddThis account:

• Go to http://www.addthis.com
  
• Choose the sharing style:
  
  Personally, I prefer the first option, but without the "Share" button ( because it makes a popup window to appear). Bellow the instructions will show how to have this:
  
  
• Choose to have sharing analytics:
  
  
• Click to have the button code:
   
  
• Now you will need to register. Bellow I show my registration. Note at the username, it'll be used bellow.
  
  
• Now, copy the code:
  
  and paste it in some text editor (notepad it's ok).  We will return to this code later.
  

3. Having this done, it's time to modify your template.

• Make a copy of your template you downloaded in step one and let's modify it. You can use any text editor (such as notepad).
  
• Search for the text  </head> and open a new line above it.
  
• In order to choose the language in use, paste the following text:
  <script type='text/javascript'>
      var addthis_config = {
          ui_language: &quot;pt&quot;
      };
  </script>

Where it's written pt you can place the letters for your language. After this change, it should look like this:



• Now search in your template for this text:
  <data:post.body/>
  If you can't find it, search for
  data:post.body
  and then make sure it has a similar pattern to <data:post.body/>
  
• Open a blank line bellow this text and paste there the following code:

<script type='text/javascript'>   
var addthis_share = {
    url: &#39;data:post.url&#39;,
    title: &#39;data:post.title&#39;,
    templates: {
        twitter: &#39;RT @fliscorno {{title}} {{url}}&#39;
    }
};
</script>

<div class='sharepost'>
    <div class='addthis_toolbox addthis_default_style'>   
        <span class='addthis_separator'>Partilhar: </span>
        <a class='addthis_button_facebook' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_twitter' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_myspace' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_blogger' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_wordpress' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>   
        <a class='addthis_button_google' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_friendfeed' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_delicious' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_email' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_favorites' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>
        <a class='addthis_button_print' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'/>   
    </div>
</div>                                                   
<script type='text/javascript'>var addthis_config = {'data_track_clickback':true};</script>
<script type='text/javascript' src = 'http://s7.addthis.com/js/250/addthis_widget.js#username=hitechtips'> </script>

<br/>


IMPORTANT: replace the red text above by your own usernames:
- replace fliscorno with your twitter username
- replace hitechtips with the username you created at step 2. You can copy if from the text you pasted at the end of step 2.

Replace the text Partilhar with whatever you want to say (eg. Share)

At the end of this step, it should look as the following picture:

(click to enlarge)

Another tip about where to put this last piece of code: it must be in between <data:post.body/> and </b:includable> (see the picture).


• Save the template and upload it to your blog (see the link at step 1).
  
• Preview the blog and it's done. If the blog stop working, then restore the older template you have backed up at step 1.

Further steps:

• The AddThis button can have Facebook and Twitter counts. See the AddThis help for instructions. See also here.
  

Help, this doesn't work!

• Be sure that all the opening quotes (') have a corresponding closing quote
• Make sure the text you have paste is OK
• Make sure you pasted the text at the right places

Did you enjoy this tutorial? Make short post on your blog with a link to here :) I will appreciate it.

This tutorial describes how to perform a backup of your template, how to edit your template and how to restore your template.

tip level: beginner

Some times people find problems editing their template and then I figure out that the root for the problem is because they didn't select the "Expand Widget Templates" check box. So, if you are using the code directly from this check box, be sure to select it:

However, I would recommend that you edit your template another way.

1. Download the full template, by clicking the link "Download Full Template":

2. Choose to save the file and give it a meaningful filename:

Including the date in the filename it's a good idea for backup organization.

3. Keep this file unchanged and perform the edits in a copy of this file. This way, if something goes wrong you can go back by uploading the previous version of the template.

Use a text editor to perform your changes in the .xml file. You can use a basic editor such as Windows Notepad but consider to use an editor that colorize the code. Notepad++ is a good choice and it's free. Links:

- Notepad++ page: http://notepad-plus.sourceforge.net

- Download page; click at the "Download Now!" button:

4. Perform your edits in the template, save the file and upload the new template. The template will be immediately changed and in use.

If you want to preview the changes before applying them, copy the edited template text and replace the text of the text box with it. Then press "Preview":

If it is ok, press "Save Template".

This preview method doesn't always work, particularly if the changes involve JavaScript. The best approach is to create a test blog and performing the template tests there.

5. If your changes become problematic, just upload the original template that you saved at points 1/2.

That's it. Enjoy.

While searching for a solution that would let me add the "Like" button plus the ability to leave a comment on the "Liked" item (see picture on the left), I finally found the solution that I share bellow. Just follow exactly the next instructions and that's it.

This post contains some guidelines to improve the security level of your Blogger blog and some tips to recover control

Two reasons may have driven you to this page:

1. you are in trouble and I hope you can find some help here;
2. you came by chance and you had better check the following tips.

Believe me, security problems are real even if they haven't yet hit you. Here are some tips and guidelines you should follow.

Facebook just lunched the "Like" button to be used in any page. To have it in your Blogger blog, do the following steps:

1. First, do a backup of your blogger template (see it here: Template actions: download, backup, edit and restore) .
   
2. Then edit your template and find the following text in the XML code:
   <data:post.body/>
   Tip: if you can't find it, try to search data:post.body until there is something similar and that ends with />
   
   
3. Place the following code after that line:
   

   <iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;layout=standard&amp;show-faces=true&amp;width=530&amp;height=60&amp;action=like&amp;colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:530px; height:60px'/>

   
   
   
   
   Result:
   
   
   Changing the Like' button to 'Recommend'
   If you prefer that your button says "Recommend" instead of "Like", it is just necessary to change the code of point 3: just change the action=like to say action=recommend. The following code does that:
   
   
   
   

   <iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;layout=standard&amp;show-faces=true&amp;width=530&amp;height=60&amp;action=recommend&amp;colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:530px; height:60px'/>
   

   
   
   
   
   Result:
   
   


4. Save the template and that's it.

Neste post mostra-se como fazer cópia de segurança dos posts do blog. Pode exportar o seu blogue para o formato de exportação Blogger Atom. Pode fazê-lo para mover o seu blogue para outro serviço de blogues ou apenas para o armazenar no disco rígido. O seu blogue não será alterado, continuando online como antes.

1. Entre no blog em www.blogger.com
2. Clique em Definições e depois em Básico
3. Clique em Exportar blogue
4. 
   
   
   Clique em TRANSFERIR BLOGUE e depois, na janela de diálogo, seleccione Guardar para ficheiro (Save to file), clique em OK e escolha o nome do ficheiro onde ficará guardado o blogue.

Fácil, não é? Desta forma, se perder o acesso ao blogue, não perde os conteúdos.

Note que são guardados os posts, os comentários e as etiquetas dos posts.

Tendo o blog guardado, pode criar um novo blog e para ele transferir os posts, comentários e etiquetas que antes tinha guardado. Para isso clique em Importar blogue e siga as instruções.

Leitura adicional: How do I import and export blogs on Blogger?

Entre em http://draft.blogger.com e navegue até Editar páginas como se vê na imagem supra.
O que são páginas autónomas?
http://www.google.com/support/blogger/bin/answer.py?answer=165955
Com mais tempo, voltarei ao tema.

NOTA: a página About é um exemplo destas páginas autónomas. Note-se que o URL é diferente do habitual.

Antes de fazer qualquer alteração à template do blog, fazer sempre uma cópia de segurança primeiro. Assim, caso algo corra mal, pode-se sempre voltar a trás. As imagens seguintes mostram os sucessivos passos.

1. Cópia de segurança

Depois de entrar no blog, clicar em Esquema.

Clicar em Editar HTML

Clicar em Transferir modelo completo e gravar o ficheiro.

Está feito! Simples, não é? Pois pouca imenso trabalho quando algo corre mal. Sugestões:

a) guardar as sucessivas cópias de segurança da template, o que permite comparar duas versões;

b) nomear os ficheiros com a data de criação e incluindo-a no início do nome do ficheiro - assim os ficheiros estarão sempre ordenados temporalmente, mesmo que sejam alterados posteriormente. Exemplo: 2009-10-06_a_minha_template.xls

2. Para colocar em uso uma template antiga

Na mesma página onde se fez a cópia de segurança da template, clicar

em browse, escolher uma template antiga, e depois clicar em Carregar.

A nova template será colocada em uso logo de seguida.

No Usuário Compulsivo:

Que tal deixar a sua caixa de comentários incorporada as páginas de postagem do Blogger / Blogspot melhor integrada ao seu template?

Neste tutorial você vai aprender como colocar bordas na mensagem que aparece antes do formulário de comentários. Como deixar a área do formulário de comentários mais larga, igual a largura da coluna das postagens, e como otimizar o cabeçalho da área de comentários. (...)

Há tempos, o email de suporte a este blog foi tomado de assalto. Não sei a origem deste ataque mas sei que o email foi usado para enviar um mail de spam a todos os contactos os meus contactos. Ainda para mais, esse mail foi enviado sem BCC, tornando públicos todos esses contactos. Apesar de ser alheio a este abuso, quero deixar na mesma aqui as minhas desculpas pelo incómodo.

Creio que terá sido alguma falha de segurança no Gmail terá sido explorada. Uma vez que não me mexeram no blog, suponho que terá sido "apenas" para mandar spam. Mudaram-me a password e neste momento não tenho acesso a esse email. Só não fiquei também sem acesso ao blog porque, apesar de eu ser o único editor do blog, tinha dois emails associados ao blog, cada qual com permissões de administração.

Deixo aqui aos companheiros de blogosfera um conselho que considero valer ouro: ter mais do que um utilizador do blog com privilégios de administração (podem pertencer à mesma pessoa mas com com diferentes emails).  Apresento a seguir instruções para o Blogger:

1. entrar no blog e ir à página de administração do blog (http://www.blogger.com/home)
2. clicar em  Definições
3. clicar em Permissões
4. clicar em Adicionar Autores
5. na caixa "Convide mais pessoas para escreverem no seu blogue", inserir um email seu, diferente daquele que estiver actualmente associado ao blog
6. clicar em Convidar
7. entrar no email definido no ponto 5 e abrir o mail enviado pelo Blogger
8. clicar no link que o mail refere e seguir até ao fim as instruções que o Blogger dará
9. voltar a entrar no blog mas com o utilizador do ponto 1
10. repetir os passos 1 a 3 para chegar à página das permissões
11. clicar "conceder privilégios de administrador" na linha correspondente ao email inserido em 5

A partir deste momento passará a haver dois emails a partir dos quais é possível administrar o blog. Se se perder o acesso a um dos emails, pode entrar no blog com o outro email. Como ambos são administradores do blog, na página das permissões do blog pode remover o acesso a um dos emails.

Boas blogagens.