Zerif Lite: agregar una sección (tutorial actualizado para la versión de WP.org)

63 comentarios

Wilbert · 10 mayo, 2017 a las 2:52 pm

Como agregar un nuevo boton para registro de cliente en pagina Zerif Lite:

Caribdis Diseño Web · 11 mayo, 2017 a las 8:11 pm
Hola, Wilbert.
¿Podrías ser un poco más específico? ¿Dónde querés agregar el botón?
Saludos.

Bernart · 13 mayo, 2017 a las 1:44 pm

Uff pues me parece mucho más complicado que antes.
El usar más funciones para añadir los títulos y subtitulos de las secciones me trae de cabeza.

He visto que en las nuevas versiones usa unos hooks en los archivos de las secciones como por ejemplo

¿Sabes a qué se refieren estas líneas y en que parte del código puedo editarlas para mis propias secciones?

Muchas gracias una vez más usted es una gran ayuda

Bernart · 13 mayo, 2017 a las 1:47 pm
zerif top our_focus trigger( )
zerif_before_our_focus trigger( )
Perdón no se copiaron los hooks a los que me refería de ejemplo.
Gracias

Caribdis Diseño Web · 14 mayo, 2017 a las 10:57 pm
Hola, Bernart.
De hecho, es prácticamente igual que antes, solo que el código que estaba en el archivo de la sección se pasó a una función.
Y los hooks son «llamadas» a funciones personalizadas que podés incluir en el archivo functions.php del tema hijo. Un ejemplo:
function hola() {
    echo '<h1>Hola arriba de Focus</h1>';
}
add_action( 'zerif_top_our_focus', 'hola' );
Saludos.

Bernart · 18 mayo, 2017 a las 11:08 am
Muchas gracias, ya le estoy tomando el truquillo.
Disculpa que te moleste una vez más,
En la nueva versión de zerif-lite, las secciones de la página de inicio están en el panel (zerif_frontpage_sections_panel) para ello crea una clase Zerif_WP_Customize_Panel
Entonces para cada sección hace un condicional de si es la versión última pues crea el panel de la sección y lo añade a la sección de pagina de inicio, y si no es la versión última pues simplemente crear la nueva sección.
Yo sé, que puedo poner en la indicación del panel de la sección que creo, indicarle, el panel de la pagina de inicio.
Me gustaría poder utilizar la condición que aparece pero me da error por la la clase
¿Puedo llamar a esa clase desde mi thema hijo o hay otra manera?

Caribdis Diseño Web · 19 mayo, 2017 a las 1:27 pm
Hola, Bernart.
No sé si termino de entender lo que estás queriendo hacer.
Si es mover la nueva sección dentro del panel Secciones de la página de inicio, agregala como sección y no como panel. El código sería algo así:
$wp_customize->add_section( 'zerif_newsection_section' , array(
	'title'       => __( 'Nueva sección', 'zerif-lite' ),
	'description' => __( 'El contenido principal de esta sección se puede personalizar desde el menú Personalizar -> Widgets. Allí podrá añadir cualquier widget.', 'zerif-lite' ),
	'panel'       => 'zerif_frontpage_sections_panel'
));
Saludos.

jhoan garcia · 19 mayo, 2017 a las 11:49 pm

Primero que nada , gracias por compartir tu conocimiento, ahora tengo tres preguntas, no se si la primera sea obvia pero no vi respuesta…y ante todo mis disculpas si alguna pregunta es inadecuada.

1- si en lugar de ingresar una nueva sección de nuestro enfoque, quiero ingresar la seccion de ultimas noticias, ¿Que cambios debo realizar a el ejemplo que nos regalaste?

2- ¿De que forma agrego no una nueva seccion , sino 2 nuevas secciones ?

3- Las paginas que has hecho en tu portafolio , ¿Son todas plantillas gratis o algunas son de pago?

Caribdis Diseño Web · 21 mayo, 2017 a las 1:36 pm
Hola Jhoan.
Gracias por tu comentario.
El proceso para agregar/duplicar una sección es siempre el mismo, solo que hay que darle un nombre único a cada archivo php y a cada variable.
Fijate en esta y esta respuestas para la sección Últimas noticias.
Algunas de las webs del portfolio son a medida, y otras hechas a partir de temas premium (Divi es el que más uso actualmente).
Saludos.

Eli · 25 mayo, 2017 a las 10:36 pm

