viernes, 21 de mayo de 2021

Iconos web Font Awesome

Para nuestros proyectos web, un recurso muy utilizado son los iconos de Font Awesome.

A la hora de desarrollar un proyecto en base a un diseño, la mayoría de veces tenemos que implementar muchas imágenes, ésto hace que nuestra web sea más pesadas, ya que el uso de archivos tipo png o jpg, ocupan demasiado espacio en nuestro proyecto.
Actualmente existen varias webs donde podremos encontrar la mayoría de estos iconos en formato fuente.

¿Usar los iconos en formato fuente? 

Pues, que estos iconos son una especie de tipografía como cuando utilizamos en cualquier programa de edición de texto alguna fuente como Time News Roman, Arial...

 Aquí es donde entra los iconos de Font Awesome, como tantos otros.

Para poder usarlo en nuestra web, lo primero que tenemos que hacer es irnos a su web que es:

https://fontawesome.com/




















Posteriormente pulsamos en Start for Free





















En el hueco escribimos nuestro email y nos mandará un acceso para podernos registrar.

Que posteriormente lo que nos dirá es como implementarlo en nuestra web y es poniendo dentro del head el siguiente script:

<script src="https://kit.fontawesome.com/a6bcff7e8f.js" crossorigin="anonymous"></script>

A continuación he realizado el siguiente archivo html que es muy simple:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
    <script src="https://kit.fontawesome.com/a6bcff7e8f.js" crossorigin="anonymous"></script>
</head>

  <body>
  <div class="container mt-5 bg-dark p-2">
  <a href="" class="btn btn-success p-2"><i class="fas fa-thumbs-up mr-2 "></i>Aceptar</a>
  </div>
    
    <div class="container mt-5 bg-primary p-2">
  <a href="" class="btn btn-success p-2"><span class="fab fa-wordpress-simple fa-4x fa-rotate-180 p-2"></span></i>Cancelar</a>
  </div>
    
  </body>
</html>


Aquí como se puede observar he puesto bootstrap y font awesome.

¿Cómo elegir nuestro icono?

Nos vamos a la web de font awesome, y pinchamos en icons

Posteriormente pinchamos en Free que se encuentra a nuestra izquierda, y nos saldrá los iconos gratuitos. 


















Posteriormente escribimo para encontrar un icono que deseemos, escribir el nombre en ingles.












Seguidamente pinchamos en el icono elegido



Posteriormente pinchamos en el botón Start Using This Icon,



En esta imagen, a la derecha del recuadro negro, existe un boton para copiar el código html, y ese código será necesario para ver dicho icono en nuestra web.

También podermos cambiar el tamaño del icono añadiendo algunos de éstos:

fa-xs, fa-sm, fa-lg, fa-2x, fa-3x, fa-4x, fa-5x.....

¿Podemos rotar los iconos?

También se pueden rotar añadiendo alguna clase:

fa-rotate-90, fa-rotate-180, fa-rotate-270, fa-flip-horizontal, fa-flip-vertical, fa-flip-both

Hemos puesto el icono dentro de las etiquetas <a></a> que son las del enlace tipo botón.

Con el código anterios así nos ha quedado, simplemente es un ejemplo para pode ver los iconos.







domingo, 16 de mayo de 2021

Identificación Ganado Bovino (4ª Parte)

 Continuamos con la normativa de identificación de la especie bovina, que recordemos que la norma que lo regula es Real Decreto 1980/1998, de 18 de septiembre, por el que se establece un sistema de identificación y registro de los animales de la especie bovina. 

Vamos a ve los Anexos de la norma.

En el Anexo 2 sobre el Documento de identificación para bovino.

Documento de identificación para bovino.

 Características: Papel offset de 120 gramos. 

Dimensiones: Ancho, 21 cm/alto, 14,75 cm. Simbología de los códigos de barras: Code 128.Set A.

Código superior: Lleva el número de identificación (crotal) con letras y números, pero sin espacios ni guiones. 

Código medio: Lleva el código REGA de la explotación de su propietario, con letras y números. 

Código inferior: Lleva los datos imprescindibles del animal con el formato CCCCCCCCCCCCCC/DDMMAAAASSRRRR/CCCCCCCCCCCCCC, donde: 

