1 Plantillas
kleper edited this page 2018-07-01 17:07:18 -05:00

Ejemplos de plantillas utilizadas en algunos de los proyectos de Tupale.

Estas plantillas utilizan CSS3 y HTML5, las plantillas utilizan los campos asociados a cada formulario para utilizarlas debe cambiar los ID de los campos asociados a cada plantilla.

Plantillas Red de Huerteros.

Base de datos de Huertas

Mapa

Plantilla utilizada para las fichas del mapa: https://redhuerteros.org/milfs/map.php?id=43

<div class='alert alert-success'>
  <div  class= ' row'> 
    <div class='col-sm-4'>
      <img  class='img img-responsive img-rounded' src='images/secure/?file=300/$campo[220]'  /> 
      <br>
  <a class='btn btn-success' href='http://redhuerteros.org/I$control' target=_blank> Compartir </a> 
<a target ='redes' class='btn btn-success'href='http://twitter.com/share?url=$_SESSION[site]i$control&text=$campo_limpio[222] /  $campo_limpio[504]  @RedHuerteros'>
<i class='fa fa-twitter'></i></a>
<a target ='redes' class='btn btn-success' href='https://www.facebook.com/sharer/sharer.php?u=$_SESSION[site]i$control'> <i class='fa fa-facebook'></i>
</a>
     </div>  
    <div class='col-sm-8'> 
    <ul class= ' list-unstyled'>
    <li class=' fa '><h2>  $campo_limpio[222] </h2></li>
   <br>
    <li class=' fa fa-info'><strong> Categoría de la Huerta: </strong>$campo_limpio[227] / $campo_limpio[505]  </li>
   <br>
    <li class=' fa fa-info'><strong> Comuna: </strong>$campo_limpio[504] </li>
   <br>
    <li ><i class=' fa fa-info'></i> <strong>Dirección:</strong> $campo_limpio[223] </li> 
    <li class=' fa fa-info'> <strong> Persona de Contacto: </strong> $campo_limpio[225]  </li> 
   <br>
    <li class=' fa fa-info'> <strong> Correo Electrónico: </strong> $campo_limpio[226]  </li>
    <br>
    <li class=' fa fa-info'> <strong> Teléfono de contacto: </strong> $campo_limpio[224]  </li>
   <br>
   <li><img src='http://qwerty.co/qr/?d=http://redhuerteros.org/i$control' alt='$control' title='' style='width:20%' ;='' class='img img-responsive img-rounded'>  </li>
   </ul>
   </div>
</div>
</div>

Landingpage

Ejemplo de plantilla: https://redhuerteros.org/I346c3ebbb0be517c3ae4bb46c4cd6142

<div >
  <div  class= 'row'> 
    <div class='col-sm-4'>
      <img  class='img img-responsive img-rounded' src='/milfs/images/secure/?file=300/$campo[220]'  /> 
      <br>
  <a class='btn btn-primary' href='http://redhuerteros.org/I$control' target=_blank> Compartir </a> 
<a target ='redes' class='btn btn-primary'href='http://twitter.com/share?url=https://redhuerteros.org/i$control&text=Conoce la huerta: $campo_limpio[222] / $campo_limpio[504]  @RedHuerteros'>
<i class='fa fa-twitter'></i>Twitter</a>
<a target ='redes' class='btn btn-primary' href='https://www.facebook.com/sharer/sharer.php?u=https://redhuerteros.org/i$control'>Facebook <i class='fa fa-facebook'></i>
</a>
     </div>  
    <div class='col-sm-8'> 
    <h2>  $campo_limpio[222] </h2>
    <ul class= ' list-group'>
    <li class='text-success'><strong> Categoría de la Huerta: </strong>$campo_limpio[227] / $campo_limpio[505]  </li>
    <li class='text-success'><strong> Comuna: </strong>$campo_limpio[504] </li>
    <li class='text-success'> <strong>Dirección:</strong> $campo_limpio[223] </li> 
    <li class='text-success'> <strong> Persona de Contacto: </strong> $campo_limpio[225]  </li> 
    <li class='text-success'> <strong> Correo Electrónico: </strong> $campo_limpio[226]  </li>
    <li class='text-success'> <strong> Teléfono de contacto: </strong> $campo_limpio[224]  </li>
    </ul>
    <img src='https://qwerty.co/qr/?d=http://redhuerteros.org/i$control' alt='$control' title='' style='width:20%' ;='' class='img img-responsive img-rounded'>
   </div>
</div>
</div>

Campo Relación


<div class='col-md-12 well well-sm'>
 <h2>$campo_limpio[222]</h2>
<a href='/milfs/images/secure/?file=600/$campo[220]' data-type='image' data-toggle='lightbox' data-title='' data-footer='$campo_limpio[222] '><img style='margin: 10px; float: left; max-width:50%' class='img img-responsive img-rounded' src='/milfs/images/secure/?file=150/$campo[220]'> </a>
<strong>Tipo de Huerta:</strong> $campo_limpio[227]   <br>
<strong>Comuna:</strong> $campo_limpio[504]   <br>
<strong>Barrio:</strong>$campo_limpio[505]  
</div>

Caracterización de Huertas

Ejemplo de plantilla: https://redhuerteros.org/Iae0da2dec7eb0c74409aafca3f93969f

<div class='col-md-12 panel panel-default'>

$campo[508]  

<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[523]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[523]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[524]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[524]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[525]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[525]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[526]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[526]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[527]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[527]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[528]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[528]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[529]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[529]
  </div>