Buenas noches, con mis escasos conocimientos en desarrollo web, he utilizado este tema modificando agregando las páginas que requiere mi proyecto.
¿Sería posible agregar en una de las páginas «Únete» formulario de inscripción?

He habilitado plugins de RSS para facilitar al visitante la publicación de las «últimas entradas» en Facebook y twitter. El problema viene al publicar, todas las publicaciones en Facebook y twitter las hace con la imagen del logo y no con la imagen destacada de la entrada.
¿Podrías ayudarme?

Muchas gracias y un saludo.

Caribdis Diseño Web · 26 mayo, 2017 a las 1:04 pm

Hola, Eli.

Podés agregar un formulario estándar en una página, usando el código abreviado de Pirate Forms [pirate_forms]. Si necesitás algo más avanzado, podés usar Contact Form 7, o buscar algún otro que te permita agregar campos.

El tema de las imágenes al compartir podés manejarlo instalando un plugin de SEO y activando los campos meta de redes sociales: te permite seleccionar la imagen y el extracto que quieras que aparezca. Yoast SEO, WP Meta SEO y All in One SEO (instalando el complemento) incluyen esta característica.

Saludos.

Elena · 5 junio, 2017 a las 8:45 am

Hola, tengo una duda. Creando una nueva sección de este modo, ¿puedo añadir un widget con las últimas entradas de Facebook en una de las columnas, y otro con las últimas de Twitter? ¿Recomiendas algún widget en especial? Gracias de antemano.

Caribdis Diseño Web · 5 junio, 2017 a las 8:55 pm
Hola, Elena.
Sí, podés agregar cualquier widget que tengas disponible. En esta entrada recomiendo uno de Twitter.
Saludos.

Antonio Andrade · 6 junio, 2017 a las 1:24 am

De nuevo yo… gracias como siempre por compartir tus conocimientos que son de gran ayuda… ahora quiero agregar «Footer areas» en la sección «widgets» porque necesito armarlo un poco más extenso de lo normal, ¡cómo puedo hacerlo?

Mil gracias =)

Caribdis Diseño Web · 6 junio, 2017 a las 2:20 pm
Hola, Antonio.
No hay límite para los widgets que agregues en el pie de página, en las tres columnas podés repartirlos como quieras. Ahora, si necesitás más columnas de widgets es más complicado, porque tendrías que registrar áreas nuevas.
Saludos.

Antonio · 6 junio, 2017 a las 10:06 pm
Muchas gracias por responder, ya pude darle mejor formato, otra duda, en la seccion (perdona por los acentos, la computadora es extranjera) «our focus» siempre me aparecen los iconos 4 en linea yo los quiero 3 por linea, que debo hacer para modificar esto?
Mil gracias.

Caribdis Diseño Web · 7 junio, 2017 a las 7:58 pm
Hola, Antonio.
Fijate en esta respuesta.
Saludos.

carlos · 6 junio, 2017 a las 6:53 pm

Hola soy nuevo suscriptor de tu pagina ya que me intereso mucho el trabajo que realizas, tengo una pregunta, quiero quitar la parte del contactenos de la pagina principal y ponerla en una pagina aparte que le llame contacto como puedo hacer esto, saludos…

Caribdis Diseño Web · 7 junio, 2017 a las 7:43 pm
Hola, Carlos.
Gracias por tu comentario y suscripción.
Podés desactivar la sección Contáctenos de la página de inicio desde el Personalizador (marcando la casilla ¿Ocultar sección «Contáctenos»?) y luego crear una página donde tendrás que pegar el código abreviado [pirate_forms].
Eso sería todo. Si necesitás un formulario más avanzado, podés buscarlo en el repositorio y en lugar de [pirate_forms] pegar el código que corresponda.
Saludos.

Raul cañada · 6 junio, 2017 a las 7:09 pm

Buenas tardes en la sección de mi cuenta me aparece el formulario para acceder, pero no me aparece la opción de poder registrar a un nuevo usuario como podría activar esta opción?

Caribdis Diseño Web · 7 junio, 2017 a las 7:48 pm
Hola, Raúl.
Si te referís al enlace Registrarse que aparece debajo del formulario de inicio de sesión, solo aparece si seleccionaste Cualquiera puede registrarse en la página Ajustes > Generales > Miembros.
Saludos.