CCCCCCCCCCCCCC es el número de identificación del animal,/es un separador. 

DDMMAAAA es la fecha de nacimiento del animal (día, mes, año), sin separadores. 

SS es el código del sexo del animal establecido por los protocolos técnicos acordados en el Comité nacional de coordinación de identificación del ganado y registro de explotación de las especies de interés ganadero establecido en el Real Decreto 479/2004. 

RRRR es el código de raza del animal establecido por los protocolos técnicos acordados en el Comité nacional de coordinación de identificación del ganado y registro de explotación de las especies de interés ganadero establecido en el Real Decreto 479/2004,/es un separador. 

CCCCCCCCCCCCCC es el código de la madre. 

Nota: Como máximo llevará una longitud de 44 caracteres (cuando el crotal de la madre sea de 14 caracteres), pero será menor si el crotal tiene una longitud menor. Contenido: De acuerdo con los siguientes modelos:































EL Anexo 3. Documento de identificación para bovinos objeto de intercambio con otros Estados miembros de la UE.

Documento de identificación para bovinos objeto de intercambio con otros Estados miembros de la Unión Europea.

Características: Papel offset de 120 gramos. Dimensiones: Ancho, 21 cm/alto, 14,75 cm. Simbología de los códigos de barras: Code 128.Set A. 

Código superior: Lleva el número de identificación (crotal) con letras y números, pero sin espacios ni guiones. 

Código medio: Lleva el código REGA de la explotación de su propietario, con letras y números. 

Código inferior: Lleva los datos imprescindibles del animal con el formato CCCCCCCCCCCCCC/DDMMAAAASSRRRR/CCCCCCCCCCCCCC, donde: 

CCCCCCCCCCCCCC es el número de identificación del animal,/es un separador.

DDMMAAAA es la fecha de nacimiento del animal (día, mes, año), sin separadores. 

SS es el código del sexo del animal establecido por los protocolos técnicos acordados en el Comité nacional de coordinación de identificación del ganado y registro de explotación de las especies de interés ganadero establecido en el Real Decreto 479/2004. 

RRRR es el código de raza del animal establecido por los protocolos técnicos acordados en el Comité nacional de coordinación de identificación del ganado y registro de explotación de las especies de interés ganadero establecido en el Real Decreto 479/2004,/es un separador. 

CCCCCCCCCCCCCC es el código de la madre. Nota: Como máximo llevará una longitud de 44 caracteres (cuando el crotal de la madre sea de 14 caracteres), pero será menor si el crotal tiene una longitud menor. 

Contenido: De acuerdo con el siguiente modelo:



















sábado, 15 de mayo de 2021

¿Es necesario un Distintivo para identificar nuestro Alojamiento Turístico?

 La respuesta es que Si.

De acuerdo con la normativa de turismo de la Junta de Andalucía que es la Ley 13/20011, de 23 de diciembre, del Turismo de Andalucía, en su artículo 24 nos habla de las obligaciones generales que son las siguientes:

Serán obligaciones generales de las empresas turísticas las siguientes:

a) Publicitar los precios finales completos de todos los servicios que se oferten, incluidos los impuestos, desglosando, en su caso, el importe de los incrementos o descuentos que sean de aplicación a la oferta y los gastos adicionales que se repercutan a la persona usuaria.

b) Expedir factura desglosada y con el contenido previsto en la normativa vigente de los servicios prestados, de acuerdo con los precios ofertados o pactados.

c) Cuidar del buen funcionamiento de los servicios y del correcto mantenimiento de todas las instalaciones y equipamientos del establecimiento.

d) Velar por la seguridad, intimidad, tranquilidad y comodidad de las personas usuarias del servicio turístico, asegurando que reciban un buen trato por parte del personal de la empresa.

e) Informar a las personas usuarias, de forma clara e inequívoca, de cualquier riesgo previsible que pudiera derivarse de la prestación de los servicios o del uso de las instalaciones, así como de las medidas de seguridad adoptadas.


f) Prestar los servicios conforme a la categoría del establecimiento, de acuerdo con los términos contratados, con la publicidad emitida al respecto y con lo dispuesto en las reglamentaciones correspondientes.

