¿Supiste lo que acaba de lanzar LagriHost? Sí, como lo estabas esperando, ahora vendemos Web Hosting y Dominios. Conoce más :)


Calificación:
  • 1 voto(s) - 3 Media
  • 1
  • 2
  • 3
  • 4
  • 5
TUTORIAL Footer como LagriHost
#1
0
Bueno queridos amigos simplemente vengo a compartir un poco de lo aprendido en mi clase de ofimática, claro que fui mas vago que lo hice en dreamweaver cs 8.

Bueno con un poco de conocimientos básico de HTML y CSS logre algo similar al footer de LagriHost por lo cual declaro totalmente que lo haya robado.


Comenzamos

1º Paso

Código:
Ir al Admin CPanel > Plantilas y Estilos > Estilos > Tu Estilo > Global.CSS > Hoja de Estilo Avanzado

Y al final colocan lo siguiente

Código:
#column1 {
        float:left;
        display:block;
        width: 250px;
        margin: 5px;
        padding: 20px 20px;
        -moz -border - radius: 3px;
    }

    #column2 {
        float:left;
        display:block;
        width: 250px;
        margin: 5px;
        padding: 20px 20px;
        -moz -border - radius: 3px;
    }

    #column3 {
        float:left;
        display:block;
        width: 250px;
        margin: 5px;
        padding: 20px 20px;
        -moz -border - radius: 3px;
    }
    
    #column4 {
    float:left;
    display:block;
    width: 250px;
    margin: 5px;
    padding: 20px 20px;
    -moz -border - radius: 3px;
    }
    
.Estilo1 {
    font-size: 24px;
    font-weight: bold;
}

Luego le dan Guardar y Listo.

2º Paso

Nos dirigimos ahora a

Código:
Plantillas > Tu Estilo > Plantillas de Pie o Footer

Y buscan la siguiente linea

Código:
This is free software, support us and we'll support you

debajo de ello colocaran lo siguiente

Código:
<div id="column1">
  <h1 class="Estilo1">Sobre BizarroL</h1>
  <HR align="left" width=100% class="Estilo1">
  <p>BizarroL es un usuario dedicado a compartir lo aprendido durante los a&ntilde;os que ha estado navegando en la red. </p>
  <p><strong><a href="http://foro.lagrihost.com/syndication.php?limit=15" original-title="Unete a la Sindicaci&oacute;n RSS">Subscribete a la Sindicaci&oacute;n RSS</a></strong>&nbsp;si quieres seguir sabiendo sobre mis aportes. </p>
  <p>Producido por MyBB &copy; 2013</p>
  <p>Creditos: <a href="www.inkaforos.lgns.com.ar"><strong>BizarroL</strong></a> </p>
</div>
<div id="column2">
        <h1 class="Estilo1">Afiliados</h1>
        <HR align="left" width=100% class="Estilo1">
        <p>- <a href="www.inkaforos.lgns.com.ar"><strong>InkaForos</strong></a></p>
        <p>- <a href="www.inkaforos.lgns.com.ar"><strong>BizarroL</strong></a> </p>
        <p>- <a href="www.mybb.com"><strong>MyBB</strong></a> </p>
        <p>- <a href="www.inkaforos.lgns.com.ar"><strong>Link 1</strong></a></p>
        <p>- <a href="www.inkaforos.lgns.com.ar"><strong>Link 2</strong></a></p>
        <p>- <a href="www.inkaforos.lgns.com.ar"><strong>Link 3 </strong></a></p>
</div>

    <div id="column3">
        <h1 class="Estilo1">Afiliados </h1>
        <HR align="left" width=100% class="Estilo1">
        <p align="left"> <a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a> <a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a></p>
        <p><a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a> <a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a></p>
</div>

    <div id="column4">
        <h1 class="Estilo1">Opinion</h1>
        <HR align="left" width=100% class="Estilo1">
        <p>Pues aqui ya no me alcanzo tiempo...se me junto el trabajo y peus tratare para la siguiente lo modificare y tratare de darles un mejor trabajo, aunque este solo sea un peque&ntilde;o ejemplo para poder modificar su footer de su foro a su gusto.</p>
        <p>Saludos </p>
</div>

Y tendran un footer o pie de pagina similar al de LagriHost, aqui les dejo un demo...

DEMO

No es nada del otro mundo fue sencillo de hacerlo, pero demora en publicarlo Sonrisa jajajaja

Creditos
BizarroL
Si te gusto algun tema puedes darle 1+ a mi Reputacion


#2
0
exelente aportación, gracias amigo por este tutorial, que sin duda alguna le servirá a más de uno
la música nó se escucha con los oídos, sino con el corazón