Alexander Bulla · 14 junio, 2017 a las 3:26 pm

Hola Ana buen dia muchas gracias por tu ayuda , tengo unas inquietudes como podria agregar mas secciones de este tipo sin que me genere error lo intente y me muestra faltal error y debo recuperar todo el funtions php. y tambien lograr que los widgest me queden mas centrados ya que agrego un carrucel con imagenes y se ve un poco hacia la derecha y no tener tanto espacio entre la seccion inferior y superior de la nueva seccion, te agradezco mucho tu asesoria, un excelente dia

Caribdis Diseño Web · 15 junio, 2017 a las 9:24 pm
Hola, Alexander.
Cada sección nueva tiene que tener un nombre único; si lo repetís en alguno de los códigos va a dar error.
El tema del carrusel es porque está adoptando un ancho fijo y aparentemente no es responsive. Además, si querés usar una sola columna, tenés que usar la clase col-lg-12 en lugar de col-lg-3 al registrar el área de widgets.
Y por último, el relleno lo manejás con CSS, en el caso de la sección nueva con el siguiente código:
#nuevaseccion.focus {
    padding: 10px 0 10px 0;
}
Modificá el valor en píxeles por el que necesites.
Saludos.

Luis Carlos · 20 junio, 2017 a las 10:34 pm

Hola Ana, quiero poner una nuevo color de fondo a la nueva sección
pongo el siguiente codigo en el editor CSS pero no me funciona
}
/* SECCIÓN NUEVA */
.zerif_newsection_section {
background: #B23180;
}

Como puedo hacer para cambiar el color del fondo de la nueva sección??

Caribdis Diseño Web · 22 junio, 2017 a las 6:38 pm
Hola, Luis Carlos.
Fijate en esta respuesta.
Saludos.

Luis Carlos · 23 junio, 2017 a las 6:51 pm
Hola Ana mil gracias por tu ayuda, logre cambiar el color de fondo del tema hijo como lo quería.
Ahora tengo un último problema con esa sección y es que los textos debajo de las imagenes salen corridos al lado izquierdo.
Si entras a mi pagina http://socialmass.co/luisComunicaciones/TallerdeVida/ te daras cuenta que en la sección de PROYECTOS que fue la que cree con el tema hijo no estan alineados los textos con los circulos.
Como puedo hacer para arreglar esto???

Caribdis Diseño Web · 23 junio, 2017 a las 9:24 pm
Hola, Luis Carlos.
Para agregar widgets de Nuestro enfoque tenés que usar el código que se muestra al final en before-widget y after-widget.
Saludos.

Lenis · 24 junio, 2017 a las 8:08 am

Hola de nuevo Ana!
Creé el tema hijo y lo estoy editando en un servidor local en el que no tengo etradas ni nungún tipo de contenido, solo la plantilla, ¿Cómo hago para que después el tema hijo pueda ser usado en cualquier otra página? Es decir, que lo pueda pasar a una web real y me mantenga las modificaciones. Intenté hacerlo subiendo el .zip del tema hijo y no me aparecen todos los cambios, además se esconde la opción de agregar css adicional en el editor.

Caribdis Diseño Web · 26 junio, 2017 a las 12:48 pm
Hola, Lenis.
El tema hijo solo sirve para hacer cambios de estilo y/o estructura sobre el tema padre. Todo lo que son los contenidos (páginas, entradas, categorías, etiquetas, widgets y menús) es independiente y se guarda en la base de datos.
Si querés copiar tal cual un sitio local a un servidor en línea podés hacerlo manualmente con un backup de la carpeta de WP y de la base de datos, o usar un plugin como Duplicator.
Saludos.

Luis · 27 junio, 2017 a las 7:55 am

Hola tengo un menú desplegable en mi sitio con Zerif Lite y necesitaría saber si se le puede poner un marco o una sombra o cambiar el color de fondo cuando se despliega.
Gracias

Caribdis Diseño Web · 27 junio, 2017 a las 1:20 pm
Hola, Luis.
Para cambiar los colores usá el siguiente código, con los valores que necesites:
.navbar-inverse .navbar-nav ul.sub-menu {
    background: #cccccc; /* Fondo */
    border: 1px solid #333; /* Borde */
    box-shadow: 3px 3px 2px rgba(50, 50, 50, 0.08); /* Sombra */
}
Saludos.

