¿Es la primera vez que instalas el tema Divi y te preguntas cómo configurarlo? Genial, estás en el lugar correcto. En este artículo vamos a repasar todas las opciones de la pestaña GENERAL del tema Divi.
Esto le ayudará a entender cuáles son estas opciones y cómo elegirlas para que su sitio esté en consonancia con su proyecto.
Como las OPCIONES DIVI están detalladas en muchas pestañas, podrá navegar por el serie de artículos dedicados a él.
Pero por ahora, vamos a ver en detalle la pestaña General (los ajustes generales).
Este es el programa de este artículo:
- Opciones del tema Divi: ¿cómo funciona?
- ¿Cuáles son las opciones de la pestaña General del tema Divi?
- Otras opciones de configuración del tema
Aviso: este artículo contiene enlaces de afiliación que reconocerá fácilmente. Los enlaces clásicos están en púrpura y los enlaces patrocinados están en rosa.
1 - Opciones del tema Divi: ¿cómo funciona?
Una vez que haya ha instalado y activado el tema Divi en su sitio de WordPressaparecerá un nuevo elemento en la parte inferior de la barra lateral izquierda de la administración de su sitio, denominado "Divi.
Al pasar el ratón por encima de esta pestaña, aparecen subelementos como el Pestaña "Opciones del tema".
Si haces clic en esta pestaña, accederás a una pantalla con los colores de Divi, que te ofrecerá muchos elementos para configurar.
Empezaremos por la pestaña GENERAL:
Echemos un vistazo más de cerca...
2 - ¿Cuáles son las opciones de la pestaña General del tema Divi?
Para que las capturas de pantalla no estén demasiado cargadas, he dividido el contenido de las opciones de la pestaña General en 3 partes.
Descubra lo que puede hacer con el tema Divi
2.1 - Ficha general - Parte 1
1 - Logotipo
Aquí es donde puede cargar el logotipo de su sitio.
Haciendo clic en Haga clic en "Ir en línea".puede acceder a su biblioteca y elegir su logotipo.
Si su mediateca aún no contiene su logotipo, puede subirlo desde su ordenador (desde la pestaña "subir archivos").
2 - Barra de navegación fija
Por defecto, la barra de navegación fija está activada, si desactiva esta opción, su menú principal - situado en la parte superior de la pantalla - sólo aparecerá cuando el visitante se desplace hacia abajo en su página.
Siga esto tutorial si quiere fijar su menú completamente al desplazamiento.
3 - Activar la Galería Divi
Todos los sitios de WordPress pueden mostrar una galería de imágenes, pero el tema Divi le permite reemplazar el estilo predeterminado de WordPress con su propio estilo. Para ello, basta con activar esta opción.
4 - Paleta de colores por defecto
Cuando se trabaja en un proyecto web, hay que respetar los códigos de color y esta opción permite predefinir hasta 8 colores.
Esto es genial porque puedes usarlos fácilmente en todo tu sitio, siempre que el Constructor Divi te pida que elijas un color.
Asegúrate de introducir los valores de los colores que utilizas al instalar Divi, esto te ahorrará mucho tiempo cuando estés trabajando en el diseño de su web.
5 - Introduzca la primera imagen del artículo
Esta es otra opción importante.
Si esta opción está activada, la "imagen destacada " de cada artículo será sustituida por la primera imagen de su artículo.
Si desactiva esta opción, la miniatura de su entrada coincidirá con la "imagen de portada" que suba a través del campo "imagen destacada " en la parte inferior derecha de cada entrada de WordPress.
Si desea utilizar varias imágenes destacadas, siga este tutorial.
6 - Modo estilo blog
Es una traducción extraña, lo reconozco...
De hecho, esta opción no debería activarse por razones de SEO.
Divi utiliza fragmentos de tus entradas, pero si prefieres mostrar el contenido completo de tus entradas (en los archivos, en la página del blog, etc.) tendrás que habilitarlo (insisto, no es SEO-Friendly).
7 - Diseño de la barra lateral y plantilla de la tienda
Desde estas dos opciones, podrás elegir la ubicación de tu blog y de la barra lateral de la tienda.
A continuación, puede decidir si debe aparecer a la derecha o a la izquierda.
Si desea obtener una barra lateral fija, siga este tutorial.
8 / 9 - Clave API y script de Google Map
Si utiliza un Cuenta de desarrollador de Google para sus mapas (Google Map), puede introducir su clave API aquí y decidir poner en cola los scripts para mejorar el rendimiento de su sitio web.
10 - Uso de Google Fonts
Esta opción está activada por defecto. Permite utilizar todas las fuentes de Google directamente desde el Divi Builder.
Si no quieres usar Google Fonts por razones de rendimiento y privacidad, puedes desactivarlo.
2.2 - Ficha general - Parte 2
11 - Iconos de redes sociales
Para cada red social, puede decidir mostrar su icono en el pie de página de su sitio.
Por defecto, sólo están disponibles 5 iconos: Facebook, Twitter, Google+, Instagram y canales RSS.
Si necesita más iconos, tendrá que codificarlos manualmente en un tema hijo => lea este artículo para añadir nuevos iconos en el pie de página.
12 - URLs de redes sociales
Dependiendo de los iconos que haya activado en el paso anterior, tendrá que introducir las URLs correspondientes.
Para el feed RSS de su sitio, puede introducir la siguiente dirección: https: //mon-site.com/feed
13 - El número de mensajes por archivo
Las páginas de archivo son páginas generadas automáticamente por WordPress.
Tanto si se trata de los archivos de productos de su comercio electrónico, como de los archivos de categorías, la página de búsqueda o los archivos de etiquetas, Divi le permite establecer el número de elementos que se mostrarán en cada página.
Por motivos de SEO, es aconsejable no restringir demasiado este número.
Así que no dude en mostrar 50, 100 o incluso 100 elementos por archivo. Esto evitará que los robots indexen demasiadas subpáginas.
Este es uno de los consejos para hacer Divi SEO-Friendly.
2.3 - Ficha General - Parte 3
14 - Formato de la fecha
Aquí puede definir el formato de la fecha de sus artículos.
Esta fecha se muestra en todas partes en su blog (en las metas de los artículos, en el extracto, etc.).
El formato por defecto es M j,Y que da 2 de enero de 2018. Si elige el formato j F Y formato, será 2 de enero de 2018.
Si prefiere otros formatos, le invito a visitar esta página dedicada a los formatos de fecha.
15 - Uso de extractos
Si desactiva esta opción, sus extractos no se utilizarán.
Para saber dónde introducir los extractos de tus entradas, tienes que asegurarte de habilitar una opción en WordPress cuando estés en la edición de la entrada.
En la parte superior de la pantalla, a la derecha, hay una pequeña pestaña llamada "opciones de pantalla". Ábrelo y marca "extraer".
A partir de ese momento, todos tus artículos mostrarán un nuevo campo para introducir el extracto, mira este vídeo en su lugar...
16 - Códigos cortos reactivos
La activación de la opción "responsive shortcodes " permite mostrar los elementos del shortcode de forma responsiva, es decir, adaptable a todas las pantallas.
17 - Subconjunto de Google Fonts
Esta función permite utilizar las fuentes de Google en otros idiomas además del inglés.
18 - Volver al principio
Esta es la opción para activar o desactivar el pequeño botón en la parte inferior derecha de su sitio que le permite ir a la parte superior de la página rápida y fácilmente.
19 - Desplazamiento suave
No estoy seguro de que esta opción sea importante, permitiría un desplazamiento más suave cuando se desplaza con el ratón... ¡Está por ver!
20 - Desactivar las traducciones
Puedes desactivar esta opción si quieres utilizar la interfaz del tema en inglés porque te parece que Divi está mal traducido.
21 - Imagen responsiva
Esta opción añade un atributo srcset a sus imágenes durante la importación. Este atributo está recomendado por CSS3 para que tus imágenes se adapten a todos los tamaños de pantalla.
Sin esta opción activa, sus imágenes deberían seguir respondiendo.
22 - Minificación de JavaScript y CSS
Estas opciones le permiten minificar y combinar ciertos archivos JavaScript y CSS para mejorar el rendimiento de su sitio.
Este es el tipo de opción que ofrece un plugin de caché como WP Rocket, por ejemplo.
FYI: MINIFICACIÓN elimina todos los espacios y saltos de línea de un archivo, ya sea un archivo CSS o JS.
Se ha comprobado que la minificación mejora el tiempo de carga de un sitio en algunos segundos, por lo que mejora el rendimiento.
Si está utilizando un plugin de caché, no marque esta opción.
23 - Personalizar el CSS
Este campo no es ni más ni menos que un reflejo de la opción de WordPress disponible en la pestaña Apariencia > Personalizar > CSS adicional.
Para personalizar su tema Divi, tendrá que hacerlo regularmente. A veces, si los cambios que quieres hacer en Divi son simples, no necesitarás crear un tema hijo y esta opción será suficiente.
24 - Guardar
Una vez que hayas configurado esta primera pestaña, no olvides guardar los cambios.
Si aparece una pequeña ventana emergente de su navegador pidiéndole que actualice su contraseña, seleccione "no guardar". Esto evitará conflictos de contraseñas.
3 - Otros ajustes del tema
Nada era muy complicado en esta ficha y en todo caso, no hay ajustes buenos o malosTodo es subjetivo.
¿Por qué, entonces, he querido escribir esta serie de artículos dedicados a las opciones disponibles en el tema Divi?
Sencillamente, porque todo tiene un principio y no todos tenemos los mismos conocimientos sobre páginas web y jerga.
Así que espero que estos artículos sean útiles para los más novatos entre nosotros.
Vaya a los otros artículos de la serie para seguir configurando su sitio con Divi:
- ¿Cómo configurar la pestaña General del tema Divi? (estás en este artículo)
- Cómo se configura la pestaña Navegación del tema Divi ?
- Cómo se configura la pestaña del creador del tema Divi
- Cómo se configura la pestaña Diseño del tema Divi ?
- Cómo se configura la pestaña Publicidad del tema Divi ?
- Cómo se configura la pestaña SEO del tema Divi ?
- Cómo se configura la pestaña Integración y la pestaña Actualizaciones del tema Divi ?
¿Necesitas más recursos sobre Divi? Visite el blog de ElegantThemes que está lleno de ideas y tutoriales.
Bonjour, j’ai installé Divi sur mon site wordpress, mais je n’ai pas de nouvel élément qui a apparu, qui doit se trouver en bas de la barre latérale gauche de mon administration de site, nommé « Divi ». J’utilise ce thème avec LearnDash, est ce que cela a un rapport avec le fait que je n’ai pas cet onglet? Ou alors j’ai mal installé le thème ? Merci
Bonjour, j’ai installé le thème divi sur mon site wordpress, mais je n’ai pas ce nouvel élément qui a apparu, en bas de la barre latérale gauche de mon administration de site, nommé « Divi ». J’utilise le thème avec Learndash, est ce que cela a un rapport avec le fait que je n’ai pas cet onglet ? Ou est ce que j’ai mal installé le thème ? Merci
Bonjour Marie, je me demande quel thème vous utilisez ? LearDash ou Divi ? Divi est un thème. Mais il existe aussi le Divi Builder, qui est un plugin de construction de page. Donc, peut-être il faudrait creuser de ce côté là ? Si vous avez installé le thème Divi, il faudra l’activer à la place de LearnDash. Si vous avez installé le Divi Builder, il faudra activer le plugin et voir s’il est bien compatible avec LearnDash.
Bonjour,
Je voudrais créer une barre latérale avec mes icônes de réseaux sociaux (comme sur cette page https://astucesdivi.com/options-divi-general/, barre verte à gauche), comment faut-il procéder?
Bonsoir Maelle,
La barre dont vous parlez est faite avec le plugin Monarch. Celui-ci est un plugin premium qui est disponible avec la licence Divi. Si vous l’avez, vous pouvez facilement l’installer et le paramétrer.
À bientôt.
Bonjour,
Merci pour toutes ces petites précisions qui ont éclairé certaines de mes questions.
J’ai un souci avec mon entête de site. J’ai un logo officiel qui est présent, mais je dois ajouter, toujours au niveau de la barre de menu (voire sur le menu secondaire), deux logos qui sont obligatoires d’un point de vue juridique.
Je travaille sur le thème Divi, mais je n’arrive pas trouver cette option.
Merci pour votre aide !
Anouchka
Bonjour Anouchka, pour ajouter le logo au niveau du menu principal, vous devez aller à Divi > Option du Thème > Général et télécharger votre logo. Pour insérer un logo dans la barre supérieure, il faudra certainement effectuer un développement spécifique.
Bonjour
J ai tout fait
Je rencontre un problème
Comment lier WordPress a mon .com
J arrive à me servir de divi sur WordPress par contre qd je vais sur mon site les changements ne se font pas
Help ! Suis à bout je trouve pas !
Merci d avance
Bonjour Marie, c’est un peu vague ce que vous m’expliquez… est-ce un problème de pointage de nom de domaine ? Si oui, vous pouvez voir cela avec votre hébergeur… quant à vos modifications, est-ce que vous les enregistrez bien ? Est-ce que vous rafraîchissez votre page dans le navigateur ?
Bonjour, merci pour l’article très clair !
J’ai un problème avec la taille du logo sur le site que je créé en ce moment, le logo est parfait sur desktop, mais tout petit sur tablette et smartphone, j’ai une page statique avec une taille de logo à 80% sur desktop et une hauteur de menu à 200.
J’ai cherché pendant des heures pour résoudre le pb sans succès …
Merci pour votre aide !
Bonjour Virginie. Peut-être pouvez-vous partager votre url pour que je puisse mieux visualiser ?
Bonjour
e cherche a installer l’option qui fait apparaitre seulement un bout d’un article et lorsque l’on appuie sur lire plus le reste du texte s’affiche.
Merci
Hello Sylvie, vous trouverez ça dans les options du thème Divi, onglet général
Bonjour, Est-il possible de créer un dossier sur une page (comme une chemise sous Windows ou MAC) et y inclure des fichiers PDF. Exemple : j’ai 4 documents PDF qui doc1.pdf, doc2.pdf, doc3.pdf et doc4.pdf, Ces 4 documents seraient placés dans une chemise ou dossier nom Rencontre du 1er décembre. Les visiteur cliquent sur la chemise et voient les 4 fichiers PDF, Merci
Je ne suis pas sûre Yves… Vous pouvez mettre ces 4 PDF dans un dossier zippé et mettre ce dossier en téléchargement ? Sinon, vous pouvez télécharger ces 4 fichier dans la bibliothèque de média puis les ajouter dans des modules de Divi sur une même page ? Il y a plusieurs solutions je pense, reste à savoir celle qui vous convient le mieux…
Bonjour,
Bien q’ayant rentré le nom du site, je ne le vois pas apparaitre?
comment dois je faire ?
Salut Xavier,
L’affichage du nom de ton site dépend du thème. Et Divi ne l’affiche pas. Par contre, sur ta homepage, tu peut ajouter un bloc de texte ou de titre pour inscrire le nom de ton site.
Bonjour,
J’utilise Divi avec woocommerce pour ma boutique. Il me manque de pouvoir proposer l’option du choix de tailles ou couleurs sur la page produit.
Comment puis-je installer cette option ?
Meci
Salut Patier.
Pour créer des variations de produit (par taille, couleur etc.), il faut que tu crées des « produits variables » et non des « produits simples ».
Tu pourras alors créer des attributs de produit ainsi que des variations.
Cela ne dépend en aucun cas de Divi. C’est WooCommerce lui-même qui te permet de faire ça.
Peut-être que ce tuto peut t’aider.
😉
Bonjour,
Merci pour vos articles, je me permet néanmoins de poser une question concernant le paramétrage des texte dans divi pour laquelle je ne trouve de réponse nulle part…
En effet, mes paragraphes se « découpent » par eux même et parfois en plein milieu d’un mot ça passe à la ligne. Ce n’est pas très clair pour le lecteur… Avez vous une solution pour que les mots ne se divisent pas par eux meme?
Merci d’avance
Salut Lycia,
Je cherche à désactiver la fonction zoom lorsqu’on clique sur une photo depuis le module Galerie de Elegantheme lorsque celui-ci est organisé en diapo. Tu trouveras le lien ci-dessous pour avoir une idée en pratique de la situation : https://maurelarchitectes.ch/project/concours-de-lecole-de-neirivue/. Pourrais-tu m’aider ?
Salut Ludovic, on dirait que tu as trouvé une solution car je ne vois pas de zoom sur cette galerie 🙂
Salut Lycia,
Merci pour ta réponse.
J’ai en effet utilisé la fonction suivante dans les paramêtrages CSS de projet des pages contenant la fonction Gallery..
.mfp-bg { display: none;
}
.mfp-fade { display: none;
}
.mfp-ready { display: none;
}
Pourrais-tu me dire si cela est adapté ou s’il y a mieux ?
Si ça marche, c’est bon non ? 😉
Bonjour,
j’ai un souci… quand je veux partager une photo de ma galerie sur facebook.. quand je clique sur le lien, cela m’emmène sur une page article mais ma photo est doublée car je pense que par défaut, il y a une mise en avant de la photo sur l’article…. Comment puis je modifier cela… L’article est créé automatiquement par la galerie (gmédia) et non pas moi…
merci pour votre aide
camille
Salut Camille, je ne comprend pas, tu utilises un plugin de galerie ? Car Divi ne fait pas ce que tu dis.
oui , j’utilise un autre plugin pour les galeries photo (gmédia), mais j’ai trouvé la solution…. par défaut le thème met la première photo de l’article en avant, j’ai décoché cette option et cela marche.
Il me reste un ptit souci.. quand je veux partager une image via l’icone de partage de la galerie gmédia, sur un réseau social, la première image proposée est l’image en avant de mon site. Si j’annule et que je recommence de suite, là c’est bon, c’est l’image désirée à partager… Pour les visiteurs, j’imagine que c’est pas top de se rendre compte de cela… En cas où tu avais déjà vu le problème…
En tout cas merci pour la réponse…
Ah ok Camille, non je ne connais pas ce plugin, désolée…
Concernant le format de la date, je rencontre un souci
Sur le Module Blog, j’ai défini la date en j M Y pour les pages en français et M d Y pour les pages en anglais.
En anglais tout ce passe bien mais en français le mois reste en anglais ( par exemple 2 Aug 2020 )
Voir sur guideyourtrip.com en bas de page
J’ai essayé jFY mais le format reste identique
Auriez-vous une idée ?
Bonjour Gilles. Si je comprends ton site est multilingue ? Je sais pas trop d’où peut venir le souci. Il y a des options de réglages de la date dans les réglages de Divi et aussi dans le module blog. Du coup as-tu vérifié que tous les réglages ont été fait ?
Bonjour Lycia
Oui J’ai bien tout paramétré
Sur Divi Options du Théme le format date est mise à j F Y
Idem sur le module Blog
Compliqué de trouver la solution
Désolée Gilles, je ne vois pas alors…
En recherchant dans le code function
J’ai remarqué cette partie
Je pense que c’est cela qui force la date et laisse le mois en anglais
Le souci c’est que je ne connais pas le php
Auriez-vous une idée ?
function et_last_modified_date_blog( $the_date ) {
if ( ‘post’ === get_post_type() ) {
$the_time = get_post_time( ‘His’ );
$the_modified = get_post_modified_time( ‘His’ );
$currentlang = get_bloginfo(‘language’);
if($currentlang=== »fr-FR »):
$last_modified = sprintf( __( ‘%s’, ‘Divi’ ), esc_html( get_post_modified_time( ‘j M Y’ ) ) );
$date = $the_modified !== $the_time ? $last_modified : get_post_time( ‘M j, Y’ );
return $date;
elseif ($currentlang=== »en-GB »):
$last_modified = sprintf( __( ‘%s’, ‘Divi’ ), esc_html( get_post_modified_time( ‘M j, Y’ ) ) );
$date = $the_modified !== $the_time ? $last_modified : get_post_time( ‘M j, Y’ );
return $date;
endif;
}
}
add_action( ‘get_the_date’, ‘et_last_modified_date_blog’ );
add_action( ‘get_the_time’, ‘et_last_modified_date_blog’ );
Salut Gilles,
Je ne sais pas trop. Perso, je ne toucherais pas à cette fonction. Envoie-moi la capture d’écran de l’endroit où le mois reste en anglais STP
Bonjour,
J’ai ma barre de menu en haut (logo à gauche puis 5 boutons à droite à l’horizontale).
Je voudrais ajouter un nouveau bouton à mon menu mais je n’y arrive pas…
Je suis un peu novice. Help !
Merci d’avance !
Bonsoir Thomas, le menu se gère depuis Apparence > Menu