Articles by "Blogspot"
Mostrar mensagens com a etiqueta Blogspot. Mostrar todas as mensagens

- 12/04/2009 06:28:00 p.m. 0



Este serviço independente do Blogger. – Destina-se em exclusivo aos blog's que utilizam a plataforma Blogger, ou seja, funciona apenas no "blogspot".

O site Quem me ama? está em Português, assim você só precisa digitar a URL do blog e dar clique em "Pesquisar!", o sistema retorna as informações para nós imediatamente, e pode ver a entrada de resultados por entrada.
Claro que isto não nos protege daqueles que nos querem copiar, mas pelo menos assim você sabe que se não descobrir de imediato a “cópia”... Pode sempre fazer com que alguém pense duas vezes antes de fazê-lo.
Surpreenda-se.



Read More »

- 4/30/2009 09:33:00 p.m. 1
Scroll to Top Blogger O Script de jQuery é de fácil instalação e proporciona o rolamento vertical para a parte superior da página.
Se você estiver no início da página o botão é invisível, mas este fará fade-in, assim que o usuário inicia a rolagem da página.
Ao clicar no link este retorna o rolamento ao topo, e em fade-out desaparece gradualmente.

Faça o download do scroll-to-top Zip no site do projecto e guarde no seu computador, depois hospede os scripts no seu site de hospedagem preferido.

Essencial – Antes de fazer qualquer alteração é melhor fazer um backup do seu modelo actual. Baixe e salve o seu tema, assim você pode voltar atrás se algo errado ocorrer. – Guarde o backup do seu template pois pode sempre em qualquer altura reverter para o seu anterior modelo. - Para faze-lo entre na guia "Layout" em "Editar HTML" e salve uma cópia do seu template original clicando em "Baixar Modelo Completo".


Vamos então começar.

1º - Deixe a opção "Expandir Modelo de Widgets" desmarcada.

2º - Para incluir os scripts na sua página, procure pela tag </head> e coloque antes desta o seguinte código:
<script src="http://endereço-do-seu-arquivo/jquery-1.3.2.min.js" type="text/javascript"></script>

 

<script src="http://endereço-do-seu-arquivo/jquery.scroll.pack.js" type="text/javascript"></script>

 

<script type='text/javascript'>
$(function() {
$("#toTop").scrollToTop();
});
</script>

 

    </head>


3º - Adicione o seguinte código CSS no seu código CSS do Blogger, para a posição e estilo.
/* to top */

 

#toTop { width:100px;background:#F4FFBF;border:1px solid #ccc;text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#666;text-decoration:none; }


4º - Localize o final do seu código – as tags – </body> </html> e antes do fecho da tag </body> coloque o seguinte código:
<a href="#" id="toTop">^ Scroll to Top</a>

 

    </body>
</html>


Visualize, salve e estará instalado.

Você pode ver a acção nesta página. Bons ScrollS ...

Read More »

- 4/12/2009 12:49:00 a.m. 2
Código simples que divide em duas colunas o seu post ou a sua sidebar, sem mexer no HTML do template. Fácil e prático. Para as postagens, é só inserir o código na janela e escrever no local indicado. Para a sidebar, inserir o código num "Elemento de Página" – "HTML/Java".

Para dividir em 2 colunas:

<div style="float: left; WIDTH: 45%">Texto da Coluna da Esquerda </div>
<div style="float: right; WIDTH: 45%">Texto da Coluna da Direita </div>
<divstyle="clear: both"></div>
Exemplo:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam egestas lectus eu mauris. Aenean lobortis iaculis nisl. Nullam ac erat pretium nibh elementum ullamcorper. Sed sed libero eu sem scelerisque congue. Nunc orci enim, posuere scelerisque, tincidunt ac, viverra id, velit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam metus ante, porttitor aliquam, interdum eu, pulvinar vitae, ante. Curabitur luctus nisi sit amet orci.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam egestas lectus eu mauris. Aenean lobortis iaculis nisl. Nullam ac erat pretium nibh elementum ullamcorper. Sed sed libero eu sem scelerisque congue. Nunc orci enim, posuere scelerisque, tincidunt ac, viverra id, velit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam metus ante, porttitor aliquam, interdum eu, pulvinar vitae, ante. Curabitur luctus nisi sit amet orci.