luis · 12 julio, 2017 a las 3:47 pm

Hola Ana,
instale el archivo del tema hijo correctamente, adicional utilice 3 widgets de Zerif – Nuestro enfoque y se ven bien. Sin embrago los bordes estan siempre en blanco y no cambian de color. Y la linea abajo de los circulos de los tres widgets es roja.
Como puedo hacer para que tanto el color del circulo y de la linea sean iguales y que cuando uno se pare sobre el circulo este cambie de color? Habia pensado que fuesen amarillo, verde y azul.
Mil gracias por tu ayuda.

Caribdis Diseño Web · 12 julio, 2017 a las 9:42 pm
Hola, Luis.
Fijate en esta respuesta.
Saludos.

Pedro · 20 julio, 2017 a las 3:08 am

Hola Ana, primero que nada muchas gracias por toda tu ayuda.

Tengo una consulta, ¿cómo puedo hacer para agregar una nueva sección y en esta incorporar un Shortcode?

Muchas gracias por tu tiempo.

Saludos!

Caribdis Diseño Web · 20 julio, 2017 a las 8:23 pm
Hola, Pedro.
Gracias por tu comentario.
Podés usar este mismo tutorial como referencia, y en lugar de crear el área de widgets usar el código abreviado. Por ejemplo, donde está el siguiente código:
<?php
    if ( is_active_sidebar( 'new-section-sidebar' ) ) {
    dynamic_sidebar( 'new-section-sidebar' );
    } else echo 'Añada algunos widgets aquí';
?>
pegarías:
<?php echo do_shortcode('[codigo-abreviado-del-plugin]'); ?>
Y si no necesitás los campos de título y subtítulo en el personalizador, una simple función en un hook es suficiente. Por ejemplo, para insertarlo a continuación de la sección Nuestro equipo, sería algo así:
function zerif_child_shortcode() {
    echo do_shortcode('[codigo-abreviado-del-plugin]');
}
add_action( 'zerif_after_our_team', 'zerif_child_shortcode' );
Saludos.

Pedro · 21 julio, 2017 a las 8:27 pm
Muchas gracias!
Lo implementaré en mi página.
Saludos!

Elizabeth Martínez · 22 julio, 2017 a las 2:06 pm

Hola que tal, muchas gracias por su ayuda. Me he visto en un apuro, ya que quiero realizar un tema hijo pero no me da acceso al «/wp-content/themes/» y al ir a «wp-admin/themes.php» (que es donde sí me da acceso) sólo me permite subir un nuevo archivo de tema. ¿Me podrías ayudar? Muchas gracias!

Caribdis Diseño Web · 22 julio, 2017 a las 10:02 pm
Hola, Elizabeth.
Tenés que acceder a la carpeta de instalación de WordPress vía FTP para subir los archivos del tema hijo que hayas creado. O bien comprimirlos en un ZIP e instalarlo desde Apariencia > Temas > Subir tema.
Para más información, visitá esta entrada.
Saludos.

alex · 1 agosto, 2017 a las 3:06 pm

Hola Ana, gracias por tus tutoriales!!
te cuento que agregue una nueva sección, justamente la de focus y tengo la nueva sección sin problemas tal como mostras en el punto 4, pero al hacer el punto 5 no tengo ningún cambio en el personalizador de widget, cambie tal cual el contenido de la carpeta de new-section.php pero no me aparece ningún cambio en «widgets»… que podra ser?

mil gracias!

Caribdis Diseño Web · 1 agosto, 2017 a las 9:51 pm
Hola, Alex.
Fijate que todos los nombres coincidan. new-section.php no es lo mismo que new_section.php.
Saludos.

alex · 2 agosto, 2017 a las 1:15 pm
Si, lo he revisado y todos los nombres son new_section, así es que aun no encuentro el error 🙁 incluso al ponerle título a la nueva sección para publicarla no se publica, debo haber errado desde un comienzo en algún punto, seguiré buscando el error, gracias!

Hugo · 14 agosto, 2017 a las 8:42 pm

Buenas tardes!
Estoy configurando en mi sitio el tema gratuito y cuando me deslogueo de wordpress no se ven los iconos del pie de pagina, el texto de la sección titulo grande no esta.

Que puede pasar?
Estoy usando Zerif LiteVersión: 1.8.5.25 un tema hijo y también lo probé que el template original

WordPress 4.8.1

