[Résolu] CREER UN MENU SUR UN SITE ONE PAGE (ASTRA ac Vlogger Template) (Créer un compte)

  • WordPress :6.4
  • Statut : résolu
15 sujets de 1 à 15 (sur un total de 20)
  • Auteur
    Messages
  • #2467679
    Cirkl Services
    Participant
    Initié WordPress
    23 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Thème utilisé : Astra
    • Template : Vlogger
    • Nom de l’hébergeur : o2Switch
    • Adresse du site : https://cirklservices.fr

    Problème(s) rencontré(s) :

    • Je voudrais supprimer l’entête et le pied de page de mon one page et les remplacer par les miens.
    • Je voudrais intégrer un menu en haut de la page, en en-tête par exemple, qui renvoie aux sections du site, et donc non à des pages. J’ai précisément sélectionné ce template exprès pour pouvoir faire ça.
    • Je voudrais comprendre pourquoi les modifications que je fais sur le site pour qu’il soit utilisable sur mobile ne s’appliquent pas.

    Si jamais vous avez la réponse qu’à ne serait-ce qu’une seule de ces questions, vous me rendriez un grand service.

    D’avance, merci.

    • Ce sujet a été modifié le il y a 4 mois par Cirkl Services.
    • Ce sujet a été modifié il y a 4 mois par Flobogo. Raison : déplacé en rubrique "thèmes"
    #2467707
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Bonjour,

    Pour votre menu site one page voir ce TUTO

    #2467712
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Le théme Astra à un constructeur d’en tête et de pied de page voir cet

    Article

     

     

    #2467754
    Cirkl Services
    Participant
    Initié WordPress
    23 contributions

    Bonjour,

    Merci pour le tuto pour faire des ancres, je vais me pencher dessus ce soir.

    Par contre, concernant le constructeur d’en-tête et de pieds-de-page d’Astra, je l’ai déjà utilisé et ai déjà configuré ce que je désirais. Mais le template Vlogger « prend le dessus », c’est à dire qu’aucune des modifications que j’avais fait via Apparences ==> Personnaliser n’apparaît. L’en-tête et le pied-de-page du template apparaissent sur le One Page sans que je puisse y faire quoi que ce soit apparemment… (je n’ai même pas la main dessus).

    D’avance, merci.

    #2467796
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Pour votre header & footer imposé par votre template vous avez peut être cette Extension installé qui permet de personnaliser votre en-tête et pied de page.

    #2467815
    Cirkl Services
    Participant
    Initié WordPress
    23 contributions

    Bonjour,

    J’ai pu créer mon menu grâce aux ancres, merci beaucoup !

    Je suis parvenu à avoir la main sur le header/footer en désinstallant le template, puis en le réinstallant, puis en personnalisant via Apparences ==> Personnaliser, mais bien APRES avoir réinstallé le template. Etant parfaitement débutant, j’avais d’abord installé le template…

    Pour le moment, j’ai réglé mes problèmes immédiats, mais malheureusement je fois refaire une bonne partie du site.

    Je vais avoir d’autres problèmes à régler, mais chaque choses en son temps.

    • Cette réponse a été modifiée le il y a 4 mois par Cirkl Services.
    • Cette réponse a été modifiée le il y a 4 mois par Cirkl Services.
    #2467914
    Cirkl Services
    Participant
    Initié WordPress
    23 contributions

    Bonjour à nouveau,

    Voici le problème que je rencontre à présent, et que je n’arrive vraiment pas à comprendre. Mais peut-être sera t’il mieux que je crée un nouveau sujet ailleurs, auquel cas n’hésitez pas à le dire et je le ferai.

    J’utilise 3 navigateurs différents, Opéra, Chrome et Firefox. Mon navigateur principal est Opéra, donc j’ai fait tout mon site sur celui-ci. Aujourd’hui le site est terminé, même s’il reste des modifications à faire, mais je peux le diffuser pour commencer mes activités. Seulement, autant le site fonctionne très bien sur Opéra, c’est à dire sur le navigateur sur lequel ma session WordPress est ouverte ; autant il ne fonctionne pas du tout sur Firefox et Chrome. Je vous invite à aller sur https://cirklservices.fr via Chrome et Firefox, ou même Opéra (sans ma session ouverture donc), pour constater cela. Je vous met des impressions écrans de ce que je vois sur Opéra, pour pouvoir comparer.

    Si vous avez la moindre explication à cela, je suis preneur.

    Merci d’avance !

    • Cette réponse a été modifiée le il y a 3 mois et 4 semaines par Cirkl Services.
    • Cette réponse a été modifiée le il y a 3 mois et 4 semaines par Cirkl Services.
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2467929
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Je n’ai pas votre problème en regardant votre site WEB sur Chrome ou Firefox.
    il  y a juste un soucis de marge interne avec les blocs container de l’extension Ultimate Addons.
    vous avez peut être ce réglage a partir de l’editeur Gutenberg sinon vous pouvez entrer
    ce code a partir du menu Apparence/personnaliser/ CSS additionnel

    .wp-block-uagb-container{
    padding:1em;
    }

     

    #2467930
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    vous avez aussi un problème sur mobile
    avec le bloc icônes Réseau sociaux ou
    les deux premières icones in & Facebook
    sont surdimensionnées
    entrez le code:

    @media(max-width:600px){
    .wp-block-uagb-container.uagb-block-22cc32af .wp-block-image img{
    width:65px!important;
    }
    }

    #2468026
    Cirkl Services
    Participant
    Initié WordPress
    23 contributions

    Bonjour,

    Merci pour votre aide, à nouveau !

    Je suis parvenu à régler le problème de la taille des icônes de réseaux sociaux sur mobile.

    Vous avez effectivement remarqué qu’il y avait des problèmes avec la taille des marges des conteneurs… Ce que je n’arrive d’ailleurs pas du tout à comprendre, j’ai utilisé les mêmes objets, j’ai mis les mêmes réglages à tous les objets et ça ne donne pas partout pareil, si vous avez une explication à ça ! Je n’ai jamais fait de CSS, aussi je ne savais pas trop comment entrer les lignes que vous m’avez gentiment fournies, comme vous le verrez en pièce jointe. Manifestement, ça a marché pour les  icones de RS sur mobile, mais pas pour la taille des conteneurs. Aussi bien sur ordinateur que sur mobile d’ailleurs, ou les distances entre le haut des conteneurs et les titres, ou entre le bouton « demandez un devis » et le bas de conteneurs, ou entre les titres et les images, ne sont pas toujours les mêmes alors que j’ai fait les mêmes réglages !

    Je viens de remarquez aussi que le menu ne fonctionne pas sur mobile. Le logo recouvre le titre et, quand on le déroule, n’indique que « Home ».

    Merci d’avance !

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2468056
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Bonjour,

    Remplacer le code précédent pour les marges internes

    .wp-block-uagb-container{
    padding:1em;
    }

    par celui ci:

    .wp-block-uagb-container{
    padding:1em!important;
    }

    Pour le menu sur mobile, voir dans les réglages du thème ASTRA?

    #2468060
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Mince! le code précédent décale le titre du header,
    remplacez par celui-ci:

    .wp-block-uagb-container:not(:first-child){
    padding:1em!important;
    }

    #2468065
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Votre en-tête n’est pas responsive vous pouvez
    entrer ce code:

    @media(max-width:600px){

    header .custom-logo-link img {
    max-width: 90px!important;
    }

    .wp-block-heading{
    font-size:32px!important;
    }

    .wp-block-heading:first-child{
    margin-top:4em!important
    }
    }

    #2468126
    Cirkl Services
    Participant
    Initié WordPress
    23 contributions

    Bonsoir,

    Une fois de plus, merci pour votre aide.

    J’ai du faire quelques modifications sur le site, notamment pour que les éléments apparaissent dans le bon ordre sur mobile.

    Il ne reste aujourd’hui que deux problèmes :

    • le menu ne marche pas sur mobile, quand on le déroule, il n’indique que « Home »
    • Malgré vos lignes de CSS et mes efforts pour tout rééquilibrer en harmonisant les différents éléments sur Guntenberg, les marges dans les conteneurs et entre les images et les textes ne sont toujours pas partout les mêmes dans les différentes rubriques : le titre « Les Intelligences Artificielles » est trop proche du bord du conteneur, le bouton dans le même conteneur est lui aussi trop proche du bord du bas ; les distances entre les titres « Copywriting » et « Rédaction Web » et leurs images respectives sont trop grandes. Et le phénomène est le même sur mobile, mais pas nécessairement aux mêmes endroits.

    D’avance, merci.

    #2468218
    Rock4Temps
    Participant
    Maître WordPress
    1039 contributions

    Supprimer tous les codes précédent et le remplacer par celui-ci:

    @media(max-width:600px){

    /* Icônes Réseau sociaux */
    .wp-block-uagb-container.uagb-block-22cc32af .wp-block-image img{
    width:65px!important;
    }

    /* Logo header */
    header .custom-logo-link img {
    max-width: 90px!important;
    }

    /* titre header */
    h1.wp-block-heading{
    font-size:32px!important;
    }

    /* titre header */
    h1.wp-block-heading:first-child{
    margin-top:4em!important
    }

    }

    .wp-block-uagb-container:not(:first-child){
    padding:2em!important;
    }

    La section « Conception-Rédaction Copywriting » est construite différement des autres section et notament de la section « Rédaction Technique ».
    Vous n’avez qu’a dupliquer la section « Rédaction Technique » et remplacer son contenu par celle de la section « Conception-Rédaction Copywriting »
    pour avoir votre image proche du titre.

    Pour le menu sur mobile, les autres items de menu n’apparaissent pas dans le code, voir votre configuration
    dans Apparence /personnaliser/en-tête/Menu Principal ou bien une extension qui pose problème?

15 sujets de 1 à 15 (sur un total de 20)
  • Vous devez être connecté pour répondre à ce sujet.