Sustitución de los iconos de font existentes

Algunos de los iconos de la aplicación se visualizan utilizando fuentes de iconos. Estos iconos se pueden sustituir por iconos personalizados.

Para sustituir los iconos de font existentes, realice los pasos siguientes:
  1. Generar fuentes de icono personalizadas. Puede generar las fuentes de icono a partir de imágenes personalizadas.
    Nota: Asegúrese de que cada imagen personalizada tenga el mismo nombre que el icono correspondiente que desea sustituir en la aplicación.
  2. Copie todos los formatos de font generados (.ttf, .svg, .eot, .woff) en la carpeta <RUNTIME>/theme/fonts .
  3. Copie el CSS de los fonts de icono generados en el archivo 'extn-app-store.scss' y asegúrese de que el URL de font en el CSS apunte a la ubicación de los archivos de font (.ttf, .svg, .eot, .woff) .
    Notas:
    • Puesto que los nombres de icono utilizados al generar el font son los mismos que los nombres de icono de la aplicación, es importante que actualice el CSS con el font-family personalizado del que se debe seleccionar el nuevo icono.
    • No sustituya el font-family predeterminado en el CSS por el font-family personalizado, ya que sustituirá los iconos de font de aplicación predeterminados.
  4. Pruebe la personalización.
Fragmento de código de ejemplo para sustituir los iconos de font existentes:
/* Specifying the custom icon font details */
   @font-face {
    font-family: 'custom-glyphicons';
    src: url('../fonts/custom-glyphicons.eot?uxyslh');
    src: url('../fonts/custom-glyphicons.eot?uxyslh#iefix') format('embedded-opentype'),
    url('../fonts/custom-glyphicons.ttf?uxyslh') format('truetype'),
    url('../fonts/custom-glyphicons.woff?uxyslh') format('woff'),
    url('../fonts/custom-glyphicons.svg?uxyslh#custom-glyphicons') format('svg');
    font-weight: normal;
    font-style: normal;
    }
/* Specifying the font-family to display the icons */ 
    .app-icon-findProducts_generic_02:before{
    content: "\e900";
    font-family: 'custom-glyphicons' !important;
    }