DinheiroPT » Thesis

Ícones Sociais Flutuantes sem Plugin no Thesis Theme

João — Mon, 06 Feb 2012 13:25:18 +0000

Tenho recebido imensas solicitações relacionadas com a adaptação do Thesis Theme para a partilha social. Os ícones sociais são o tema principal sendo por diversas vezes solicitada uma solução de ícones sociais flutuantes para partilha de conteúdo no Twitter, Facebook, Linkdin ou outras redes sociais diversas.

A forma mais fácil de proporcionar uma solução válida para a integração do Thesis Theme com as redes sociais implementando uma barra flutuante junto dos artigos para facilitar a partilha do conteúdo pelos utilizadores é utilizar plugins para o efeito.

Dos diversos plugins existentes no diretório do WordPress, dois deles forma experimentados por mim e aconselho a sua utilização, nomeadamente, o plugin wordpress Sharebar e o plugin wordpress Scrolling Social Sharebar.

Ambos os plugins são válidos e fiáveis no entanto possuem as fragilidades de qualquer plugin, principalmente se estes não forem atualizados quer pelo utilizador quer pelo editor.

Uma boa forma de ultrapassar essa limitação de diminuir os riscos é exactamente instalar um solução de icones sociais flutuantes no blog sem plugin.

Quem utiliza o Thesis Theme como tema wordpress para suporte dos seus blogs tem assim a tarefa facilitada porque a integração é extremamente simples, no entanto, quem utiliza qualquer outro tema wordpress pode igualmente com algumas pequenas adaptações possuir os ícones sociais flutuantes nos seus blogs.

COMO INSTALAR OS ICONES SOCIAIS FLUTUANTES NO THESIS THEME SEM PLUGIN

O primeiro passo a efetuar é aceder aos sites das redes sociais que pretende integrar no Thesis Theme. Se porventura é o Facebook, twitter, linkedin então está no local certo.

Aqui estão os links onde pode ir buscar o código dos ícones sociais;

Assim que personalizar cada ícone social necessita de os integrar com a linha de código que se segue. Podem utilizar o Notepad ++ para facilitar a integração dos ícones sociais na linha de código.

A linha de código é a seguinte:

