Como agregar Font Awesome a mi Página Joomla 3.0
Publicado: Mié Ene 13, 2016 1:44 pm
Hoy explicaré de una manera muy sencilla los pasos que debemos seguir para incorporar Font Aseewome a una plantilla Joomla elaborada con la versión 3.0 o mayor.
Antes de continuar sería bueno leyeras el siguiente tema que publique en este Foro hace un tiempo, Click aquí para leer
Paso #01
Descarga FontAsewome desde su página Oficial Clic Para Descargar
Pasó #02
Copia la versión Font Asewome que descargaste dentro del directorio de la plantilla Joomla que utilizas.
Ejemplos:
Paso #03
Descomprime el archivo font-awesome-4.5.0.zip
Ejemplo:
Edita el Archivo /templateDetails.xml
Dentro de las etiquetas <files></files> del archivo templateDetails.xml Agrega las etiquetas <folder></folder> y en el medio de estas el nombre de tu nuevo directorio, en este caso la carpeta que surge luego de descomprimir .
Recuerde: Que el nombre del directorio puede variar según la versión de Font Asewome que descargaste.
Ahora sólo resta Editar el index.php de la plantilla con la cual trabajaste la página web.
En el archivo index.php deberás agregar la siguientes lineas:
Observa como quedará tu plantilla
Antes de continuar sería bueno leyeras el siguiente tema que publique en este Foro hace un tiempo, Click aquí para leer
Paso #01
Descarga FontAsewome desde su página Oficial Clic Para Descargar
Pasó #02
Copia la versión Font Asewome que descargaste dentro del directorio de la plantilla Joomla que utilizas.
Ejemplos:
Código: Seleccionar todo
cp -r font-awesome-4.5.0.zip www.tu-pagina.com/templates/tu-plantilla/
Código: Seleccionar todo
cp -r font-awesome-4.5.0.zip /var/www/tu-directorio-web/templates/protostar/
Descomprime el archivo font-awesome-4.5.0.zip
Ejemplo:
Código: Seleccionar todo
unzip font-awesome-4.5.0.zip
Dentro de las etiquetas <files></files> del archivo templateDetails.xml Agrega las etiquetas <folder></folder> y en el medio de estas el nombre de tu nuevo directorio, en este caso la carpeta que surge luego de descomprimir .
Código: Seleccionar todo
<folder>font-awesome-4.5.0</folder>
Ahora sólo resta Editar el index.php de la plantilla con la cual trabajaste la página web.
En el archivo index.php deberás agregar la siguientes lineas:
Código: Seleccionar todo
$doc->addStyleSheet('templates/' . $this->template . '/font-awesome-4.5.0/css/font-awesome.css');
$doc->addStyleSheet('templates/' . $this->template . '/font-awesome-4.5.0/css/font-awesome.min.css');
Observa como quedará tu plantilla
Código: Seleccionar todo
<?php
// Add JavaScript Frameworks
JHtml::_('bootstrap.framework');
$doc->addScript('templates/' . $this->template . '/js/template.js');
// Add Stylesheets
$doc->addStyleSheet('templates/' . $this->template . '/css/template.css');
// Menu web
$doc->addStyleSheet('templates/' . $this->template . '/css/menuu.css');
// Estilos Personalizados
$doc->addStyleSheet('templates/' . $this->template . '/css/estilos.css');
//font-awesome-4.4.0
$doc->addStyleSheet('templates/' . $this->template . '/css/font-awesome-4.5.0/css/font-awesome.css');
$doc->addStyleSheet('templates/' . $this->template . '/css/font-awesome-4.5.0/css/font-awesome.min.css');
// Load optional RTL Bootstrap CSS
JHtml::_('bootstrap.loadCss', false, $this->direction);