Cómo usar, generar y trabajar con las URLs amigables o limpias en CodeIgniter 3: Url_title()

- Andrés Cruz

Cómo usar, generar y trabajar con las URLs amigables o limpias en CodeIgniter 3: Url_title()

Las URL amigables son requeridas por casi cualquier aplicación que quiera posicionarse y de esta manera obtener tráfico orgánico de los buscadores, también es un buen uso que le damos los internautas o usuarios comunes ya que al quedar la URL que visitamos en el historial de nuestro navegador, cuando queramos acceder a esa página que visitamos anteriormente se nos hará muchos más fácil acceder al mismo porque podemos emplear el autocompletado de los navegadores en base al historial que se registra de las páginas que hemos visitado en vez de emplear los típicos ID que empleabamos antes; veamos un ejemplo práctico:

  • Url sucia: http://myblog.net/blog/57
  • Url más sucia: http://myblog.net/blog?id=57
  • URL amigable: http://myblog/blog/vue-basico-en-30-minutos-que-es-vue-para-que-nos-sirve-y-ejemplos-de-vue

Ahora si queda más claro todo el asunto y ya como que el asunto se explica hasta solo, aparte de darle unos datos extras a los buscadores como Google, también es más entendible para nosotros, los humanos que somos los que consumimos estos contenidos y se nos hace más fácil relacionar el título de una publicación o entrada a aprendernos el id de lo que estamos buscando..

Generar URL limpias o amigables en CodeIgniter es muy, pero muy facil ya no tenemos todo listo, mediante un simple helper tenemos todo el trabajo, asi de facil com veremos a continuación.

url_title permite crear URLs amigables que nos favorece al momento del SEO, esto es útil si tenemos un blog y se quiere utilizar algún texto identificados en las URLs como el título principal; funciona eliminando cualquier carácter que no sea alfanumérico exceptuando el espacio que lo reemplaza por el carácter gión ('-') o cualquier otro que se defina.

Ejemplo de url_title en CodeIgniter

Veamos un ejemplo de su uso más básico

<?php 

$titulo = "Este es el título principal de mi artículo";
$titulo_url = url_title($titulo);
echo $titulo_url;
// imprime... Este-es-el-titulo-principal-de-mi-articulo
?>

Sencillo no; ¿pero qué pasa si queremos cambiar el delimitador '-' por '_'?, simplemente le pasamos un segundo parámetro a la función; algo como:

<?php 

$titulo = "Este es el Titulo principal de mi posts";
$titulo_url = url_title($titulo,'_');
echo $titulo_url;

// imprime... Este_es_el_Titulo_principal_de_mi_posts
?>

¿Y si queremos que no se distinga entre mayuscula y minuscula?, es decir toda la frase en minúscula

Para eso es el tercer parámetro:

<?php 

$titulo = "Este es el Titulo principal de mi posts";
$titulo_url = url_title($titulo,'_',TRUE);
echo $titulo_url;
// imprime... este_es_el_titulo_principal_de_mi_posts
?>

Así que ya tenemos parte del trabajo, pero puede que aun estes un poco enredado sobre cómo emplear esto en tus controladores, como ya debes saber si eres desarrollador, generalmente buscamos todo por los identificadores o IDs de la tabla que son los que genera MySQL o cualquier otro motor de base de datos por defecto que estemos empleando los Primary Key, que es la que llamamos URL sucia anteriormente.

También podemos hacer búsquedas por campos que no sean los identificadores de la tabla

Pero también podemos hacer otros tipos de búsquedas que no sean por ese ID si no por nuestra flamante URL limpia, que es una buena idea almacenarla en nuestra bd y no consultarla bajo de manda, por si cambiamos el título de nuestra entrada, cambiaría por lo tanto la URL Limpia y para los ojos de Google u otros buscadores esta sería una entrada completamente nueva, que NO es lo que queremos, porque de esta forma perderíamos fuerza de posicionamiento y Google tendría que indexar y posicionar desde cero nuestra entrada y esto es malisimo para nosotros, así que si cambias el título lo recomendado es que no cambies la URL limpia.

Y si necesitamos cambiar la URL limpia de nuestra entrada y no perder tráfico

Ahora si necesitas variar la URL, puedes hacer unas reglas en tu htaccess o hacer tu propio sistema e ir guardando en un historial las URLs que ya has empleado y que han variado en tu blog y asociarlas con el ID de una publicación; por ejemplo yo hice algo similar con las URLs que antes empleaba en donde antes colocaba el identificador:

public function tema($article_id = NULL) {

	//***data to theme
	$article = $dataTheme["article"] = $this->article->get_by_id($article_id);

	// if the article not exits 404
	if (!isset($article)) {
		show_404();
		return;
	}

	redirect("blog/$article->url_clean", "location", 301);
}

Como puedes ver en el código anterior, este es un sencillo esquema que puedes implementar, si la publicación que viene, corresponde al identificador de la entrada, busca en la base de datos si existe ese número, si no existe un 404, si existe redirigimos al nuevo esquema, que explicamos a continuación; un punto importante es el 301 que es un código de cabecera HTTP que indica que el recurso fue migrado a otro lado de forma permanente, el recurso sería la entrada, y le dice a los navegadores como Google que mantenga la fuerza de posicionamiento de esa entrada con ese antiguo acceso con esa "url sucia" y que la adaptamos a una nueva; asi de simple, si no pones el 301 estás perdiendo toda la fuerza de posicionamiento que tuviera esa entrada al momento de hacer la redirección y no es lo que queremos.

