Guías Banners Publicitarios para PRGOV

  Banner Publicitario Principal 

  Tamaño 1024 x 329 pixels
  Formato JPG / PNG

  Banner Publicitario parte inferior

  Tamaño 957 x 325 pixels
  Formato JPG / PNG

  Banner Publicitario cuadrado

  Tamaño 285 x 285 pixels
  Formato JPG / PNG

  Banner Publicitario tipo Boton

  Tamaño 300 x 114 pixels
  Formato JPG / PNG

___________________________________________________________________________________________

Guías Proyecto RESC

Información General

Boostrap 3

Debe utilizar e incluir el framework de Boostrap 3 que puede descargar aquí. Deberá utilizar solo los elementos y estilos encontrados en el framework por defecto.

Fuente o Font

El Font o Fuente a utilizar en la aplicación o página será: MONTSERRAT , el cual es de uso libre y provista por Google Fonts. Puede incluir es siguiente código en el header de su página:

<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>

Iconograía

Si se utiliza algún tipo de iconografía en la aplicación o página deben de utilizar los iconos y framework provistos por Fontawsome.io ya que son de libre uso. pueden incluir en el header el siguiente código:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

Barra Gubernamental

Para mostrar la barra gubernamental en su sitio web coloque el siguiente código justo luego del <body> de su página

<script type="text/javascript" id="tbs">
!function(){var t=document.createElement("div");t.id="prTopBanner",t.style.width="100%",t.style.margin="0 auto 5px auto; z-order:5000",t.className="prTopBanner";var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src=("https:"==document.location.protocol?"https://":"http://")+"www2.pr.gov/scripts/prGovTopBanner.js";var r=document.getElementById("tbs");r.parentNode.insertBefore(e,r),r.parentNode.insertBefore(t,r)}();
</script>

Header y Footer PR.Gov

Si desea que su sitio web o aplicación cuente con la misma apariencia visual de pr.gov, utilice los siugientes códigos en su plicación o página.

Header - coloque el siguiente código luego del <body> de su aplicación o página

<script type="text/javascript" id="getHeader">
var title="Pass Aplication Title or Name Here",
description="Pass Description Here";
!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src=("https:"==document.location.protocol?"https://":"http://")+"www2.pr.gov/scripts/2016/prGovHeader.min.js";var t=document.createElement("div");t.id="prGovHeader",t.style.width="100%",t.className="prGovHeader",t.setAttribute("data-title",title),t.setAttribute("data-desc",description);var r=document.getElementById("getHeader");r.parentNode.insertBefore(e,r),r.parentNode.insertBefore(t,r)}();
</script>

Si necesita pasar el titulo y descripción de la aplicación o página puede hacerlo mediante las variables provistas: Vista de las variables titulo y descripción

Footer - coloque el siguiente código justo antes del cierre </body> de su aplicación o página

<script type="text/javascript" id="getFooter">
!function(){var t=document.createElement("div");t.id="prGovFooter",t.style.width="100%",t.className="foot";var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src=("https:"==document.location.protocol?"https://":"http://")+"www2.pr.gov/scripts/2016/prGovFooter.min.js";var o=document.getElementById("getFooter");o.parentNode.insertBefore(e,o),o.parentNode.insertBefore(t,o)}();
</script>

Contenido Principal de la página

El contenido principal de su pagina debe contar con el siguiete estilo:

#Id .oClse{
width: auto;
max-width: 980px;
padding: 0px 15px;
margin: 0px auto;
}

"Mock up" de demográficos "One Stop Shop"