Gracias

Caribdis Diseño Web · 14 agosto, 2017 a las 11:43 pm
Hola, Hugo.
¿Agregaste contenido en esas secciones y guardaste los cambios?
Saludos.

Dani Chan · 23 septiembre, 2017 a las 8:43 am

Hola,

tengo un par de dudas sobre las entradas en los post.

1) En el grid de resumen de entradas, cuando hay más del número permitido dice en inglés: «older posts» y «newer posts»… ¿Cómo lo puedo traducir?

2) Dentro de la página entradas individuales, la imagen destacada sale super grande… ¿Cómo se puede limitar para que ocupe todo el ancho pero la altura, sea por ejemplo de 600px? La idea es que se recorte «solo» en la pagina de content

Muchas gracias!!

Caribdis Diseño Web · 25 septiembre, 2017 a las 9:58 pm
Hola, Dani.
Gracias por tu comentario.
Zerif Lite incluye la traducción, así que si tenés configurado tu WordPress en Español deberías ver «Entradas antiguas» y «Entradas recientes».
En cuanto al segundo punto, convendría establecer un nuevo tamaño de miniatura. Tomá como referencia las instrucciones de este tutorial (la última parte). En el archivo functions.php del tema hijo pegá el siguiente código:
add_image_size( 'custom-post-thumb', 825, 500, true ); // 825 es el ancho, 500 la altura (modificalo a gusto)
Y en content-single.php, de la línea the_post_thumbnail('large'); reemplazá 'large' por 'custom-post-thumb'.
Tené en cuenta que tendrás que regenerar las miniaturas con algún plugin para que tomen efecto sobre las imágenes que ya subiste.
Saludos.

Jairo · 27 septiembre, 2017 a las 11:54 pm

Necesito tu ayuda. Estoy tratando de crear una nueva sección, porque en la pagina «TESTIMONIOS» del tema, he agregado el widget correspondiente y no pasa nada. No hay cambio. No se ve ningún testimonio. Solo aparece la palabra TESTIMONIO y el subtitulo que puedo agregar. Pero ningún widget funciona en esta sección. Me gustaría saber si hay una forma en la que se pueda hacer que aparezcan. Para mi es muy importante esta sección.

Caribdis Diseño Web · 30 septiembre, 2017 a las 11:34 am
Hola, Jairo.
¿Podrías detallar un poco más el inconveniente? Si agregás widgets desde personalizador, ¿no guarda los cambios? ¿No los guarda tampoco desde Apariencia > Widgets? Y en lo posible, pasame una URL para ver el sitio.
Saludos.

Marilian · 7 octubre, 2017 a las 11:24 pm

Saludos Ana,

He seguido el tutoríal y todo fue bien hasta el paso 4, sigo el paso 5 pero no logro ver el área de widgets para la nueva sección en el Personalizador, que puede estar pasando?

En última instancia descargue tu .zip, instale y tampoco veo cambios…

Gracias por la ayuda,

Caribdis Diseño Web · 9 octubre, 2017 a las 8:56 am
Hola, Marilian.
Fijate que hay una aclaración al final. Seguramente el tema fue actualizado de la versión suspendida. Para que puedas ver la nueva sección tenés que incluir también el archivo front-page.php en la carpeta del tema hijo.
Saludos.

jimmy valle · 10 octubre, 2017 a las 5:59 pm
acabo de hacer eso y no me sale la opcion de los widgets.
he hecho lo siguiente:
he descomprimido el zip y he renombrado el archivo_front-page.php por el nombre front-page.php…… y asi lo he vuelto a zippear con el mismo nombre del zip y lo subi a wp y nada, no funka, sale las secciones desordenadas.
también adicione al archivo zip el documento frontn-page-php, osea que adicioné tal como dice el tutorial al archivo zip, de tal manera que volvi a comprimir con los dos archibos uno con _front-page.php y otro con front-page.php, lo volvi a zipear y lo subi al tema y volvia a salir lo mismo, sale todo sin forma. favor si me puedes ayudar con esto, también indicarme si se puede agregar mas de una sección.

Caribdis Diseño Web · 11 octubre, 2017 a las 11:25 am
Hola, Jimmy.
¿A qué te referís con «secciones desordenadas»? El ZIP tal como está funciona en una versión de Zerif que no fuera actualizada desde la versión suspendida.
¿No tenés una URL para verlo?
En cuanto a agregar más de una sección, los pasos serían los mismos, pero siempre dándoles un nombre único a cada una y creando el archivo php correspondiente en la carpeta /sections/.
Saludos.