URLs limpias en nuestros blog y sistema en general con CodeIgniter:

En esta siguiente sección les vamos a guiar sobre cómo podemos emplear esta característica que nos trae CodeIgniter sin ningún problema en nuestro sistemas; vamos a partir del hecho que es un blog, que es lo más común pero puedes adaptarlo a cualquier otro sistema; por ejemplo, la tabla de las entradas puede ser como la siguiente en la mayoría de los casos que no emplee las URL limpias:

Cambios en la base de datos:

CREATE TABLE IF NOT EXISTS `posts` (
`post_id` int(11) NOT NULL,
  `title` varchar(255) NOT NULL,
  `content` text NOT NULL,
  `description` varchar(100) NOT NULL,
  `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  `image` varchar(100) NOT NULL,
  `posted` enum('si','no') NOT NULL DEFAULT 'no'
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Ahora nosotros añadimos un nuevo campo llamado url_clean, aunque ponle el nombre que quieras, adapta la longitud, ya 255 es bastante grande pero allí está:

CREATE TABLE IF NOT EXISTS `posts` (
`post_id` int(11) NOT NULL,
  `title` varchar(255) NOT NULL,
  `url_clean` varchar(255) NOT NULL,
  `content` text NOT NULL,
  `description` varchar(100) NOT NULL,
  `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  `image` varchar(100) NOT NULL,
  `posted` enum('si','no') NOT NULL DEFAULT 'no'
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Cambios en la vista del módulo administrador:

Sería agregar nuestro nuevo campo; aquí estamos empleando un poco el código de Bootstrap, pero sencillamente colocamos un input con la del nuevo campo, url_clean:

<div class="form-group">
    <?php
    echo form_label('Url limpia', 'url_clean');
    ?>
    <?php
    $text_input = array(
        'name' => 'url_clean',
        'id' => 'url_clean',
        'value' => $url_clean,
        'class' => 'form-control input-lg',
    );

    echo form_input($text_input);
    ?>
</div>

Cambios en el controlador del módulo administrador:

Aquí hacemos el proceso completo, guardando otros campos como el contenido, el título, la descripción y si esta publicado o no, pero tu emplea tus campos a registrar; además en el controlador vamos a llamar a la función para hacer la URL amigable sobre el campo limpio de la URL de la siguiente forma empleando el helper en cuestión; vea que es necesario importarlo para poder emplearlo:

$this->load->helper('url');

$url_clean = $this->input->post('url_clean');

if ($url_clean !== "") {
	$url_clean = $this->input->post('url_clean');
} else {
	// no hay una url limpia suministrada empleamos el titulo
	$url_clean = url_title($this->input->post('title'));
}

$save = array(
	'title' => $this->input->post('title'),
	'content' => $this->input->post('content'),
	'description' => $this->input->post('description'),
	'url_clean' => $url_clean,
	'posted' => $this->input->post('posted')
);

if ($post_id == NULL) {
	// Id generado en la inserción
	$post_id = $this->Post->insert($save);
} else {
	$this->Post->update($post_id, $save);
}

Aquí como puedes darte cuenta, verificamos si el campo de la url limpia, es decir, url_clean está o no establecida, si lo está lo dejamos tal cual, pero si está vacío, empleamos el título de la publicación, pero lo limpiamos o generamos una URL amigable a partir del mismo:

Modelo para buscar por el campo url_clean

En nuestro modelo, debemos tener una consulta como la siguiente, en la cual pasamos la url limpia y buscamos por el mismo, como hacíamos antes con el identificador de la tabla pero esta vez con este campo.

function get_by_url_clean($url_clean = NULL) {
	return $this->db->get_where('article', array('url_clean' => $url_clean))->row();
}

Controlador del blog

En el controlador de cara al usuario, el que muestra el contenido de la entrada o publicación seleccionada por el usuario, podemos hacer algo como lo siguiente, como vemos en la acción que se encarga de cargar el contenido de la entrada, le pasamos una variable, que es la que recibimos mediante la URL; por ejemplo:

http://myblog/blog/view/vue-basico-en-30-minutos-que-es-vue-para-que-nos-sirve-y-ejemplos-de-vue

Tenemos un controlador llamado Blog y la acción llamada view que recibe un parámetro, que para nuestro ejemplo sería este fragmento de la URL:

vue-basico-en-30-minutos-que-es-vue-para-que-nos-sirve-y-ejemplos-d

Nuestro código sería así:

class Blog extends CI_Controller {
public function view($clean_url) {
...
$article = $this->article->get_by_url_clean($clean_url);
...
}
}

Y para nuestro ejemplo:

$clean_url = vue-basico-en-30-minutos-que-es-vue-para-que-nos-sirve-y-ejemplos-d

Y luego llamamos a la función de nuestro modelo que mostramos anteriormente; así de fácil.

Conclusiones

En esta entrada vimos cómo emplear un componente fundamental para el SEO, como lo es las URLs limpias en nuestro sistema, que no tiene que se un blog como usamos en nuestro ejemplo, puede ser cualquier otro sistema, pero la idea básica es la que mostramos en esta entrada; esta es una de las cosas que evidencia la sencillez que nos permite CodeIgniter para hacer cosas como esta.

CodeIgniter es un framework que según mi punto de vista es amigable con el SEO, es un framework con un tiempo de carga rápido, con URL limpias ya por defectos que podemos emplear una vez que removamos el Quitar el index.php de la URL en CodeIgniter estamos listos para empezar a trabajar con Codeigniter.

Andrés Cruz

Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz en Udemy

Acepto recibir anuncios de interes sobre este Blog.