Tutorial: Footer vBHispano

imported_Agustin

Baneado
Gamma
Verificación en dos pasos desactivada
Desde
8 Ago 2010
Mensajes
399
Edad
25
Crédito(s)
0
Puntos
0
Aca esta:

Este codigo css va en additional.css
(pueden poner en cualquier css de su estilo total lo lee igual, yo por comodidad)

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- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */


Esto en la plantilla 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>


Solo sirve para 4.x
cualquier cosa me avisan chau.
 

paco13

Beta
Verificación en dos pasos desactivada
Desde
19 Ene 2010
Mensajes
50
Edad
52
Crédito(s)
0
Puntos
0
ok,va de maravilla,gracias
 

master1986

Gamma
Verificación en dos pasos desactivada
Desde
10 Dic 2007
Mensajes
331
Edad
33
Crédito(s)
0
Puntos
17
alguien que la pueda dejarlo para la version 3.8
 

imported_Agustin

Baneado
Gamma
Verificación en dos pasos desactivada
Desde
8 Ago 2010
Mensajes
399
Edad
25
Crédito(s)
0
Puntos
0

imported_lino

Beta
Verificación en dos pasos desactivada
Desde
16 Sep 2010
Mensajes
33
Edad
32
Crédito(s)
0
Puntos
0
osea si miras bien la imagen que puse, los patrocinadores estan debajo de los links, y la seleccion de temas y lenguaje no esta al frente de el copyrig de vbulletin, esta debajo tambien, osea esta todo descuadrado, me ayudas porfas, gracias
 

imported_Agustin

Baneado
Gamma
Verificación en dos pasos desactivada
Desde
8 Ago 2010
Mensajes
399
Edad
25
Crédito(s)
0
Puntos
0
Es que ese footer que puse es el anterior a este, el que esta ahora esta modificado.
El que puse aca es el anterior a este.
Eso es lo que pasa, no es ningun problema, el diseño ya es asi.
 

imported_lino

Beta
Verificación en dos pasos desactivada
Desde
16 Sep 2010
Mensajes
33
Edad
32
Crédito(s)
0
Puntos
0
aaaaaaaa ok,,, sera que se puede poner este nuevo k hay aca??? o me toca experimentar a mi???

o simplemente, me dices k variables se deben modificar para k patrocinadores aparezca en la parte izquierda y quede todo mas centrado??? gracias
 

tonra

Curioso
Verificación en dos pasos desactivada
Desde
13 Jun 2009
Mensajes
6
Crédito(s)
0
Puntos
0
Agradezco a vbhispano su amabilidad al compartir este extraodinário footer para que los demás usuari@s de vbulletin disfrutemos de estas mejoras.

Muchas gracias.
 

imported_Agustin

Baneado
Gamma
Verificación en dos pasos desactivada
Desde
8 Ago 2010
Mensajes
399
Edad
25
Crédito(s)
0
Puntos
0
Agradezco a vbhispano su amabilidad al compartir este extraodinário footer para que los demás usuari@s de vbulletin disfrutemos de estas mejoras.

Muchas gracias.
Disculpa que te corrija, no fue vBHispano quien lo compartio, fui yo, no tengo absolutamente nada que ver
con vBHispano.

aaaaaaaa ok,,, sera que se puede poner este nuevo k hay aca??? o me toca experimentar a mi???

o simplemente, me dices k variables se deben modificar para k patrocinadores aparezca en la parte izquierda y quede todo mas centrado??? gracias

Tenes que saber CSS para poder modificar los ordenes de los divs.
Saludos.
 

tonra

Curioso
Verificación en dos pasos desactivada
Desde
13 Jun 2009
Mensajes
6
Crédito(s)
0
Puntos
0
Disculpa que te corrija, no fue vBHispano quien lo compartio, fui yo, no tengo absolutamente nada que ver
con vBHispano.
Disculpame tú entonces, muy agradecido.

Por cierto, todo ha salido ok, el caso es que en el portal no se visualiza correctamente, debo modificar alguna plantilla en especial Agustin?

Ver el archivo adjunto 4784

Muchas gracias y de nuevo, te pído disculpas.
 

master1986

Gamma
Verificación en dos pasos desactivada
Desde
10 Dic 2007
Mensajes
331
Edad
33
Crédito(s)
0
Puntos
17
alguien que la pueda dejar para la versión 3.8.x
ya que la necesito.
muchas gracias
 

imported_Agustin

Baneado
Gamma
Verificación en dos pasos desactivada
Desde
8 Ago 2010
Mensajes
399
Edad
25
Crédito(s)
0
Puntos
0
Disculpame tú entonces, muy agradecido.

Por cierto, todo ha salido ok, el caso es que en el portal no se visualiza correctamente, debo modificar alguna plantilla en especial Agustin?

Ver el archivo adjunto 4784

Muchas gracias y de nuevo, te pído disculpas.
Con firefox, anda a "Herramientas", "Informacion de Pagina" - "Medios", y busca los links de imagenes
que estan en gris, ahi te dice desde donde esta leyendo las imagenes el CMS.
De no ser ese el problema, copia el CSS del footer, y agregalo a una plantilla global.
 

tonra

Curioso
Verificación en dos pasos desactivada
Desde
13 Jun 2009
Mensajes
6
Crédito(s)
0
Puntos
0
Muchas gracias por tu respuesta, efectivamente, he copiádo el código que expones para
el Additional.css en las plantillas prinipales del portal y del Arcade, de esta forma queda todo perfecto.

De nuevo muchas gracias por todo. :)

Saludos.
 

balance

Gamma
Verificación en dos pasos desactivada
Desde
24 Abr 2006
Mensajes
182
Edad
39
Crédito(s)
0
Puntos
0
Still waiting for the 3.8.x version
 

quito12

Gamma
Verificación en dos pasos desactivada
Desde
16 Jul 2009
Mensajes
271
Edad
36
Crédito(s)
0
Puntos
4
No se por que motivo en los names: sobre vbhispano, links y patrocinadores, me salen solo en mayúsculas y no en minúscula.

Alguien que me pueda guiar ?
 

Arriba