I
imported_NkC
Delta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Este es un tuto que surgio por la consulta de Lucas Guerrero, para modificar el footer. La modificación me parecio interesante asi que decidí hacer este mini tutorial, que involucrá solo mover algunas partes del footer y crear algunas etiquetas HTML, espero que les guste.
Imagen de como queda el resultado final:
Ver el archivo adjunto 4303
Entonces, primero ir: Estilos y plantillas > administrar estilos > "el estilo" > Plantillas comunes > Footer
Busca:
Y lo mueves para dejarlo antes del siguiente div:
Entonces para mover los selectores sobre el cuadrado, como la imagen.
Ahora busca:
Y antes de eso pega lo siguiente:
Antes de esto: ....
Cerrar la tabla:
Ahora Busca:
Cortalo, elimina las etiquetas div que lo envuelven (<div id="footer_copyright" class="shade footer_copyright"></div>).
Ahora pegalo despues de:
Busca:
Cortalo y elimina las div que lo envuelven al igual que el anterior.
Y lo pegas despues del copyright movido anteriormente:
Ahora finalmente debemos achicar la letra del copyright para que no se confunda con los links, para esto envolveremos los 2 codigos agregados despues de </ul> y envolverlos con la siguiente etiqueta div:
Quedando así:
Para los bordes redondeados nos dirigeremos, ahora, a editar el CSS:
Editar Plantillas > CSS Plantillas > vbulletin-chrome.css
Buscar: .footer {
Y agregar:
Para solucionar el siguiente error: http://i51.tinypic.com/2djyoaf.jpg
Vamos a agregar una nueva variable a nuestro CSS: Abrir vbulletin-chrome.css y buscamos .footer justo sobre ella vamos a agregar:
Ahora nos dirigimos a Plantillas comunes > Footer ; nuevamente y nos situamos en:
Justo sobre eso agregamos la siguiente div:
Y para cerrar esta agregamos despues de:
La etiqueta </div>; quedando de esta manera:
Eso es todo para solucionar el problema 😀
Lista ya deberia estar funcionando a la perfección la modificación. (H)
Imagen de como queda el resultado final:
Ver el archivo adjunto 4303
Entonces, primero ir: Estilos y plantillas > administrar estilos > "el estilo" > Plantillas comunes > Footer
Busca:
PHP:
<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>Y lo mueves para dejarlo antes del siguiente div:
PHP:
<div id="footer" class="floatcontainer footer">Entonces para mover los selectores sobre el cuadrado, como la imagen.
Ahora busca:
PHP:
<ul id="footer_links" class="footer_links">Y antes de eso pega lo siguiente:
PHP:
<table width="100%" heigh="100%">
<tr>
<td><img src="ruta de tu logo" align="left"></td>
<td align="right">Antes de esto: ....
PHP:
<vb:if condition="$show['dst_correction']">Cerrar la tabla:
PHP:
</td></tr></table>Ahora Busca:
PHP:
<!-- Do not remove this copyright notice -->
{vb:rawphrase powered_by_vbulletin}
<!-- Do not remove this copyright notice -->Cortalo, elimina las etiquetas div que lo envuelven (<div id="footer_copyright" class="shade footer_copyright"></div>).
Ahora pegalo despues de:
PHP:
</ul>Busca:
PHP:
<!-- 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}Cortalo y elimina las div que lo envuelven al igual que el anterior.
Y lo pegas despues del copyright movido anteriormente:
PHP:
<!-- Do not remove this copyright notice -->
{vb:rawphrase powered_by_vbulletin}
<!-- Do not remove this copyright notice -->Ahora finalmente debemos achicar la letra del copyright para que no se confunda con los links, para esto envolveremos los 2 codigos agregados despues de </ul> y envolverlos con la siguiente etiqueta div:
PHP:
<p style="font-size:x-small;"></p>Quedando así:
PHP:
<p style="font-size:x-small;">
<!-- 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}
</p>Para los bordes redondeados nos dirigeremos, ahora, a editar el CSS:
Editar Plantillas > CSS Plantillas > vbulletin-chrome.css
Buscar: .footer {
Y agregar:
PHP:
-moz-border-radius: 10px;
-webkit-border-radius: 10px;Para solucionar el siguiente error: http://i51.tinypic.com/2djyoaf.jpg
Vamos a agregar una nueva variable a nuestro CSS: Abrir vbulletin-chrome.css y buscamos .footer justo sobre ella vamos a agregar:
PHP:
.footer2 {
clear:both;
text-align:{vb:stylevar right};
display:block;
width: 100%;
}Ahora nos dirigimos a Plantillas comunes > Footer ; nuevamente y nos situamos en:
PHP:
<form action="{vb:raw vboptions.forumhome}.php" method="get" id="footer_select" class="footer_select">Justo sobre eso agregamos la siguiente div:
PHP:
<div id="footer2" class="floatcontainer footer2">Y para cerrar esta agregamos despues de:
PHP:
</vb:if>
</form>La etiqueta </div>; quedando de esta manera:
PHP:
</vb:if>
</form></div>Eso es todo para solucionar el problema 😀
Lista ya deberia estar funcionando a la perfección la modificación. (H)