g) Exhibir, en lugar visible, conforme a lo establecido en la normativa correspondiente, los distintivos acreditativos de la clasificación del establecimiento.

h) Tener a disposición y facilitar a las personas usuarias de servicios turísticos las hojas de quejas y reclamaciones oficiales en materia de consumo.

i) Colaborar con la Unidad para la Asistencia al Turista en la resolución de las quejas y conflictos que surjan en relación con los servicios prestados e incorporar las mejoras y buenas prácticas que les sean trasladadas por la Unidad.

j) Facilitar a la Administración la información y documentación preceptiva para el correcto ejercicio de las atribuciones que legal y reglamentariamente le correspondan, y, en particular, a los servicios de inspección turística en el ejercicio de sus funciones.

k) Prestar los servicios conforme al principio de sostenibilidad, respetando y protegiendo el entorno medioambiental, el patrimonio histórico y cultural y los recursos turísticos de Andalucía en el ejercicio de sus actividades.

l) Obtener, con carácter previo a su funcionamiento, las autorizaciones que sean preceptivas de acuerdo con lo dispuesto en la legislación sectorial aplicable, en su caso.

Como vemos en dicho articulo las obligaciones generales que tienen estos tipos de establecimientos, exactamente en el Punto G, nos dice:

Exhibir, en lugar visible, conforme a lo establecido en la normativa correspondiente, los distintivos acreditativos de la clasificación del establecimiento.

Por lo que todos los establecimientos tienen que tener en lugar visibles los distintivos acreditativos dependiendo de la clasificación de nuestro establecimiento.

¿Dónde se hacen esos distintivos?

En la propia Delegación de Turismo nos informan de los lugares autorizados, sé que en Huelva existe uno, y para poder realizarlo, por supuesto solicitan la autorización de turismo, como debe ser normal.



martes, 4 de mayo de 2021

¿Qué es un snippets de Sublime Text?

 Los snippets en Sublime Text es la forma fácil de crearnos unos archivos de plantillas. Éstos se guardan en nuestro editor con extensión ".sublime-snippet", y al ser una especie de plantillas no ayuda mucho en el trabajo para desarrollar nuestros páginas web.

A estos archivos podemos acceder mediante una llamada predefinida.

Vamos a realizar un snippet que nos incluya bootstrap, para ello lo primero que debemos hacer es abrir nuestro Sublime Text, nos vamos a la pestaña de Tools, y dentro de esta pestaña nos vamos a Developer, y dentro de las opciones que nos da pinchamos en New Snippet.











Lo primero es que el código que vamos a insertar debe estar entre los corchedes después de [CData[ y por supuesto antes del corchete de cierre.

En nuestro caso vamos a insertar el siguiente código:

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link rel="stylesheet" href="css/bootstrap.min.css">

    <link rel="stylesheet" href="css/font-awesome.min.css">

<link href="https://fonts.googleapis.com/css?family=Italianno|Lato:400,700,900|Raleway:400,700,900" rel="stylesheet">

    <link rel="stylesheet" href="css/styles.css">

  </head>

  <body>


  <script src="js/jquery.slim.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384- ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>

   <script src="js/bootstrap.min.js"></script>

    <script src="js/scripts.js"></script>

  </body>

</html>


Esta plantilla para incluir en local bootstrap4, los iconos font-awesome y como siempre un archivo de css. Y en la parte de abajo tenemos el script que nos incluye jquery, popper, bootstrap, y otro archivo de scripts que siempre incluyo.

Quedándonos así:










Después de la etiqueta del cierre del content hemos escrito lo que sigue:

<tabTrigger>plantilla_bootstrap</tabTrigger>

plantilla_bootstrap será el nombre con el que llamaremos tanto el snippet como las palabras que escribiremos para que se nos cargue la plantilla.

Seguidamente nos iremos a File y Save As, y le pondremos dicho nombre al archivo que cogerá la extensión sublime-snippet

¿Cómo accederemos a nuestra plantilla?

A continuación crearemos una archivo nuevo y lo guardaremos con la extensión html, seguidamente en la primera lina del archivo escribiremos las palabras con las que accederemos a la misna que en nuestro caso eran plantilla_bootstrap.


Posteriormente le daremos a tabulador y nos mostrará nuestra plantilla creada.