Divi Tips 13

Opciones del tema Divi: centrarse en la pestaña General

Actualizado el 22/08/2019 | Publicado el 12/01/2018 | 37 comentarios

1.806 palabras

7

¿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:

  1. Opciones del tema Divi: ¿cómo funciona?
  2. ¿Cuáles son las opciones de la pestaña General del tema Divi?
  3. 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.

Divi - Options du thème
Divi - Opciones del tema

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:

Onglet Général des options Divi
Ficha general de las opciones del tema

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

Général - partie 1
Ficha general - parte 1/3

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

Général - partie 2/3
Ficha general - parte 2/3

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

Général - partie 3/3
Ficha general - parte 3/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:

¿Necesitas más recursos sobre Divi? Visite el blog de ElegantThemes que está lleno de ideas y tutoriales.

Comment paramétrer les options de Divi ?
¿Cómo se configuran las opciones de Divi? ¡Dilo en Pinterest!
obtenir divi bouton
quizz divi bouton
newsletter bouton
formation divi bouton
guide divi pdf bouton
bouton support divi

Puede que a ti también te guste:

37 Commentaires

  1. Marie

    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

  2. Marie

    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

  3. Lycia

    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.

  4. Maelle

    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?

  5. Lycia

    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.

  6. Anouchka Neuvecelle

    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

  7. Lycia

    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.

  8. Marie

    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

  9. Lycia

    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 ?

  10. Virginie HUBER

    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 !

  11. Lycia

    Bonjour Virginie. Peut-être pouvez-vous partager votre url pour que je puisse mieux visualiser ?

  12. Sylvie Brassard

    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

  13. Yves

    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

  14. Lycia Diaz

    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…

  15. Cotton Xavier

    Bonjour,

    Bien q’ayant rentré le nom du site, je ne le vois pas apparaitre?

    comment dois je faire ?

  16. Lycia Diaz

    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.

  17. Patier

    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

  18. Lycia Diaz

    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.
    😉

  19. Anaïs

    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

  20. Ludovic_DMA

    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 ?

  21. Lycia Diaz

    Salut Ludovic, on dirait que tu as trouvé une solution car je ne vois pas de zoom sur cette galerie 🙂

  22. Ludovic

    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 ?

  23. Lycia Diaz

    Si ça marche, c’est bon non ? 😉

  24. camille dudous

    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

  25. Lycia Diaz

    Salut Camille, je ne comprend pas, tu utilises un plugin de galerie ? Car Divi ne fait pas ce que tu dis.

  26. Camille Dudoubs

    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…

  27. Lycia Diaz

    Ah ok Camille, non je ne connais pas ce plugin, désolée…

  28. Gilles

    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 ?

  29. Lycia Diaz

    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 ?

  30. Gilles

    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

  31. Lycia Diaz

    Désolée Gilles, je ne vois pas alors…

  32. Gilles

    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’ );

  33. Lycia Diaz

    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

  34. Thomas

    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 !

  35. Lycia Diaz

    Bonsoir Thomas, le menu se gère depuis Apparence > Menu

  36. Jordan

    Bonjour Lycia,
    J’ai suivi à la lettre vos instructions concernant les URL des réseaux sociaux. Cependant, lorsque j’insère le logo facebook (ou un autre) avec le module « suivez-nous sur les réseaux sociaux », bien que l’icone apparaisse, le lien de redirection m’envoie vers la page d’accueil de mon site wordpress, et non sur ma page facebook. J’ai pourtant bien renseigné l’URL de ma page dans l’onglet général des options du thème Divi. Savez-vous ce qui coince et comment je pourrais résoudre ce problème ?
    Merci d’avance !

Trackbacks/Pingbacks

  1. Comment ajouter des icônes dans le footer de Divi : Instagram, Pinterest, YouTube etc... - […] de l’article concernant les options générales de Divi, nous avions vu comment activer les icônes de Facebook, Twitter, Google+…
  2. Comment paramétrer les onglets CRÉATEURS, LAYOUTS et ADS du thème Divi ? - […] paramétrer l’onglet Général du thème Divi […]

Soumettre un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.