← Desenvolvimento

Ajuda para alterar Header.php

Lida 2345 vezes

Offline

Filipe Santos 
Membro
Mensagens 201 Gostos 5
Feedback +7

Troféus totais: 19
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Level 4 Level 3 Level 2 Level 1 100 Posts 50 Posts 10 Posts

Boas  :+trafego: preciso da vossa ajuda,

Tenho no meu header do blog os ícones do Facebook, twitter, RSS e LinkedIn e queria alterar o ícone do LinkedIn pelo do Google+. A minha cabeça já está a andar á roda de tantas experiências que já fiz e que deu em nada....

O meu CSS está assim:

Código: [Seleccione]
/* Social Links */

#socialLinks {
position:absolute;
right:0;
top:105px;
background:url(images/bk_social_links.png) 0 50% no-repeat;
padding-left:155px;
height:42px;
}

#socialLinks .linkedin, #socialLinks .facebook, #socialLinks .twitter, #socialLinks .rss {
display:block;
width:32px;
height:32px;
float:left;
margin-left:5px;
text-indent:-9999px;
}

#socialLinks .linkedin:hover, #socialLinks .facebook:hover, #socialLinks .twitter:hover, #socialLinks .rss:hover {
margin-bottom:2px;
}

#socialLinks .linkedin {
background:url(images/ico_linkedin.png) 0 0 no-repeat;
}

#socialLinks .facebook {
background:url(images/ico_facebook.png) 0 0 no-repeat;

E o meu ficheiro header.php está assim:

Código: [Seleccione]
<!-- Begin #socialLinks -->
<div id="socialLinks">
<?php if(get_option('alltuts_linkedin_link')!=""){ ?>
<a href="<?php echo get_option('alltuts_linkedin_link'); ?>" class="linkedin" title="Join us on LinkedIn!">Join us on LinkedIn!</a>
<?php }?>
<?php if(get_option('alltuts_facebook_link')!=""){ ?>

Como é que vocês faziam a alteração que eu pretendo fazer?
Offline
m

martin56 
Membro
Mensagens 27 Gostos 0
Troféus totais: 15
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Level 3 Level 2 Level 1 10 Posts First Post Karma Sixth year Anniversary

Cria mais uma regra de css por cada rede social com um background image a apontar para cada icone.
Offline

Filipe Santos 
Membro
Mensagens 201 Gostos 5
Feedback +7

Troféus totais: 19
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Level 4 Level 3 Level 2 Level 1 100 Posts 50 Posts 10 Posts

Citação de: martin56 em 27/Jul/2012 17:36
Cria mais uma regra de css por cada rede social com um background image a apontar para cada icone.

E não tem que se alterar nada no ficheiro header.php ?
Offline

Filipe Santos 
Membro
Mensagens 201 Gostos 5
Feedback +7

Troféus totais: 19
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Level 4 Level 3 Level 2 Level 1 100 Posts 50 Posts 10 Posts

OK, já consegui apontar o ícone para o link do google+ , mas a imagem do ícone aparece-me a do linkedIn e não a do Google+.



Eu acho que será por causa do link da imagem.

Eu coloco este link - http://www.********.com/wp-content/uploads/2012/07/g-plus-icon-32x32.png  em vez  de um link destes - images/ico_linkedin.png

Será por causa disto que não me aparece o ícone no header do blog ? E como devo transformar o link de cima no link de baixo ?
Offline

STronic 
Elite
Mensagens 546 Gostos 8
Feedback +5

Troféus totais: 30
Trófeus: (Ver todos)
Mobile User Search Apple User Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3

Aqui:
Código: [Seleccione]
#socialLinks .linkedin {
background:url(images/ico_linkedin.png) 0 0 no-repeat;
}

Troca isto:
  background:url(images/ico_linkedin.png) 0 0 no-repeat;

por isto:
  background:url(/wp-content/uploads/2012/07/g-plus-icon-32x32.png) 0 0 no-repeat;
Offline

Filipe Santos 
Membro
Mensagens 201 Gostos 5
Feedback +7

Troféus totais: 19
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Level 4 Level 3 Level 2 Level 1 100 Posts 50 Posts 10 Posts

Citação de: STronic em 27/Jul/2012 18:45
Aqui:
Código: [Seleccione]
#socialLinks .linkedin {
background:url(images/ico_linkedin.png) 0 0 no-repeat;
}

Troca isto:
  background:url(images/ico_linkedin.png) 0 0 no-repeat;

por isto:
  background:url(/wp-content/uploads/2012/07/g-plus-icon-32x32.png) 0 0 no-repeat;

Agradeço a ajuda, mas continua a não dar !!!!!

Aparece o ícone do linkedin, ao clicar no ícone consigo enviar para o Google+ mas não estou a conseguir alterar o ícone para o google+...

Dá-me a escapar aqui qualquer coisa!!!!!
Offline

STronic 
Elite
Mensagens 546 Gostos 8
Feedback +5

Troféus totais: 30
Trófeus: (Ver todos)
Mobile User Search Apple User Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3

Citação de: 2gold em 27/Jul/2012 19:05
Agradeço a ajuda, mas continua a não dar !!!!!

Aparece o ícone do linkedin, ao clicar no ícone consigo enviar para o Google+ mas não estou a conseguir alterar o ícone para o google+...

Dá-me a escapar aqui qualquer coisa!!!!!

Ao alterares o código que te dei tem de resultar, tens algum plugin de cache ?
Offline

Filipe Santos 
Membro
Mensagens 201 Gostos 5
Feedback +7

Troféus totais: 19
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Level 4 Level 3 Level 2 Level 1 100 Posts 50 Posts 10 Posts

Citação de: STronic em 27/Jul/2012 19:31
Ao alterares o código que te dei tem de resultar, tens algum plugin de cache ?

Ok, resultou sim senhor...

Demorou foi o envio do ficheiro para o servidor, por isso, cada vez que carregava a página ainda não aparecia a alteração.

Agradeço-te, uma vez mais, a ajuda preciosa. Eu acho que ainda não vai ser a última...  :grin:

Páginas: 1

Posts relacionados

SMF

(alterar style CSS do fórum) Fixar Header no IE

amaru

WordPress

Alterar tamanho do header

S
Shaddz

WordPress

[Dúvida] Optimizar header.php

Tomé Mendes