Pode tambem fazer a divisão em 3 colunas:
<div style="float: left; WIDTH: 30%"> Texto da Coluna da Esquerda </div>
<div style="float: center; WIDTH: 30%"> Texto da Coluna Central </div>
<div style="float: right; WIDTH: 30%" > Texto da Coluna da Direita </div>
<divstyle="clear:both"> </div>

Note o valor percentual verde " 30% ". Essa é a largura da coluna. A soma das porcentagens nunca deve ultrapassar 90%.
Fonte de origem.
Read More »

- 3/03/2009 09:27:00 p.m. 1





Para reduzir substancialmente o tempo de carregamento das paginas no Blogger/blogspot . Como por padrão o Blogger adiciona o CSS , código responsável pela formatação e apresentação do seu blog, dentro dos posts. A folha de estilos (CSS), cujo código ocupa várias linhas é adicionada em todas as páginas ao seu blogue.
Da informação por mim apreendida a melhor solução será guardar esse arquivo separadamente.

Assim, em vez de carregar o mesmo código de cada vez que carrega uma página, os web browser dos leitores carregarão seu estilo apenas uma vez e abrirão as páginas mais rápido.
Antes de fazer qualquer alteração é melhor fazer um backup do seu modelo actual. Baixe e salve seu tema, assim você pode voltar atrás se algo errado ocorrer. – Guarde o backup do seu template pois pode sempre em qualquer altura reverter para o seu anterior modelo.
Atenção: Depois de completados os passos, a página "Fontes e cores" do Blogger será desabilitada e você não poderá mais utilizá-la para editar seu template. Por isso, faça todas alterações necessárias antes de mexer no código.

1. Você precisa de um servidor de hospedagem para seu arquivo CSS. Eu recomendo o Google Pages.

2. Após concluída a questão da hospedagem, é hora de retirar o código do seu template. Entre em qualquer página de seu blog e use a opção "Visualizar - código-fonte" de seu navegador.
Copie tudo o que estiver entre:
<style id=’page-skin-1’type=’text/css’ >
e
</style >

Entre em CSS Optimizer e cole ai o seu código. – Clique em “Process CSS”.
Copie esse resultado para o seu Bloco de Notas e escolha a opção “ Arquivo – Salvar como”. Indique em “salvar como tipo, – todos os arquivos” e no campo “nome do arquivo”, digite nome_arquivo.css.

3. Envie o arquivo para o Goggle Pages.

4. Depois de enviado, na sua lista de arquivos clique com o botão direito sobre nome_arquivo.css, e em “copiar atalho” copie o link.

5. Agora abra a página inicial do Blogger e clique no link de administrar "Layout" abaixo do nome de seu blog.

6. Procure no seu código a tag <b:skin > e apague tudo que estiver entre ela e </b:skin > e, acima de <b:skin >, coloque o código:

<link rel="stylesheet" href="LINK" type="text/css" media="screen,projection" />

Não esqueça de substituir "LINK" pelo enderço link do seu CSS no Goggle Pages.

7. Salve seu template. Agora a sua folha de estilos em cascata está num arquivo CSS externo.

Via: Lundquist
Read More »

- 10/15/2008 03:29:00 p.m. 4

Com este código irá permitir aos seus visitantes, imprimir os artigos individuais do seu blogue. - Claro que é sempre possível a um leitor escolher a opção "impressão", a partir da sua janela do navegador, mas isso fará a impressão do cabeçalho, barras laterais e outras secções irrelevantes do blogue, desperdiçando tempo papel e tinta.
Mas utilizando esta combinação de CSS e JavaScript simples mas eficaz poderá apenas imprimir a postagem e os comentários de cada página do blog.


Vou explicar como fazê-lo embora o seu original deva ser atribuído a Amanda in blogger Buster.

Existem apenas duas etapas para adicionar esta funcionalidade ao seu próprio modelo do Blogger:

1. Adicione algumas linhas de código CSS para que as páginas impressas apareçam da forma desejada.
2. Adicione uma linha de JavaScript abaixo dos seus posts (que cria uma ligação para os leitores imprimirem a postagem).

Adicionando o CSS:

No painel de controlo do blogger click em ESQUEMA/LAYOUT > EDITAR HTML, após o carregamento da página localize no seu template o encerramento da tag: </head>.

Logo antes desta linha, adicione as seguintes linhas de código (copiar e colar directamente para o seu modelo do Blogger):

<style media='print' type='text/css'>#header-wrapper, #header, .header, #sidebar-wrapper, .sidebar, #footer-wrapper, #footer, .date-header, .post-meta-data, .comment-link, .comment-footer, #blog-pager, #backlinks-container, #navbar-section, .subscribe_notice, .noprint {display: none;}#main-wrapper {width: 95%}</style>

Salve o seu modelo.

Adicionando o Link Print this Post:

Para notificar os seus leitores de que suas postagens podem ser impressas de forma eficaz, adicione um link "Imprimir" abaixo cada uma de suas postagens do Blogger.

Para adicionar o link "Imprimir" vá para a secção "Editar HTML" novamente, e desta vez marque na caixa correspondente a opção "EXPANDIR MODELOS DE WIDGETS" .

Agora procure esta linha de código:

<p > <data:post.body/> </ p>

Imediatamente após essa linha, cole o seguinte código:

<b:if cond='data:blog.pageType == "item"'><span style='background: url(http://bloggerbuster.com/images/print.gif) left no-repeat; padding-left: 20px;'> <a href='javascript:window.print()'>Print this post</a></span></b:if>

Salve o seu modelo.

Esse link só será visível nas páginas de postagem (para permitir aos visitantes imprimir o post completo e todos os comentários que aparecem abaixo da postagem).

Se tudo correu bem deverá ver nas páginas individuais do blogue o link, Print this post.

Obs. Os comentários podem acrescentar muita coisa de valor dos post, e podem conter informações para o leitor que não estão incluídas no corpo do próprio post.

Read More »

- 10/08/2008 12:39:00 a.m. 0
O favicon é um ficheiro no formato ICO (*.ico) de tamanho 16x16 px , significando Ícone de Favoritos, e que aparece ao lado do endereço de um site ou blog na barra de navegação .
Alguns browsers como o Internet Explorer até à versão 6, só exibem os favicons quando o site é adicionado aos favoritos. - Neste caso, apenas no menu correspondente aos favoritos se pode encontrar a imagem.
Noutros browsers como o Firefox, Opera e Internet Explores 7, os favicons podem ser encontrados também nos separadores e na barra de endereço.


O modo tradicional de personalizar esse ícone é criar um, com o tamanho de 16x16 ou 32x32 px e salva-lo com o nome de favicon. ico na raiz do seu domínio.

Alternativa é usar os serviços do Favicon from Pics ou Favicon.CC, nestas páginas você pode enviar uma foto e esta será transformada num ícone, assim, basta baixar e transferir para o seu site.

Se você não puder gravar o favicon na raiz do seu site, pode gravar-lo num outro diretório e indicar na página que quer personalizar, qual é o ícone a ser utilizado usando as seguintes tags no seu template:

Entre no painel de configuração do seu blog e escolha "Layout" - "Editar HTML". Logo abaixo de <head >, digite:

<link rel="shortcut icon" href="http://jametinhastell.blogspot/favicon.ico" type="image/x-icon"/ ><link rel="icon" href="http://jametinhastell.blogspot/favicon.ico"  type="image/x-icon"/ >

Obs: Substitua o endereço a “vermelho” pela url e diretório do seu site ou blog.

- Salve o template.

Apesar de apenas a segunda tag, ser suficiente para a maioria dos browsers actuais é recomendável utilizar também a primeira para garantir compatibilidade com browsers antigos e que não acompanham os padrões adequadamente.

Assim os seus visitantes podem identificar o seu site ou blog com mais facilidade.

Read More »
Subscrever: Mensagens (Atom)