</div>
<div class='col-sm-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[531]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[531]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[555]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[555]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[554]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[554]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[530]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[530]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[532]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[532]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[533]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[533]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[534]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[534]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[535]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[535]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[536]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[536]
  </div>
</div>
<div class='col-md-6 panel panel-success'>
  <div class='panel-heading'>
    <h3 class='panel-title'>$nombre[556]</h3>
  </div>
  <div class='panel-body'>
    $campo_limpio[556]
  </div>
</div>

<div class='col-md-12 alert alert-success'>
 <a class='btn btn-primary' href='http://redhuerteros.org/I$control' target=_blank> Compartir </a> 
<a target ='redes' class='btn btn-primary'href='http://twitter.com/share?url=https://redhuerteros.org/i$control&text=Más información sobre: $campo_limpio[222]   @RedHuerteros'>
<i class='fa fa-twitter'></i>Twitter</a>
<a target ='redes' class='btn btn-primary' href='https://www.facebook.com/sharer/sharer.php?u=https://redhuerteros.org/i$control'> <i class='fa fa-facebook'></i>Facebook
</a>
</div>

</div>

Enlaces de interes

Ejemplo de plantilla: https://redhuerteros.org/I4afe1370ed1c4315b015badb350ebd35

<div class='alert alert-success' style='word-wrap: break-word !important;'>
  <div  class= ' row'> 
    <div class='col-sm-4'>
      <img  class='img img-responsive img-rounded' src='/milfs/images/secure/?file=300/$campo[220]'  /> 
      <br>
  <a class='btn btn-primary' href='http://redhuerteros.org/I$control' target='_blank'> Compartir </a> 
<a target ='redes' class='btn btn-primary' href='http://twitter.com/share?url=https://redhuerteros.org/i$control&text=$campo_limpio[537] /  $campo_limpio[543]  @RedHuerteros'>
<i class='fa fa-twitter'></i> Twitter</a>
<a target ='redes' class='btn btn-primary' href='https://www.facebook.com/sharer/sharer.php?u=https://redhuerteros.org/i$control'> <i class='fa fa-facebook'> Facebook</i> </a>
    </div>  
    <div class='col-sm-8'> 
   <h2>  $campo_limpio[537] </h2>   
   <ul >
       <li ><strong> Enlace: </strong><a href='$campo_limpio[543]' target='_blank'> Visitar / Descargar: $campo_limpio[537]</a> </li>
       <li ><strong> Resumen: </strong>$campo_limpio[544] </li>
       <li ><strong>Fuente:</strong> $campo_limpio[697] </li> 
      <li > <strong> Etiquetas: </strong> $campo_limpio[539]  </li>
   </ul>
<img src='https://qwerty.co/qr/?d=https://redhuerteros.org/i$control' alt='$control' title='' style='width:20%' ;'' class='img img-responsive img-rounded center-block'>
   </div>
</div>
</div>

Resaltado

Ejemplo de plantilla: https://redhuerteros.org/e50

<div class='alert alert-success' style='word-wrap: break-word !important;'>
  <div  class= ' row'> 
    <div class='col-sm-4'>
      <img  class='img img-responsive img-rounded' src='/milfs/images/secure/?file=300/$campo[220]'  /> 
    </div>  
    <div class='col-sm-8'> 
   <h2>  $campo_limpio[537] </h2>   
   <ul >
       <li ><strong> Enlace: </strong><a href='$campo_limpio[543]' target='_blank'> Visitar / Descargar: $campo_limpio[537]</a> </li>
       <li ><strong> Resumen: </strong>$campo_limpio[544] </li>
       <li ><strong>Fuente:</strong> $campo_limpio[697] </li> 
      <li > <strong> Etiquetas: </strong> $campo_limpio[539]  </li>
   </ul>
   </div>
</div>
</div>

Plantilla tipo Blog

<div class='container-fluid'>
        <span class='badge'> $campo_limpio[153]  </span>
	<h2> $campo_limpio[729] | <small> $campo_limpio[771] </small></h2>
		<div style='max-width:20%; float:left; margin: 10px;'>
		<img  style='' class='img img-responsive img-rounded' src='milfs/images/secure/?file=300/$campo[728]'  />  
		</div>
		<div style='width:30%; float:right; margin: 10px;'>
		<strong class='text-warning'> $campo[726] </strong>
		</div>
	<p> $campo[727]  </p>
	<div style='max-width:20%; float:left; margin: 10px;'>
 $campo[23] 
        </div>
        
	<small class='clearfix' style='display:block;overflow: none;'>Publicacion: $fecha </small>
</div>

Plantilla ejemplo de blog

<div class='panel panel-primary'>
  <div class='panel-heading'>
    <a href='/milfs/images/secure/?file=full/$campo[713]' data-type='image' data-toggle='lightbox' data-title='' data-footer=' $campo_limpio[714] '><img style='margin: 10px; float: left; max-width:50%' class='img img-responsive img-rounded' src='/milfs/images/secure/?file=300/$campo[713]'> </a
    <h3 class='panel-title'><h2 >$campo_limpio[717]  </h2> </h3>
  </div>
  <div class='panel-body'>
$campo[716]  </div>
</div>

Plantilla ejemplo de Timeline

<li id='#$control' > 
<img  class='img img-responsive img-rounded' src='https://a.algoestapasando.cc/milfs/images/secure/?file=300/$campo[713]'  />
<h1>$campo[717]</h1>
<p>$campo[716]<p> 
</li>