Tutorial: Footer vBHispano

imported_Agustin · 21/03/2011

Aqui está:

Este código css vai em additional.css
(podem colocar em qualquer css do seu estilo, ele lê igual, eu coloco por comodidade)

PHP:

/*- - - - - COMIENZO FOOTER- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.below_body{
clear:both;
margin-top:15px;
display:block;
width:100%;
background:#425769 none ;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
}

#piePag{
color:#71818f;
}

#piePag a{
color:rgb(255,255,255);
}

#piePag a:hover{
color:rgb(255,255,255);
}

#piePag form{
background-color:#354c66;
border-color:#46413c;
border-radius:4px;
padding:4px;
}

#piePag form:hover{
background-color:#40676f;
border-color:#a5a099;
}

#piePag{
padding:32px 15px 0;
}

#piePag > li{
list-style:none;
}

#piePag > li.column{
position:relative;
padding:0;
width:290px;
float:left;
margin-right:30px;
height:auto !important;
height:50px;
min-height:50px;
}

#piePag > li.col-right{
margin-right:0;
}

#piePag > li.column .widget:last-child{
margin-bottom:0 !important;
}

#piePag > li.copyright{
width:465px;
float:left;
margin:10px auto 0;
padding:20px 0;
font-size:85%;
border-top:1px solid #7192A8;
letter-spacing:0.3px;
}

#piePag > li.styles{
width:465px;
float:left;
margin:10px auto 0;
padding:20px 0;
font-size:85%;
border-top:1px solid #7192A8;
letter-spacing:0.3px;
}

#piePag >li.styles form{
float:right;
}

.clear{
clear:both;
}

.widget{
position:relative;
}

.widget h2.title{
font-size:20px;
font-family:Georgia,serif;
text-transform:uppercase
;letter-spacing:0.5px;
margin-bottom:18px;
}

.widget > p:last-child,.widget > ul:last-child,.widget > ul:last-child > li:last-child,.widget > form:last-child,.widget > table:last-child,.widget > blockquote:last-child,.widget > blockquote p:last-child{
margin-bottom:0;
}

.widget ul,.widget ol{
margin-left:0;
padding-left:0;
margin-right:0;
padding-right:0;
}

.widget ul li{
list-style:none;
padding:5px 0 5px 15px;
}

.widget ul > li ul li{
padding-left:15px;
}

.widget ul li a{
text-decoration:none;
}

.widget ul li ul li:first-child{
margin-top:5px;
}

.widget ul li ul li:last-child{
margin-bottom:0;
padding-bottom:0;
}

.widget ul li ul{
border-left:solid 1px #e8e8e8;
}

#piePag .widget-images{
width:304px;
position:relative;
left:-7px;
margin-bottom:30px !important;
}

#piePag .widget-images .widget-img-badge
{display:inline;
float:left;
margin:0 6px 12px 6px;
}

#piePag .widget-images .widget-img-badge a{
display:block;
width:75px;
height:75px;
overflow:hidden;
padding:6px;
background:#373737;
border:solid 1px #424242;
}

#piePag .widget-images .widget-img-badge img{
width:75px;height:75px;
}

#piePag .widget-images .widget-img-badge a:hover{
background-color:#393939;
border-color:#525252;
}

#piePag .widget{
background:#425769;
padding-top:7px;
margin-bottom:40px;
}

#piePag .widget h2.title{
font-size:19px;
color:#d9c9ba;
letter-spacing:0.5px;
padding-left:12px;
margin-bottom:16px;
}
#piePag .widget ul li{
border-bottom:solid 1px #7192A8;
}

#piePag .widget ul li.block-link a{}#piePag .widget ul li.block-link a:hover{
color:#fff;
background-color:#7192A8;
}

#piePag .widget ul li ul li:first-child{
border-top:solid 1px #343434;
margin-top:5px;
}

#piePag .widget ul li ul li:last-child{
margin-bottom:0;
padding-bottom:0;
border-bottom:none;
}

#piePag .widget ul li ul{
border-left:solid 1px #343434;
}

#piePag .widget ul li.block-link{
padding:0;
}
#piePag .widget ul li.block-link a{
display:block;padding:5px 0 5px 15px;
}
/*- - - - - FIN FOOTER- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

Isto na template footer:

PHP:

{vb:raw ad_location.ad_footer_start}
{vb:raw ad_location.global_above_footer}
<div id="footer" class="floatcontainer">
 <vb:if condition="$show['dst_correction']">
	<!-- auto DST correction code -->
		<form action="profile.php?do=dst" method="post" name="dstform">
			<input type="hidden" name="s" value="{vb:raw session.sessionhash}" />
			<input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" />
			<input type="hidden" name="do" value="dst" />
		</form>
		<script type="text/javascript">
		<!--
			var tzOffset = {vb:raw bbuserinfo.timezoneoffset} + {vb:raw bbuserinfo.dstonoff};
			var utcOffset = new Date().getTimezoneOffset() / 60;
			if (Math.abs(tzOffset + utcOffset) == 1)
			{	// Dst offset is 1 so its changed
				document.forms.dstform.submit();
			}
		//-->
		</script>
		<!-- / auto DST correction code -->
	</vb:if>
	
	<script type="text/javascript">
	<!--
		// Main vBulletin Javascript Initialization
		vBulletin_init();
	//-->
	</script>
        {vb:raw template_hook.footer_javascript}
</div>
</div> <!-- closing div for body_wrapper -->

<div class="below_body">

<ul id="piePag" class="clearfix">
<li class="column">
<div class="widget widget_text">
<h2 class="title">Sobre vBHispano</h2>
<div class="textwidget"><p>vBulletin Hispano es la comunidad más grande no oficial de soporte en español para vBulletin. Es una comunidad compuesta de usuarios que utilizan vBulletin como el software para sus comunidades, los cuales desean aprender más sobre este software y poder administrar mejor sus comunidades. Nuestra meta es convertirnos en el sitio más grande de soporte gratuito y de recursos en español para los usuarios administradores de foros potenciados por vBulletin.</p>
</div>
</div>
</li>
<li class="column col-cender">
<div class="widget widget_nav_menu">
<h2 class="title">Links</h2>
<div class="menu-categories-container">
<ul id="menu-categories" class="menu">
<li class="menu-item block-link">
		

<vb:if condition="$show['contactus']">
<li class="menu-item block-link">
<a href="{vb:raw vboptions.contactuslink}" rel="nofollow" accesskey="9">{vb:rawphrase contact_us}</a>
</li></vb:if>

<vb:if condition="$vboptions['hometitle']">
<li class="menu-item block-link">
<a href="{vb:raw vboptions.homeurl}">{vb:raw vboptions.hometitle}</a>
</li></vb:if>

<vb:if condition="$show['admincplink']">
<li class="menu-item block-link">
<a href="{vb:raw admincpdir}/index.php{vb:raw session.sessionurl_q}">{vb:rawphrase admin}</a>
</li></vb:if>

<vb:if condition="$show['modcplink']">
<li class="menu-item block-link">
<a href="{vb:raw modcpdir}/index.php{vb:raw session.sessionurl_q}">{vb:rawphrase mod}</a>
</li></vb:if>

<vb:if condition="$vboptions['archiveenabled']">
<li class="menu-item block-link">
<a href="archive/index.php{vb:raw session.sessionurl_q}">{vb:rawphrase archive}</a>
</li></vb:if>

{vb:raw template_hook.footer_links}

<vb:if condition="$vboptions['privacyurl']">
<li class="menu-item block-link"><a href="{vb:raw vboptions.privacyurl}">{vb:rawphrase privacy_statement}</a>
</li></vb:if>

<vb:if condition="$vboptions['tosurl']">
<li class="menu-item block-link">
<a href="{vb:raw vboptions.tosurl}">{vb:rawphrase terms_of_service}</a>
</li></vb:if>

<li class="menu-item block-link">
<a href="{vb:raw relpath}#top" onclick="document.location.hash='top'; return false;">{vb:rawphrase top}</a>
</li>

</ul>
</div>
</div>
</li>
<li class="column col-right">
<div class="widget widget-images">
<h2 class="title">Socios</h2>
<div class="cleardiv">

<div class="widget-img-badge">
<a rel="nofollow" href="http://www.vbhispano.com/foros/contacto/?subject=0">
<img  src="/foros/publicidad/imgs/mini.png" alt="Tu sitio aquí." title="Tu sitio aquí." /></a></div>

<div class="widget-img-badge">
<a rel="nofollow" href="http://www.vbhispano.com/foros/contacto/?subject=0">
<img  src="/foros/publicidad/imgs/mini.png" alt="Tu sitio aquí." title="Tu sitio aquí." /></a></div>

<div class="widget-img-badge">
<a rel="nofollow" href="http://www.vbhispano.com/foros/contacto/?subject=0">
<img  src="/foros/publicidad/imgs/mini.png" alt="Tu sitio aquí." title="Tu sitio aquí." /></a>
</div>

<div class="widget-img-badge">
<a rel="nofollow" href="http://www.vbhispano.com/foros/contacto/?subject=0">
<img  src="/foros/publicidad/imgs/mini.png" alt="Tu sitio aquí." title="Tu sitio aquí." /></a>
</div>

<div class="widget-img-badge">
<a rel="nofollow" href="http://www.vbhispano.com/foros/contacto/?subject=0">
<img  src="/foros/publicidad/imgs/mini.png" alt="Tu sitio aquí." title="Tu sitio aquí." /></a>
</div> 

<div class="widget-img-badge">
<a rel="nofollow" href="http://www.vbhispano.com/foros/contacto/?subject=0">
<img  src="/foros/publicidad/imgs/mini.png" alt="Tu sitio aquí." title="Tu sitio aquí." /></a>
</div>

<br class="cleardiv" />
</div>
</div>
</li>

<li class="clear"></li>

<li class="copyright"> 
	<!-- Do not remove this copyright notice -->
	{vb:rawphrase powered_by_vbulletin}
	<!-- Do not remove this copyright notice -->
	<!-- Do not remove cronimage or your scheduled tasks will cease to function -->
	{vb:raw cronimage}
	<!-- Do not remove cronimage or your scheduled tasks will cease to function -->
	{vb:raw vboptions.copyrighttext}
</li>

<li class="styles">
<form action="{vb:raw vboptions.forumhome}.php" method="get" id="footer_select" class="footer_select">

			
		<vb:if condition="$show['quickchooser']">
			<select name="styleid" onchange="switch_id(this, 'style')">
				<optgroup label="{vb:rawphrase quick_style_chooser}">
					{vb:raw quickchooserbits}
				</optgroup>
			</select>	
		</vb:if>
		
		<vb:if condition="$show['languagechooser']">
			<select name="langid" onchange="switch_id(this, 'lang')">
				<optgroup label="{vb:rawphrase quick_language_chooser}">
					{vb:raw languagechooserbits}
				</optgroup>
			</select>
		</vb:if>
	</form>

</li> 

<li class="clear"></li>

</ul>
<vb:if condition="$vboptions['enablefacebookconnect']">
	{vb:raw facebook_footer}
</vb:if>

Só serve para 4.x
qualquer coisa me avisem, tchau.

balance · 22/03/2011

Como fazemos para funcionar na 3.8x?

paco13 · 22/03/2011

ok, está funcionando maravilhosamente, obrigado

imported_Agustin · 22/03/2011

digweed disse:
Como fazemos para funcionar na 3.8x?

Alterando as variáveis pelas da 3.8x-

imported_lino · 22/03/2011

Ver o anexo 4772

Bom, esse erro acontece comigo, o que poderia ser??? acabei de atualizar para a 4.1.2, muito obrigado

balance · 23/03/2011

Agustin disse:
Alterando as variáveis pelas da 3.8x-

O problema é que não sei como fazer isso.

master1986 · 23/03/2011

alguém que possa deixar para a versão 3.8

imported_Agustin · 25/03/2011

lino disse:
Ver o anexo 4772

Bom, esse erro acontece comigo, o que poderia ser??? acabei de atualizar para a 4.1.2, muito obrigado

Não vejo o erro em lugar nenhum, de que erro se trata?

---------- Atualizado às 12:28 ---------- Original às 12:28 ----------

master1986 disse:
alguém que possa deixar para a versão 3.8

Depois vejo se um amigo quer converter para a 3x

imported_lino · 26/03/2011

ou seja, se você olhar bem a imagem que coloquei, os patrocinadores estão abaixo dos links, e a seleção de temas e idioma não está na frente do copyright do vbulletin, está abaixo também, ou seja, está tudo desalinhado, você me ajuda por favor, obrigado

imported_Agustin · 26/03/2011

É que esse rodapé que coloquei é o anterior a este, o que está agora está modificado.
O que coloquei aqui é o anterior a este.
Isso é o que acontece, não é nenhum problema, o design já é assim.

imported_lino · 26/03/2011

aaaaaaaa ok,,, será que dá para colocar este novo que tem aqui??? ou terei que experimentar eu mesmo???

ou simplesmente, você me diz quais variáveis devem ser modificadas para que os patrocinadores apareçam na parte esquerda e fique tudo mais centralizado??? obrigado

tonra · 27/03/2011

Agradeço ao vbhispano pela sua gentileza ao compartilhar este extraordinário rodapé para que os demais usuários do vbulletin desfrutemos destas melhorias.

Muito obrigado.

imported_Agustin · 27/03/2011

tonra disse:
Agradeço ao vbhispano pela sua gentileza ao compartilhar este extraordinário rodapé para que os demais usuários do vbulletin desfrutemos destas melhorias.

Muito obrigado.

Desculpe-me por te corrigir, não foi o vBHispano quem compartilhou, fui eu, não tenho absolutamente nada a ver
com o vBHispano.

lino disse:
aaaaaaaa ok,,, será que dá para colocar este novo que tem aqui??? ou terei que experimentar eu mesmo???

ou simplesmente, você me diz quais variáveis devem ser modificadas para que os patrocinadores apareçam na parte esquerda e fique tudo mais centralizado??? obrigado

Você precisa saber CSS para poder modificar a ordem das divs.
Abraços.

tonra · 28/03/2011

Desculpe-me por te corrigir, não foi o vBHispano quem compartilhou, fui eu, não tenho absolutamente nada a ver
com o vBHispano.

Desculpe-me você então, muito agradecido.

Por sinal, tudo saiu ok, o caso é que no portal não é exibido corretamente, devo modificar algum template em especial Agustin?

Ver o anexo 4784

Muito obrigado e novamente, te peço desculpas.

master1986 · 28/03/2011

alguém que possa deixar para a versão 3.8.x
já que preciso dela.
muito obrigado

imported_Agustin · 29/03/2011

tonra disse:
Desculpe-me você então, muito agradecido.

Por sinal, tudo saiu ok, o caso é que no portal não é exibido corretamente, devo modificar algum template em especial Agustin?

Ver o anexo 4784

Muito obrigado e novamente, te peço desculpas.

Com o firefox, vá em "Ferramentas", "Informações da Página" - "Mídia", e procure os links de imagens
que estão em cinza, lá diz de onde o CMS está lendo as imagens.
Se não for esse o problema, copie o CSS do rodapé e adicione a um template global.

tonra · 04/04/2011

Muito obrigado pela sua resposta, efetivamente, copiei o código que você expõe para
o Additional.css nos templates principais do portal e do Arcade, desta forma fica tudo perfeito.

Novamente muito obrigado por tudo. 🙂

Abraços.

balance · 05/04/2011

Still waiting for the 3.8.x version

imported_Agustin · 07/04/2011

digweed disse:
Still waiting for the 3.8.x version

Currently these momeI am very busy, When I Have Time,
Carried out, for versions 3.x.

Best regards.

quito12 · 04/05/2011

Não sei por qual motivo nos nomes: sobre vbhispano, links e patrocinadores, eles aparecem apenas em maiúsculas e não em minúsculas.

Alguém que possa me orientar?

Tutorial: Footer vBHispano

imported_Agustin

balance

paco13

imported_Agustin

imported_lino

balance

master1986

imported_Agustin

imported_lino

imported_Agustin

imported_lino

tonra

imported_Agustin

tonra

master1986

imported_Agustin

tonra

balance

imported_Agustin

quito12

Tópicos similares