Vamos a ver cómo podemos quitar el enlace a los proyectos dentro de un portfolio creado con Divi. La solución mediante CSS es sencilla, pero vamos a ver cómo se podría configurar mediante el constructor de Divi.
También te puede interesar:
¡Divi 4 Ya ha llegado! Todas las novedades aquí
Optimizar el SEO de las imágenes en WordPress con Divi y Gutenberg
¿Qué es Elementor? Todo sobre Elementor Page Builder
Divi Child Theme [+Descarga]
Este es un ejemplo de un portfolio creado con Divi. Si pasamos el ratón por encima de cada elemento se mostrará la manita y el nombre del proyecto. Si pulsamos se abrirá la página del proyecto donde podríamos consultar todos los detalles de este. ¿Pero y si queremos no mostrar los detalles del proyecto de momento y ocultar el enlace para que el usuario no pueda llegar a la página?
Tabla de contenidos
Solución CSS tradicional
La solución mediante CSS es sencilla. Bastaría con añadir el estilo a nuestra plantilla hija de wordpress:
display: none !important;
Solución con el editor de CSS personalizado de Divi
En el caso de divi, en la pestaña CSS personalizado, habría que añadir ese estilo en dos zonas. En:
- Superposición del artículo: para evitar que se ensombrezca la imagen y no aparezca el círculo azul con el signo más.
- Título del artículo: para no aparezca el link que tiene el nombre del proyecto.
Aquí podéis verlo en la imagen cómo quedaría:
Como podéis ver es sencillo y podemos cambiarlo cuando se nos antoje. Esto no evita que el usuario pueda llegar a la página en cuestión si conoce el enlace.
Renueva tu plantilla Divi o pásate a Lifetime
Si todavía sigues usando la plantilla Divi Developer anual ya puedes renovarla con un 10% de descuento o pasarte a Lifetime pagando solo la diferencia. Pincha en la siguiente imagen para poder beneficiarte de este descuento.
¡Hola! Soy Javier. Soy informático y me gusta documentar todo lo que aprendo. En mi blog te enseño todo lo que sé y cómo puedes aprender a crear tu propia web, mejorar el SEO y aplicar técnicas de Marketing Digital para conseguir mayor visibilidad. Suscríbete para no perderte ninguna de mis guías sobre WordPress, posicionamiento SEO o Marketing Digital.
Hola! se podría hacer que de la miniatura del proyecto al hacer click dirija a un link externo? Gracias
No. Eso te enlaza al proyecto en cuestión. Para lo que quieres hacer crea mejor una galería de fotos y cambias la URL de destino. Un saludo.
Hola! y cómo cambias la URL de destino de una galería ?
En este tutorial hablo del portfolio. Las galerías son de fotos, no? Un saludo.
Hola Karla. He encontrado este tutorial donde creo que consiguen cambiar el link, añadiéndolo como caption de cada imagen y después modificando el diseño con CSS. No lo he probado y no te puedo decir si es lo que buscas, pero puede que te sirva de orientación para lo que quieres hacer. Un saludo Javier. https://divisoup.com/how-to-add-links-to-the-divi-gallery-module-and-show-captions-on-hover/
Muchísimas gracias !!!
No había tenido tiempo de intentarlo, funciona súper bien !
Eres el mejor 😀
Me alegra que te haya servido ;). Saludos!
Javier, bastante interesante la información, tengo el portfolio filtrable en rejilla y necesito que además de no mostrar la capa, no tenga vínculo a ninguna página, esa modificación como se puede realizar?
Gracias
Esto que explico es para eso, para que no se pueda acceder a la página del proyecto. Un saludo.
Hola Javier, tengo el problema de que mi portfolio es filtrable y en los ajustes de CSS tengo los siguientes apartados:
- Identificador CSS
- Clase CSS
- Antes
- Elemento principal
- Después
- Filtros de portfolio
- Filtro activo de portfolio
- Imagen de portfolio
- Capa superpuesta
- Icono superpuesto
- Título de portfolio
- Datos adicionales de portfolio
- Paginación de portfolio
- Pagina activa de paginación
Pues bien, en ninguno de los cuadros me funciona que no lleve la palabra a un enlace... Yo no tengo imágenes de portfolio porque lo he usado para crear una página de productos que ofrezco...
Sabrías solución, muchas gracias, saludos.
Hola Fernando. Si no tienes imágenes, no entiendo porqué quieres eliminar el enlace. El ejemplo que muestro es para mostrar la imagen del proyecto y que no puedas entrar en él. Pero si no tienes imagen ni información adicional del proyecto... no termino de entender que sentido tiene mostrar solo el listado. Para quitar el enlace, tendrías que editar entonces el fichero php en cuestión y eliminar la etiqueta HREF. No se me ocurre otra cosa. Un saludo.
Hola Javier. Quiero hacer lo mismo que hiciste, pero necesito que al hacer click te lleve a una entrada enlazada a una categoría, y no a un proyecto enlazado a una categoría de proyecto. No sé si me explico...
Esto lo quiero hacer porque me encanta la forma en la que se ven los portafolios, y lo quiero usar para poner noticias, pues tengo un medio de comunicación.
En el fondo, que el portafolio funcione como el módulo "Blogs".
¿Sabes cómo? ¡Saludos!
Hola Felipe. Eso se escapa del alcance de este simple tutorial. Para eso tienes que diseñar una página nueva con esos estilos donde el loop de WordPress sea de las entradas que tu decidas. Un saludo.
Hola, hice mi portfolio con divi y funciona, pero cuando pinchas en el porttfolio sobre un proyecto y estas dentro de el como se puede navegar hacia adelante y hacia atras para ver los restantes proyectos sin tener que ir al menu de navegación y volver a pinchar en el portfolio, muchas gracias de antemano.
La página de un proyecto no es más que una entrada más. Puedes poner arriba o abajo del todo un enlace a la página principal del portfolio para que usuario pueda volver. Yo en mi caso como lo tengo en el menú superior, no lo veo necesario. Pero es cuestión de gustos ;). Saludos.
Hola Javier y gracias por compartir. A mi lo que me gustaría hacer en el portfolio filtrarles es que las categorías que muestro bajo el título del proyecto (bajo la miniatura) no estén enlazadas. Es decir, que se muestren las categorías, pero que no se pueda hacer click sobre ellas, que no estén enlazadas a nada....
¿Tienes idea de cómo podría hacerse esto?
¡Muchísimas gracias de antemano!
Un saludo,
Carlos
Parece que en la pestaña de CSS no viene la opción de personalizar diseño de las categorías. Lo que sí puedes hacer es de desde la pestaña Contenido, en Elementos, desactivar el mostrar las categorías. Pero eso no sé si te ocultarará el filtro de la parte superior. No lo he probado. Un saludo.
Buenas tardes,
Sabeis si existe algun modo de que la lista de las categorias se pueda meter a modo sidebar (en lista a la izquierda o derecha) y que no quede por defecto arriba.
Muchas gracias!
Que va Lourders. No te sabría decir. Un saludo, Javier.