Jesús · 8 octubre, 2017 a las 7:06 pm

Hola, cómo podría hacer para agregar un vídeo en la sección about-us.
Me gustaría que justo después del texto de la parte izquierda se viera un vídeo, pero no consigo que aparezca ni embebiéndolo, ni por iframe, ni copiando el enlace… no sé como hacer, ¿podrías ayudarme?
Gracias!

Caribdis Diseño Web · 9 octubre, 2017 a las 1:33 pm
Hola, Jesús.
Fijate en esta respuesta.
Saludos.

Sergio · 9 octubre, 2017 a las 11:17 am

Hola Ana. Está muy bien tus tutoriales, Mi duda es si se puede cambiar el orden de las secciones, ya que quiero alterar el orden que viene por defecto.

Además a esto, he visto lo de añadir los logos a la sección «Quienes somos». Lo he intentado con el CSS Adicional y no me ha salido.

Por último, me pregunto si hay alguna forma de cambiar el color del footer.

Muchas gracias y siento haberte hecho tantas preguntas.

Caribdis Diseño Web · 10 octubre, 2017 a las 10:04 am
Hola, Sergio.
Gracias por tu comentario.
Es posible cambiar el orden con un tema hijo (Zerif Pro sí permite cambiar el orden de las secciones desde el Personalizador). Tendrías que copiar el archivo content-front-page.php y mover las porciones de código que correspondan a las secciones al lugar donde quieras que aparezcan. Todas están comentadas para identificarlas fácilmente. Por ejemplo, cortás el código correspondiente a /* LATEST NEWS */ y lo pegás antes de /* OUR FOCUS SECTION */.
Los logos de clientes se agregan como widgets, fijate que hay una sección específica para eso (Área de clientes).
Y para cambiar el color de fondo del pie de página, fijate en esta respuesta.
Saludos.

juan · 20 octubre, 2017 a las 9:20 pm

hola

se puede mover un panel de una posicion a otra por ejemplo el de agregar la nueva seccion se queda en un lugar si quisiera moverla mas abajo se puede mover el panel

y otra se puede ocultar los paneles que no me sirvan o secciones o campos

saludos

Caribdis Diseño Web · 22 octubre, 2017 a las 12:24 pm
Hola, Juan.
Para mover el panel de la nueva sección usá un número más alto en la línea 'priority' => 32,.
Y en cuanto a la otra duda, fijate en esta respuesta.
Saludos.

Luis Rossi · 25 octubre, 2017 a las 3:35 am

Saludos.
¡Muy buena tu pagina y la info que compartes!

¿Puedo agregar esa nueva sección para un portafolio que se integre perfectamente al sitio? ¿Cómo lo haría?

Caribdis Diseño Web · 25 octubre, 2017 a las 7:57 pm
Hola, Luis.
Gracias por tu comentario.
Podés usar como referencia las instrucciones que se detallan en Insertar un código abreviado en una nueva sección de este tutorial.
Básicamente cualquier plugin de portfolios que genere un código abreviado sirve.
Saludos.

luismiguelsec · 26 octubre, 2017 a las 12:14 pm

buen dia, quisiera saber como se hace para crear mas de una nueva seccion, ya cree una pero no puedo con la otra.

Caribdis Diseño Web · 26 octubre, 2017 a las 2:02 pm
Hola, Luismiguelsec.
Los pasos son los mismos, pero hay que dar un nombre único a cada variable y crear otro archivo php en la carpeta /sections/ para esa sección.
Saludos.

Giovanna · 30 noviembre, 2017 a las 11:43 pm
Hola, Buenas, Cuando dices dar un nombre único a cada variable, a qué variables te refieres y de cuál archivo?

Caribdis Diseño Web · 2 diciembre, 2017 a las 2:03 pm
Hola, Giovanna.
Significa que todos los newsection que veas en el código deberán ser reemplazados por newsection2 (o el nombre que sea), en todos los archivos en donde aparezcan. Ejemplo: 'panel_newsection' tendrá que ser 'panel_newsection2', 'zerif_newsection_header_subtitle' tendrá que ser 'zerif_newsection2_header_subtitle', etc.
Saludos.