/*BARRA FLUTUANTE SOCIAL*/
function Sidebar_social_icons() {
if (is_single()) { ?>


FACEBOOK ICONE SOCIAL


TWITTER ICONE SOCIAL


LINKDIN ICONE SOCIAL


SHARE ICONE SOCIAL



Assim que a linha de código estiver completa deve ter a seguinte apresentação:
/*BARRA FLUTUANTE SOCIAL*/
function Sidebar_social_icons() {
if (is_single()) { ?>














Com o código completo deve copiar toda a linha de código e colar em custom_functions.php no painel de administração do Thesis Theme em custom file editor.
Para finalizar só falta integrar o código css em custom.css no painel de administração do Thesis Theme em custom file editor.
A linha de código de css, por incrível que pareça é extramente simples, no entanto, pode ser parametrizada consoante desejar adicionando outras linhas de código.
A linha de código em css é a seguinte:
#Sidebar {background:#f2f2f2; border: 1px solid #C6D9E9; bottom: 50px; left: 100px; padding: 2px; position: fixed; }
#Sidebar .float { padding:5px; }
Está tudo pronto e se seguiu todos os passos deve ter uma barra de ícones sociais flutuantes semelhante á que visualiza neste site de um parceiro que escreve sobre finanças pessoais e bancos que me solicitou os icones sociais flutuantes.
Até já…

Botões Sociais no Thesis Theme sem Plugin

João — Wed, 22 Jun 2011 21:36:25 +0000

O wordpress possui funcionalidades extraordinárias e permite que sem qualquer conhecimento de código, os seus utilizadores possam efetuar alterações incríveis.

Os plugins wordpress permitem esta dinâmica, mas também criam alguns constrangimentos aos seus utilizadores, como por exemplo, tornar o carregamento de páginas mais lento e prejudicar o SEO, abrir janelas para ataques quando não atualizados com regularidade, entre outros.

Todavia, muitos dos plugins existentes no mercado são possíveis de evitar a sua instalação, permitindo que o utilizador do wordpress beneficie das mesmas funcionalidades sem prejudicar o seu blog.

Assim sendo, vamos ver como pode instalar no seu blog Thesis Theme os botões sociais de partilha sem necessitar de instalar qualquer plugin.

RESULTADO FINAL

ONDE ENCONTRAR OS BOTÕES SOCIAIS

Antes de começar terá que encontrar os botões sociais para criar a estrutura de código necessária para o Thesis Theme.

Novo botão Tweet

O novo botão do twitter pode ser encontrado no twitter e deverá ser personalizado de acordo com as suas preferência, conforme imagem.

Botão Facebook Share

Os códigos para colocar o botão Facebook share que desejar.

Botão Facebook Share Grande

Botão Facebook Share Compacto

Botão Google +1

Este botão necessita de alguns passos da sua parte. Para isso sugiro que personalize o seu botão no site da Google, conforme imagem:
Seguidamente, necessita de colocar o código na secção do Thesis Theme. Esta é uma das ferramentas fantásticas do Thesis pois permite que coloquem os códigos que necessitem sem alterar os códigos originais.

Assim sendo, deverá ir a Painel do WordPress / Thesis / Site Options e procurar por “Additional Scripts” e cole o código. A imagem exemplifica o processo.

1º PASSO – ALTERAR CÓDIGO DA FUNÇÃO PARA THESIS

O código seguinte é a função que irá colocar na pasta custom_fuctions.php em Thesis Theme /custom file editor. Deverá colocar os códigos do botão entre os .

Código exemplificativo:

/*PARTILHA*/
function social_icons(){
  if(is_single()){
?>
	
		Partilhar é Ajudar!
            
		 Botão do Twitter
            
            
		 Botão do Facebook
            
            
		Botão do Google +1
            
         
	 
	
Exemplo Código Final:
/*PARTILHA*/
function social_icons(){
  if(is_single()){
?>
	
		Partilhar é Ajudar!
            
		 Tweet
            
            
		 Share

            
            
		
            
         
	 
	
2º PASSO – COLAR CÓDIGO NO CUSTOM.CSS DO THESIS
Antes de iniciarmos a nossa função e para não correr o risco de um leitor consultar o blog enquanto instala o código dos botões, deverá criar a estrutura css para que quando inserir a função os botões estejam minimamente organizados.
Em custom.css "painel wordpress / Thesis Theme / custom file editor", cole o seguinte código que apresenta uma personalização igual ao nosso exemplo final, no entanto é perfeitamente personalizável.
/*PARTILHA*/
.social { border: dashed #ddd; border-width:1px 0 1px 0; margin: 0px auto 10px; display:block; padding: 3px 0 1px 0px;  overflow: hidden; }
	.social .social_button {float: left; display: inline; overflow: hidden; height:70px; }
	.social .social_button.tm { margin: 0px 0 0 20px;  padding-top: 4px;}
	.social .social_button.fb { margin: 0 0 0 20px;  padding-top:4px;}
	.social .social_button.su { margin: 0px 0 0 20px;  padding-top: 4px;}
        .social .social_button a img { border: 0; padding: 0; }
	.social strong { font-size: 11px; float: left; margin:2px 0 0 0; color:#555;}

.clear{clear:both;}
3º PASSO – CHAMAR OS BOTÕES ATRAVÉS DO CUSTOM_FUNCTIONS.PHP
Como este procedimento tudo já se encontra concluído, basta que copie o código da função com os seus botões e instalar no custom_functions.php, em "painel wordpress / thesis / custom file editor".
O código é semelhante a este:
/*PARTILHA*/
function social_icons(){
  if(is_single()){
?>
	
		Partilhar é Ajudar!
            
		 Tweet
            
            
		 Share

            
            
		
            
         
	 
	
Até já… E já agora porque não partilhar?

Thesis 1.8 – Um tema WordPress de perder o Fólego (Vídeo)

João — Thu, 02 Sep 2010 22:53:45 +0000

A cada nova versão do Thesis theme vão aparecendo novidades que melhoram o SEO e a gestão do tema.

Com apenas um clique consegue alterar diversos campos do seu layout e possuir um tema original e completamente personalizável.

Na anterior versão do Thesis Theme verificamos que o SEO ou a optimização para motores de busca foi o factor chave, permitindo imensas opções de optimização que nenhum outro plugin wordpress permite efectuar.

Thesis 1.8 vem melhorar alguns desses itens e tornar o tema ainda mais “Faça Você Mesmo” ou não seria o nome DIY “Do it Yourself”.

O que há de novo?

IMAGEM NO CABEÇALHO E FAVICON COM UM CLIQUE

Nas anteriores versões possuir um favicon ou uma imagem no cabeçalho era igual a colocar umas linhas de código no arquivo custom.css ou custom_function.php.

Agora é só efectuar o upload é já esta.

NOVOS ESTILOS DE LETRA DA GOOGLE

A Google libertou uma lista de estilos de letra e Thesis 1.8 simplesmente adoptou toda a lista. Assim poderá usufruir de todo o poder dos estilos de letra da Google.

NOVA BARRA DE NAVEGAÇÃO

Você escolhe como quer ter a sua barra de navegação e qual pretende possuir, à barra de navegação do wordpress ou do Thesis Theme, tudo isto à distância de um clique.

MAIS SEO

SEO, SEO, SEO, mais alguns melhoramentos a nível de optimização para motores de busca sem qualquer trabalho para sí.

E POR AI ADIANTE…

São imensas as novas opções do Thesis 1.8 e sabe-se que apenas falta 2 versões para o famoso Thesis 2.0 que está para chegar.

Segundo a DIY Theme a versão de Thesis 2.0 sairá com um aumento considerável para todos os que não possuírem a versão de Developer…

Assim, actualize a sua versão do Thesis ou se ainda não tem Thesis Theme do que está à ESPERA…

Compre Thesis Theme

VÍDEO

Como Colocar Anúncios Adsense nos Posts do Thesis Theme

João — Mon, 05 Jul 2010 22:42:10 +0000

Colocar anúncios Adsense nos artigos de um blog wordpress é uma tarefa relativamente simples e a generalidade dos bloggers sabe como fazê-lo de forma fácil através do editor wordpress.

Todavia, colocar anúncios Adsense no Thesis Theme não obedece aos mesmos procedimentos porque o Thesis Theme possui um código muito próprio.

O Thesis Theme é fantástico em termos de SEO e bastante flexível na personalização permitindo criar layouts originais sem precisar de comprar temas atrás de temas. Se possui um ou vários sites só necessita de um tema para todos eles.

Se não acredita que é possível então veja estes 100 Thesis Theme blogs e se ainda não tem o Thesis aqui tem a melhor oportunidade para o comprar já ou ver Porquê que Thesis é o Melhor Tema WordPress.

COLOCAR ANUNCIOS ADSENSE NOS POSTS

Colocar anúncios Adsense no Thesis Theme pode ser feito de duas formas, sendo a primeira utilizando o Plugin Thesis OpenHook e a segunda editando o ficheiro custom_functions.php.

Para poder continuar a efectuar este tutorial necessita do código Adsense dos seus anúncios que já deverá ter criado na sua conta Google Adsense.

1ª OPÇÃO

Plugin Thesis OpenHook

No seu Painel de Administração WordPress em Apresentação/Thesis Openhook procure pelo campo thesis_hook_before_post e cole o seu código lá.

Para ajudar verifique este vídeo.

2ª OPÇÃO

Está opção resume-se à introdução do código que irá chamar os anúncios Adsense para o artigo. Assim sendo, deverá ir ao Painel do Thesis e seleccionar custom file editor e escolher o ficheiro custom_functions.php e cole o seguinte código;

function before_post_ads() {
    if (is_single()) { ?>

    (COLOQUE O SEU CÓDIGO ADSENSE AQUI)

    
Até já…

Botão “Gosto” do Facebook no Thesis Theme

João — Fri, 18 Jun 2010 21:28:37 +0000

Recentemente encontrei um artigo excepcional que permite criar um campo onde seria possível colocar o botão “Gosto” do Facebook no Thesis Theme.

Provavelmente estarão a pensar porque razão deverão colocar um botão do Facebook nos vossos blogs ou até porque deverão se preocupar com o Facebook.

Poderia escrever aqui uma série de artigos sobre o assunto, mas como sabem, não gosto de dizer o que todos dizem, logo, facilito-vos a vida e forneço quatro artigos exemplificativos que podem encontrar em dois excelentes blogs sobre o assunto.

BLOG DO CUSTÓDIO

BLOG DO PAULO FAUSTINO

Convencidos?… Agora temos que pensar em adicionar o botão “Gosto” do Facebook em vossos blogs.

Como é óbvio existe um plugin wordpress que faz esse trabalho, mas para os utilizadores do Thesis Theme, é possível fazer muito mais e, como já estão habituados, diferente de todos os outros.

ATENÇÃO: As linhas de código que vamos fornecer são para todos os que possuem o Thesis Theme, logo se não o possui, pense em comprar já, pois não sabe o que está a perder.

Curioso?… Consulte estes artigos que vai ficar ainda mais…

COMPREM THESIS – Satisfação Garantida

COMO SEMPRE

Como todos já sabem, personalizar o tema Thesis resume-se à edição de dois ficheiros [ custom_functions.php / custom.css].

É nestes ficheiros que vamos colar as linhas de código que se seguem, no entanto, hoje não vamos utilizar o custom_functions.php, vamos sim efectuar a instalação do botão “Gosto” do Facebook no Thesis Theme utilizando o Plugin OpenHook para Thesis, que podem efectuar já o download do plugin aqui, ou obter mais informação sobre como utilizar Plugin OpenHook no Thesis.

1º PASSO

Em custom.css colem o seguinte código:

/* Facebbook like*/
.custom #fb {
  padding:5px;
  border: dashed #ddd;
  border-width:1px 0 1px 0;
}
.custom #fb iframe { height: 25px; margin:2px 0 0 5px;}

2º PASSO

Agora no Painel de Administração do WordPress em Apresentação/Thesis OpenHook, procurem por Thesis_hook_after_post ou de desejarem Thesis_hook_before_post e colem o seguinte código:



ID)); ?>&layout=standard&show_faces=false&width=450&action=like&font=verdana&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:px">

Seleccionem o campo “exectuar Php on this hook” e façam guardar.

FIM

Como podem verificar é extremamente simples e agora podem personalizar o código css como pretenderem. Podem por exemplo, colocar um background com uma imagem, ou centrar o botão, ou ainda utilizar o código php para adicionar outros botão, como por exemplo, Twitter.

Até já… E já agora digam se gostam deste artigo já a seguir.!!

Crédito foto

Como Criei um Post Footer no Thesis Theme. – Tutorial

João — Sat, 29 May 2010 22:58:29 +0000

A todos os leitores e visitantes do DinheiroPT, provavelmente já repararão que recentemente foi criado, logo após o conteúdo do post uma área onde identifica o Autor do artigo, outra apresenta os artigos relacionados e ainda outra que permite opções de subscrição do blog e uma área para publicidade.

Não vale a pena informar os Leitores que se ainda não possuem o fantástico Thesis Theme então este artigo não é para os vossos blogs, mas, ainda está a tempo de começar a usufruir deste fantástico Tema WordPress, começando já por ler este artigo “Porquê Thesis Theme é o melhor Tema WordPress”.

Vamos então ao que interessa. O primeiro passo a efectuar é actualização dos vossos dados pessoais no Painel de Administração do WordPress em Utilizadores/ Autores.

Agora estão aptos para por a funcionar este fantástico Post Footer e podem usar todas as imagens que possui, mas antes de seguir em frente aqui vai um foto do que pode ter ainda hoje no vosso blog.

1º PASSO

Painel de Administração do Thesis e em custom.css colem o seguinte código

/* AUTHOR BOX */
.custom #comments { clear: both; }
.postauthor { background: #DDF5E9; border-top: 1px solid #e1e1e0; border-bottom: 1px solid #e1e1e0; overflow: hidden; padding: 1.5em; }
.postauthor img { border: 5px solid #e2dede; float: left; margin-right: 1.5em; }
.postauthor h4 { color: #666; font-size: 1.7em; margin-bottom: 5px; }
.postauthor p { color: #515151; font-size: 13px; margin-bottom: 12px; }
.postauthor p.hlight { font-size: 11px; text-transform: uppercase; }
.postauthor p.hlight span { color: #CB3131; font-size: 13px; font-style: italic; font-weight: bold; letter-spacing: 0.8px; }
/* BOXES */
#similar h3, #rightcol h3 { font-size: 1.8em; letter-spacing: normal; padding-top: 15px; }
#similar { float: left; width: 50%; padding: 0 32px; background:#FFFFFF url('http://www.dinheiropt.com/wp-content/uploads/2010/05/related.jpg') no-repeat scroll 0 0; border-right: 3px solid #FFFFE0;}
#similar p { margin-bottom: 0px; padding: 8px 2.5em 10px 10px; margin-top: 50px; }
#similar a { font-size: 1.4em; line-height: 1.5em; text-decoration: underline; }
#similar a:hover { border: 0; text-decoration: none; }
#similar h3 { padding-left: 5px; }
#similar span.date { color: #888; letter-spacing: 1px; text-transform: uppercase; }
#rightcol { float: right; width: 40%; background:#FFFFFF url('http://www.dinheiropt.com/wp-content/uploads/2010/05/subscrive.jpg') no-repeat scroll 0 0;  }
#rightcol p { font-size: 14px; line-height: 1.5em; padding: 10px 2.5em 10px 0;  }
#rightcol h3 { padding: 0; }
#rightcol ul {  list-style-position: inside; list-style-position: none; margin-left: 1em; }
#rightcol ul a { font-size: 14px; }
#rightcol ul a:hover { border: 0;  }
#rightcol li { margin-bottom: 10px; }
#subscribe {  float: right; padding: 19px 10px; margin: 40px 15px 0 15px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#custom {  float: right; margin: 40px 0 0 0; padding: 19px 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

Como podem verificar o código é exactamente o que possuo no meu blog o qual podem editar conforme pretenderem e adaptarem ao layout do vosso blog.

2º PASSO

Painel de Administração do Thesis e em custom_functions.php colem os eguinte código.

function post_footer() {
	if (is_single())
	{
	?>
	
		
		Artigo por 
		 
		
		 já escreveu  fantásticos artigos para o DinheiroPT.
	

	
		
		
	

	
		
			
			Só gostou deste artigo irá definitivamente adorar os que virão. Subscreva o feed e mantenha-se actualizado.
			
				Subscrever RSS Feed
				Subscrever RSS Email 
			
		

		
			Thesis Theme">Thesis Theme"/>
		
	
	
De igual modo devem actualizar tudo o que pretenderem por forma a adaptarem aos vossos blogs.
Até já…

100 Thesis Theme Blogs que Não Vai Acreditar que são Thesis

João — Mon, 24 May 2010 21:48:13 +0000

Para quebrar um pouco os artigos sobre como personalizar Tema Thesis, hoje vamos ver uma série de sites e blogs que utilizam o tema Thesis.

Assim pode verificar o que o Thesis pode fazer pelo seu blog e ainda ficar deslumbrado com o que vai ver.

Acreditem que é Thesis os blogs que se seguem. Não percam mais tempo e comprem já o Thesis Theme.

1 – UNTEMPLATER

2 – PAUL STAMATIOU

3 – SIMPLE MOM

4 – TIP’D BLOG

5 – RECURSIVELOOP

6 – QUESTION

7 – HOW TO GET FOCUSED

8 – BLOGGING THEACER

9 – RONNESTAM

10 – MODERNOMICS

11 – KRISTARELLA

12 – NERDIST

13 – AUTHORITY RULES

14 – HIT THOSE KEYS

15 – MOGULMOM

16 – A LIFE IN TRANSLATION

17 – FUSEBOX

18 – LETTER

19 – ASNIO

20 – ERIC SCOUTEN

21 – MATT HODDER

22 – GREEN YOUR DECOR

23 – COPYBLOGGER

24 – 344 POUNDS

25 – AARDLING

26 – BILL

27 – THESISLAB

28 – HARVEST EATING

29 -IN TORONTO

30 – SHATTERBOXX

31 – PEARSONIFIED

32 – CUTE OVERLOAD

33 – THE FIRKE FILES

34 – MAKE THINGS FAIR

35 – MATT FLIES

36 – BLOGUSSION

37 – DEAL

38 – MONEY SAVING MOM

39 – MONEY NING

40 – CHRISTIAN PF

41 – BARGAIN BRIANA

42 – MAN VS DEBT

43 – PLANTING DOLLARS

44 – MUNCHAUSEN

45 – BIBLE MONEY MATTERS

46 – PTMONEY

47 – FISCALGEEK

48 – FREE FROM BROKE

49 – FRUGALDAD

50 – BUDGETS ARE SEXY

51 – GOOD FINANCIAL CENTS

52 – DOUGHROLLER

53 – FOR THE MOMMAS

54 – MONEY FUNK

55 - MOMS NEED TO KNOW

56 – DELIVER AWAY DEBT

57 – MONEVATOR

58 – ENGINEER A DEBT FREE LIFE

60 – DEBT FREE ADVENTURE

61 – KEEPING THE KINGDOM FIRST

62 – FISCAL FIZZLE

63 – DARWIN’S FINANCE

64 – DK

65 – THE CONSUMER BOOMER

66 – SAVING TO INVEST

67 – WELL-HEELED BLOG

68 – THE CENTSIBLE LIFE

69 – COUPLEMONEY

70 – BEING FRUGAL

71 – THESIS THEME HQ

72 – THESIS THEME .NET

73 – THESIS THEME

74 - SUGAR

75 – DIY THEMES

76 – MICHAEL GRAY

77 – HOW TO MAKE MY BLOG

78 – THESIS THEME TOOLS

79 – ART OF BLOG

80 – THESIS THEME DESIGN

81 – FRANKLING BISHOP

82 – CATS WHO BLOG

83- KRISPY KREME

84 – GREEN & GORGEOUS

85 – BANKLING

86 – ABROADENING

87 – UNIQUE BLOG

88 – DENNISON WOLFE

89 – DIY NINJAS

90 – MELVIN

91 – CHRIS

92 – DOUBLE MULE

93 – EMPTY CABIN MEDIA

94 – KIKOLANI

95 – BANCOSPT

96 – CARTÃO DE CRÉDITO PT

97 – PRODUTOS BANCÁRIOS

98 – APOSTA LUCRATIVA

99 – DINHEIROPT

100 – COMPREM THESIS

Até já…

Crédito da foto…

Traduzir Thesis Theme e WordPress para Português

João — Mon, 17 May 2010 22:41:28 +0000

Recentemente foi solicitado aqui no DinheiroPT ajuda para traduzir o Thesis Theme para Português.

Quem não sabe ainda o que é o Thesis Theme e o que ele pode fazer pelo seu blog aconselho a leitura do artigo “Porquê Thesis é o melhor Tema WordPress“.

Na verdade, o Thesis Theme só existe na sua linguagem de criação, o Inglês, no entanto, a sua tradução é extremamente simples, embora necessite que toda a plataforma que apoia o tema esteja na mesma linguagem.

Assim sendo, é necessário possuir o WordPress também em Português para que possa traduzir o Thesis Theme para Português.

TRADUZINDO O WORPDRESS

A tradução do WordPress para Português de Portugal ou do Brasil é extremamente fácil, apenas necessita de baixar os ficheiros que se seguem que se referem a pasta languages e efectuar o upload para o vosso serviço de alojamento.

Aceda ao Cpanel do vosso blog;
Em wp-content procure a pasta language.
Eliminem os ficheiro que estão dentro da pasta languages;
Faça o upload dos ficheiros que estão dentro da pasta language correspondente à linguagem que preferirem;
Procure o ficheiro wp-config em public.html;
Alterem para Português conforme imagem abaixo.

Tradução do WordPress para Português

TRADUZINDO THESIS

A tradução do Thesis é um pouco mais difícil até porque necessita que criem ficheiro tipo .po e .mo. Com a alteração do Thesis para 1.7 surgiu um novo tipo de ficheiro .pot, que veio dificultar a vida de todos os que operam com a tradução do tema.

Na verdade ainda não consegui compreender como efectuar a tradução deste tipo de ficheiro, já consegui alterar o ficheiro para .po e depois converter em .mo usando o Poedit, mas ainda não consegui resultados visíveis com estes procedimentos.

No entanto, para facilitar todo o processo, deixo aqui os ficheiro que já estão traduzidos para o meu blog para baixar e traduzir rapidamente os vossos. Como é óbvio os ficheiro estão em português de Portugal mas é simples efectuar as alterações através do próprio CPanel editando o ficheiro pt_PT.po em thesis/lib/languages e assim adequarem à vossa linguagem.

Baixar Languages Thesis – Português

Em wp_content/Themes/thesis/li/languages efectuem o upload dos ficheiros acima.

Como podem verificar é simples… Vejam o Vídeo… em HD vê-se melhor…

Como Colocar um header banner no Thesis Theme

João — Fri, 14 May 2010 22:16:25 +0000

O Thesis Theme dispensa apresentações aqui no DinheiroPT, no entanto, se está a chegar agora aqui ao blog aconselho-o a ler o artigo de apresentação do Thesis, “Porquê Thesis é o melhor Tema WordPress”.

Assim ficará a saber porque grande parte do conteúdo do DinheiroPT se funde em fornecer dicas para a personalização do Tema Thesis.

Então como será que podemos colocar um simples banner, por exemplo, 468x60px no cabeçalho do Thesis?

Simples e fácil e tudo se resume à utilização das funções (hooks) que distinguem Thesis da generalidade dos Temas Worpress.

Mantendo sempre o código original intacto e optimizado para motores de busca vamos efectuar este tutorial em dois simples passos.

1º PASSO

Aceda ao ficheiro custom_functions.php no Painel de administração do Thesis e coloque o seguinte código:

/* Copie e Cole custom_function.php */
function my_header_ad() {
?>

 http://www.dinheiropt.com/wp-content/uploads/2010/05/bannerdinheiroPT468x60.png" alt="DinheiroPT"
width="468" height="60"border="0"/>

}
add_action('thesis_hook_header', 'my_header_ad');

Como pode verificar aqui está o código do banner e a ordem da função para colocar este banner no cabeçalho do Thesis.

2º PASSO

Agora só falta o css para posicionar o banner e tornar tudo mais arrumado.

Assim sendo, em custom.css no painel de administração do Thesis cole o seguinte código.

/* Copie e Cole em custom.css */
.custom #header #header_ad {
float:right;
margin-top:-9em;
width:500px; }

Como vêm é extremamente fácil colocar um banner no header do Tema Thesis.

Até já…

Comprem já o Thesis Theme.

Full-Width Header!!! Como colocar no Thesis.

João — Thu, 06 May 2010 21:05:13 +0000

Recentemente fui solicitado por um leitor aqui do DinheiroPT para escrever mais artigos sobre como personalizar o Thesis Theme. Como é obvio, vou corresponder ao pedido e irei nos próximos tempos publicar artigos sobre diversas formas para optimizar e personalizar Thesis Theme para uma melhor utilização pelos leitores e visitantes de todos os bloggers “super inteligentes” que possuem o fantástico Thesis Theme.

Se por ventura é um dos bloggers que ainda não conhece o Thesis Theme então aconselho-o a ler o artigo “ Porquê Thesis é o melhor Tema WordPress?” para descobrir o que tem vindo a perder.

Retomando o assunto, hoje vou abordar Full Width Headers no Thesis ou em Português “Cabeçalho com a largura total do browser”.

Provavelmente, para os iniciantes no tema Thesis a optimização do cabeçalho pode parecer algo extremamente difícil de conceber, no entanto, digo-vos que não é, e reforço que o segredo da personalização do Thesis Theme está na utilização de hooks (ganchos) que permitem alterar a posição de qualquer parte do blog sem que necessite de ser especialista em código.

Se o termo hooks não lhe é familiar então sugiro que consulte o artigo “Thesis OpenHook – Um plugin Poderoso” que irá ficar totalmente esclarecido.

Como é óbvio, o tópico Thesis Full Width header não é nada de novo e a blogger que possui os créditos pelo melhor tutorial é Kristen Symonds do blog Kristarella com o seu artigo Thesis full-width headers 101.

Full-Width

Como podem verificar o DinheiroPT possui largura total no seu cabeçalho e utilizou os concelhos de Kristarella para optimizar e personalizar todo o seu cabeçalho e garanto-vos que o podem fazer para os vossos blogs em apenas 3 simples passos.

1º PASSO

Escolher Full Width em HTML Framework [design options/html framework]..

Full-Width

Como é de esperar o primeiro passo que deve fazer é no painel de controlo do Thesis seleccionar o campo Full-width framework e aconselho-o igualmente a optar por optimizar o Outer Page Padding colocando o valor 0.0 ou 0.5.

Nota: a alteração para full-width irá mexer no código CSS que já poderá ter inserido em custom.css. Assim sendo deverá corrigir esses erros caso aconteça.

2º PASSO

Agora devemos ir a custom_fuctions.php e colocar o seguinte código que basicamente vai retirar a barra de navegação e o cabeçalho e seguidamente o vai inserir novamente, mas fora do blog, isto é, fora do html.

Esta modificação permitira que o cabeçalho e a barra de navegação possuam a largura total do browser. Mas só acontece se o 1º passo esteja efectuado.

remove_action('thesis_hook_before_header', 'thesis_nav_menu');
remove_action('thesis_hook_header', 'thesis_default_header');

function full_width_header() { ?>
	
		
			
		
	
	
		
			
				
			
		
	

3º PASSO
Como é óbvio temos que inserir algum CSS para posicionar e personalizar o cabeçalho. O código é simples e permite que seja alterado pelo utilizador.
Como este artigo´possui referencia no artigo de Kristella vou colocar o código CSS original no entanto também vou disponibilizar o código que utilizei para o DinheiroPT.
Em custom.css;
Kristarella
.custom #header_area{display:none;}

.custom #nav_area {background:#c3d9d6; padding:0.5em 0; border-bottom:1px solid #ddf;}
	.custom #nav_area ul {border-bottom:none; border-left:none;}
		.custom #nav_area ul li {border-width:0; margin-bottom:0; padding-bottom:0; background:none;}

.custom #title_area {background:#de6a61; padding:1em 0; border-bottom:1px solid #c55;}
	.custom #header {border-bottom:none;}

DinheiroPT
.custom #header #logo a { display: block; height: 130px; width: 960px; background: url(images/dinheiroptblog.gif) no-repeat; outline: none; }
.custom #header #logo, .custom #header #tagline { text-indent: -9999px; }
.custom #header #tagline { height: 0; }
.custom #header { padding: 0; }
.custom #header {border-bottom:none;}
.custom #nav_area {background:#262626; border-bottom:3px solid #F09327; padding-top:6px;}
	.custom ul#tabs {border-bottom:0; border-color:#DBD4B7;}
		.custom ul#tabs li {border-color:#DBD4B7; background-color:#E6DEC0;}
		.custom ul#tabs li.current_page_item, .custom ul#tabs li.current-cat {background:#fff;}
.custom .menu { background: #262626; }
.custom .menu a, .menu .current ul a, .menu .current-cat ul a { margin: 6px;}

FINALIZANDO
Como pode verificar é extremamente simples possuir cabeçalhos com largura total no entanto, alguns arranjos necessitam de ser feitos a nível de CSS em custom.css e no painel de administração do Thesis  em design options Nav Bar, nomeadamente a alteração das cores do texto na barra de navegação e outros.
Já agora se não possuem Thesis estão a perder tráfego no vosso blog. Comprem Thesis.
Até já…