#3
0
Pensé que tendría imagenes del Antes y Despues, de todos modos es un gran aporte aunque mi pasión es mas con SMF, pero deseguro alguien lo pilla Sonrisa

#4
0
Hola amigo me parese muy bueno el footer pero lo hise la siguiente mandera por que en el tuto que pusistes es muchos pasos xd

lo que hise haser

Código:
Plantillas > Tu Estilo > Plantillas de Pie o Footer

Y buscan la siguiente linea
Código:
This is free software, support us and we'll support you

debajo de ello colocaran lo siguiente

Código PHP:
<style type="text/css">
<!--
#column1 {
        
float:left;
        
display:block;
        
width250px;
        
margin5px;
        
padding20px 20px;
        -
moz -border radius3px;
    }

    
#column2 {
        
float:left;
        
display:block;
        
width250px;
        
margin5px;
        
padding20px 20px;
        -
moz -border radius3px;
    }

    
#column3 {
        
float:left;
        
display:block;
        
width250px;
        
margin5px;
        
padding20px 20px;
        -
moz -border radius3px;
    }
    
    
#column4 {
    
float:left;
    
display:block;
    
width250px;
    
margin5px;
    
padding20px 20px;
    -
moz -border radius3px;
    }
    
.
Estilo1 {
    
font-size24px;
    
font-weightbold;
}
-->
</
style>
<
div id="column1">
  <
h1 class="Estilo1">Sobre BizarroL</h1>
  <
HR align="left" width=100% class="Estilo1">
  <
p>BizarroL es un usuario dedicado a compartir lo aprendido durante los a&ntilde;os que ha estado navegando en la red. </p>
  <
p><strong><a href="http://foro.lagrihost.com/syndication.php?limit=15" original-title="Unete a la Sindicaci&oacute;n RSS">Subscribete a la Sindicaci&oacute;n RSS</a></strong>&nbsp;si quieres seguir sabiendo sobre mis aportes. </p>
  <
p>Producido por MyBB &copy2013</p>
  <
p>Creditos: <a href="www.inkaforos.lgns.com.ar"><strong>BizarroL</strong></a> </p>
</
div>
<
div id="column2">
        <
h1 class="Estilo1">Afiliados</h1>
        <
HR align="left" width=100% class="Estilo1">
        <
p>- <a href="www.inkaforos.lgns.com.ar"><strong>InkaForos</strong></a></p>
        <
p>- <a href="www.inkaforos.lgns.com.ar"><strong>BizarroL</strong></a> </p>
        <
p>- <a href="www.mybb.com"><strong>MyBB</strong></a> </p>
        <
p>- <a href="www.inkaforos.lgns.com.ar"><strong>Link 1</strong></a></p>
        <
p>- <a href="www.inkaforos.lgns.com.ar"><strong>Link 2</strong></a></p>
        <
p>- <a href="www.inkaforos.lgns.com.ar"><strong>Link 3 </strong></a></p>
</
div>

    <
div id="column3">
        <
h1 class="Estilo1">Afiliados </h1>
        <
HR align="left" width=100% class="Estilo1">
        <
p align="left"> <a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a> <a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a></p>
        <
p><a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a> <a href="www.inkaforos.lgns.com.ar"><img src="http://i.imgur.com/28LCu.jpg" alt="MapleOnly" width="95" height="100" border="2"/></a></p>
</
div>

    <
div id="column4">
        <
h1 class="Estilo1">Opinion</h1>
        <
HR align="left" width=100% class="Estilo1">
        <
p>Pues aqui ya no me alcanzo tiempo...se me junto el trabajo y peus tratare para la siguiente lo modificare y tratare de darles un mejor trabajoaunque este solo sea un peque&ntilde;o ejemplo para poder modificar su footer de su foro a su gusto.</p>
        <
p>Saludos </p>
</
div

DEMO :

[Imagen: 6vWXHzv.png]



Posibles temas similares...
Tema Autor Respuestas Vistas Último mensaje
  Como poner Publicidad en todo el foro Kevin Alfonso 5 1,096 08-12-2015, 11:37 PM
Último mensaje: Kevin Alfonso
  Como poner portal en el foro? DRAKO 3 1,135 05-07-2014, 04:33 AM
Último mensaje: Nafko
  ¿Cómo solucionar este pequeño problema con ProStats? AndresXZ09 9 1,904 06-06-2014, 02:03 AM
Último mensaje: Nafko
  Solucionado ¿Cómo subir un plugin a mi foro? mariana 4 1,274 12-04-2014, 11:15 PM
Último mensaje: mariana
  ¿Como borrar todos los mensajes de un usuairo? loko714 1 902 30-03-2014, 01:57 PM
Último mensaje: Kevinex



Usuarios navegando en este tema:
1 invitado(s)


Forum software by © MyBB Theme © Kevinex & iAndrew 2018