---
title: "Zerif Lite: ¿Cómo cambiar los bordes circulares a bordes cuadrados?"
url: https://caribdis.net/2016/04/30/zerif-lite-cambiar-los-bordes-circulares-bordes-cuadrados/
date: 2016-04-30
modified: 2019-10-11
lang: es
author: "Caribdis.Net"
description: "Para cerrar un mes con mucho trabajo (de ahí las pocas entradas compartidas en el blog), reanudamos la serie de tutoriales dedicados al tema estrella de ThemeIsle, Zerif Lite. En..."
categories:
  - "Zerif Lite"
tags:
  - "español"
  - "gratuito"
  - "tema"
  - "ThemeIsle"
  - "traducción"
  - "tutorial"
  - "WordPress"
  - "Zerif Lite"
image: https://caribdis.net/wp-content/uploads/2017/04/zerif-lite-wordpress.jpg
word_count: 170
---

# Zerif Lite: ¿Cómo cambiar los bordes circulares a bordes cuadrados?

Para cerrar un mes con mucho trabajo (de ahí las pocas entradas compartidas en el blog), reanudamos la serie de tutoriales dedicados al tema estrella de [ThemeIsle](https://caribdis.link/ThemeIsle), **Zerif Lite**. En esta oportunidad veremos cómo usar bordes cuadrados en lugar de los circulares predeterminados.

Ya que solo haremos modificaciones de estilo **no es necesario crear un tema hijo**. Bastará con añadir los códigos en el recuadro *CSS adicional* del *Personalizador*.

La sección *Nuestro enfoque* se ve así:

[![zerif-borders01](//caribdis.net/wp-content/uploads/2016/04/zerif-borders01-1024x448.png)](https://caribdis.net/wp-content/uploads/2016/04/zerif-borders01.png)

En la hoja de estilos del tema hijo, o en el recuadro *CSS adicional* dentro del *Personalizador*, tenemos que pegar el siguiente código:
.focus-box .service-icon {
border-radius: 0;
}

.focus-box .service-icon .pixeden {
border-radius: 0;
}
El resultado:

[![zerif-borders02](//caribdis.net/wp-content/uploads/2016/04/zerif-borders02-1024x448.png)](https://caribdis.net/wp-content/uploads/2016/04/zerif-borders02.png)

Para que las fotos de la sección *Nuestro equipo* también se vean cuadradas, pegaremos el siguiente código:
.team-member .profile-pic {
border-radius: 0;
}
[![Zerif-borders-01](//caribdis.net/wp-content/uploads/2016/04/Zerif-borders-01-1024x448.jpg)](https://caribdis.net/wp-content/uploads/2016/04/Zerif-borders-01.jpg)

Se transformará en:

[![Zerif-borders-02](//caribdis.net/wp-content/uploads/2016/04/Zerif-borders-02-1024x448.jpg)](https://caribdis.net/wp-content/uploads/2016/04/Zerif-borders-02.jpg)

Y por último, para los avatares de los testimonios:
.feedback-box .client-image {
border-radius: 0;
}
[![zerif-borders03](//caribdis.net/wp-content/uploads/2016/04/zerif-borders03-1024x448.png)](https://caribdis.net/wp-content/uploads/2016/04/zerif-borders03.png)

Se verá así:

[![zerif-borders04](//caribdis.net/wp-content/uploads/2016/04/zerif-borders04-1024x448.png)](https://caribdis.net/wp-content/uploads/2016/04/zerif-borders04.png)

**Tutorial original en inglés: [How to change circle into square in Zerif](http://docs.themeisle.com/article/91-zerif-how-to-change-circle-into-square)**