Joomladay francophone 2018 à Paris 18 et 19 mai

Background

Réduire
X
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • Background

    bonjour a tous

    un probleme simple mais la solution ne me vient pas

    je voudrais diviser mon background en trois image

    une top fixe

    une middle en repeat

    et une footer

    seul detail comment l'indiquer dans mon template? html? css?

    voila je n'est pas de grandes connaissances donc merci de faire une reponse comprehensible
    Dernière édition par white_angel_40 à 07/01/2010, 10h09
    Webmaster autodidacte en herbe
    Réalisation: Sarl Microtek, Repar'Portable
    En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

  • #2
    Bonsoir,

    Une piste peut-être:

    en HTML

    Code:
    <div#middle >
                 <div#top>
                 </div>
                 <div#footer>
                </div>
    </div>
    En css
    div#middle {
    background : transparent url(../images/images_middle_repeat repeat-y);}

    div#top {
    background : transparent url (../images/images_top ) no-repeat top left;}

    div#footer{
    background : transparent url (../images/images_footer) no-repeat bottom left;}

    ainsi images_middle_repeat (l'mage répété sur laxe y) est masquée/recouverte en haut par images_top et en bas par images_footer

    ++, TT
    Dernière édition par AlphaDesign à 08/12/2009, 19h09
    Templates Joomla sur mesure & responsive http://alphadesign.fr/creation-de-sites-templates-joomla-responsive.html
    Formations Joomla http://alphadesign.fr/services/formations-joomla.html
    Formations Joomla conventionnées: DIF et autres formations continues.
    Checklist SEO pour Joomla http://alphadesign.fr/joomla/checklist-seo-pour-joomla-referencement-joomla.html

    Commentaire


    • #3
      ha merci je vais chercher de ce coté la

      je vous tient au courant
      Webmaster autodidacte en herbe
      Réalisation: Sarl Microtek, Repar'Portable
      En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

      Commentaire


      • #4
        marche pas

        alors je ne sais pas si c'est dans le html ou dans le css que je ne place pas bien mes lignes de codes moi j'ai ca

        en html
        </head>
        <body id="page_bg">
        <div#middle>
        <div#top>
        </div>
        <div#footer>
        </div>
        </div>

        <div id="all">
        <div id="header">
        <jdoc:include type="modules" name="user3" />
        <h1 id="logo">
        <img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/images/pub_top_header.png" border="0" alt="<?php echo JText::_('Logo Beez, Three little Bees'); ?>" " />

        en css
        div#middle {
        background : url(../images/backgroundrepeat.jpg)center 0 repeat-y ;
        }

        div#top {
        background : url (../images/background.jpg) center top left no-repeat;
        }

        div#footer{
        background : url (../images/footer.jpg)center no-repeat bottom left;}



        body
        {
        font-family: arial, helvetica, sans-serif;
        font-size: 100.1%;
        padding: 0px;
        text-align: center;
        }


        voila si qulqu'un voit une solution, sachant que c'est avec le template d'origine beez et que je modifie le fichier template.css
        Webmaster autodidacte en herbe
        Réalisation: Sarl Microtek, Repar'Portable
        En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

        Commentaire


        • #5
          apres une journée de recherche je n'y arrive pas et je en voit toujours pas pourquoi
          Webmaster autodidacte en herbe
          Réalisation: Sarl Microtek, Repar'Portable
          En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

          Commentaire


          • #6
            Bonsoir,

            C'est bien le background de toute la page web que vous souhaitez modifier ? (middle top et footer n'était que des exemples...)

            Si tel est le cas modifier le code comme suit :
            Code:
            <body>
              <div id="all">
                <div id="header" >...
                <div id="footer">...
            </div>
            Pour le CSS ajouter les lignes suivantes :
            Code:
            ligne 95 du fichier general.css
            #all {
            background : transparent url(../images/backgroundrepeat.jpg) center 0  repeat-y ;
            }
            ligne 47 du fichier position.css, remplacer le background existant du header par
            #header {
            background : transparent url (../images/background.jpg) no-repeat top left ;
            }
            ligne 1329 du fichier layout.css , remplacer le background existant du footer par
            #footer{
            background : transparent url (../images/footer.jpg) no-repeat bottom left;}
            Il serait plus facile de vous aidez si vous aviez votre site en ligne ..

            ++, TT
            Dernière édition par AlphaDesign à 09/12/2009, 18h29
            Templates Joomla sur mesure & responsive http://alphadesign.fr/creation-de-sites-templates-joomla-responsive.html
            Formations Joomla http://alphadesign.fr/services/formations-joomla.html
            Formations Joomla conventionnées: DIF et autres formations continues.
            Checklist SEO pour Joomla http://alphadesign.fr/joomla/checklist-seo-pour-joomla-referencement-joomla.html

            Commentaire


            • #7
              il est en ligne

              je vous envoie son adresse par message privé
              Webmaster autodidacte en herbe
              Réalisation: Sarl Microtek, Repar'Portable
              En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

              Commentaire


              • #8
                alors j'ai reussi le repeat du fond

                le footer apparait bien mais dans la balise footer donc forcement l'image ne s'affiche pas en entier

                et pareil pour le header
                li'amge s'affiche dans le cadre du header alors qu'elle fait toute la page voir plus en largeur et en hauteur elle deborde du header en dessous donc la on voit un decallage

                mais au moins c'est en bonne voie

                merci encore pour votre aide

                si il vous faut des identifiant de connexion en super admin dite me le je vous les enverrai en pm c'est un site de test donc pas de soucis
                Webmaster autodidacte en herbe
                Réalisation: Sarl Microtek, Repar'Portable
                En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

                Commentaire


                • #9
                  Bonjour

                  pour le footer : fichier layout.css, ligne 1321, ajouter le texte en gras
                  #footer {
                  height: 567px; }

                  supprimer le div="footer" en gras ci-dessous juste après le div id=header en effet le div="footer" est déjà défini + loin dans la code
                  Code:
                  <body>
                    <div id="all">
                      <div id="header" >...
                      <div id="footer"></div>
                  </div>
                  Pour le header je ne vois pas de background image appliquée dans le css du fichier position.css ligne 51 cf ci-dessous
                  Code:
                  #header {
                  margin:0;
                  position:relative;
                  text-align:right;
                  }
                  ++, TT
                  Dernière édition par AlphaDesign à 10/12/2009, 10h56
                  Templates Joomla sur mesure & responsive http://alphadesign.fr/creation-de-sites-templates-joomla-responsive.html
                  Formations Joomla http://alphadesign.fr/services/formations-joomla.html
                  Formations Joomla conventionnées: DIF et autres formations continues.
                  Checklist SEO pour Joomla http://alphadesign.fr/joomla/checklist-seo-pour-joomla-referencement-joomla.html

                  Commentaire


                  • #10
                    merci encore pour la reponse

                    pour le header c'est normal j'ai essayé plusieurs choses et du coup déplacé quelque ligne d ecode

                    j'ai remit comme vous me l'aviez conseillez pour que vous puissiez voir ce que cela donne


                    pour le footer j'ai rajouté le code que vous me donnez, mais cela auguemente la taille du cadre du footer alors que je voudrais qu'il sois en background de tout le site pas simplement du cadre footer

                    en fait si on prend le background global du site

                    on as reussi a mettre le repeat comme je le veut
                    je voudrais que en top soit accroché le background.jpg dessous le repeat et accroché en bas de pages le footer

                    s'en tenir compte des different cadre header footer etc qui construise l'architecture du site

                    que mon site sois posé sur tout mes background en gros

                    je sais que ca ne doit pas etre tres clair mais comme je ne suis pas un professionnel je ne connai pas les bon terme a employer

                    merci encore pour votre aide, j'apprends beaucoup de chose grace vous
                    Webmaster autodidacte en herbe
                    Réalisation: Sarl Microtek, Repar'Portable
                    En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

                    Commentaire


                    • #11
                      ok, je ne pensais pas que les backgrounds images étaient si hautes... d'abord on supprime les background de footer et header on essaye autre chose :

                      Pour le HTML ajouter, modifier le code en gras
                      <body id="all" style="font-size: 100%;">
                      <div id="top_bg">
                      <div id="bottom_bg">
                      <div id="header"> .../....</div>
                      <div id="contentarea2">.../....</div>
                      <div id="footer">.../...</div>
                      </div><!-- end div id="bottom_bg" -->
                      </div> <!-- end div id="top_bg" -->
                      Pour le css ajouter le code en gras
                      div#top_bg { background : transparent url(../images/background.jpg) no-repeat scroll left top }
                      div#bottom_bg { background : transparent url(../images/footer.jpg) no-repeat scroll left bottom }
                      le problème avec cette solution est que si il n'y a pas assez de texte en hauteur, cad si la page n'est pas assez haute l'image backgroung.jpg ne sera pas montrée dans toute sa hauteur et peut être recouverte par footer.jpg....

                      ++, TT
                      Dernière édition par AlphaDesign à 10/12/2009, 12h01
                      Templates Joomla sur mesure & responsive http://alphadesign.fr/creation-de-sites-templates-joomla-responsive.html
                      Formations Joomla http://alphadesign.fr/services/formations-joomla.html
                      Formations Joomla conventionnées: DIF et autres formations continues.
                      Checklist SEO pour Joomla http://alphadesign.fr/joomla/checklist-seo-pour-joomla-referencement-joomla.html

                      Commentaire


                      • #12
                        et si je suis cette logique

                        je ne peut pas dire de charger le top en dernier du coup il recouvre le footer

                        en encran respectivement le footer en bas et le header en top

                        ou sinon mieux je ne peut pas definir une hauteur fixe pour le top bg et le bottom bg

                        comme ca si la page est trop pettite au pire des cas il colle les deux ?
                        Webmaster autodidacte en herbe
                        Réalisation: Sarl Microtek, Repar'Portable
                        En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

                        Commentaire


                        • #13
                          oui c'est un bon test à faire, donne au div#top_bg la hauteur des 2 images (en effet div#bottom_bg est inclus dans div#top_bg)

                          ++, TT
                          Templates Joomla sur mesure & responsive http://alphadesign.fr/creation-de-sites-templates-joomla-responsive.html
                          Formations Joomla http://alphadesign.fr/services/formations-joomla.html
                          Formations Joomla conventionnées: DIF et autres formations continues.
                          Checklist SEO pour Joomla http://alphadesign.fr/joomla/checklist-seo-pour-joomla-referencement-joomla.html

                          Commentaire


                          • #14
                            donc j'ai fait les modif c'est presque bon

                            seul probleme les images header et footer sont bloqué dans le cadre du site on ne voit donc pas les cotés

                            Code:
                            si certain veulent l'adresse et pense avoir une solution a mon probleme la voici joom.xeofrenezy.org
                            Webmaster autodidacte en herbe
                            Réalisation: Sarl Microtek, Repar'Portable
                            En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

                            Commentaire


                            • #15
                              personne n'as une id pour corriger mon probleme
                              Webmaster autodidacte en herbe
                              Réalisation: Sarl Microtek, Repar'Portable
                              En informatique on peut tout faire, il suffit de savoir chercher, de comprendre ce que l'on trouve et des fois d'y mettre le prix

                              Commentaire

                              Annonce

                              Réduire
                              1 sur 2 < >

                              C'est [Réglé] et on n'en parle plus ?

                              A quoi ça sert ?
                              La mention [Réglé] permet aux visiteurs d'identifier rapidement les messages qui ont trouvé une solution.

                              Merci donc d'utiliser cette fonctionnalité afin de faciliter la navigation et la recherche d'informations de tous sur le forum.

                              Si vous deviez oublier de porter cette mention, nous nous permettrons de le faire à votre place... mais seulement une fois
                              Comment ajouter la mention [Réglé] à votre discussion ?
                              1 - Aller sur votre discussion et éditer votre premier message :


                              2 - Cliquer sur la liste déroulante Préfixe.

                              3 - Choisir le préfixe [Réglé].


                              4 - Et voilà… votre discussion est désormais identifiée comme réglée.

                              2 sur 2 < >

                              Assistance au forum - Outil de publication d'infos de votre site

                              Compatibilité: PHP 4.1,PHP4, 5, 6DEV MySQL 3.2 - 5.5 MySQLi from 4.1 ( @ >=PHP 4.4.9)

                              Support Version de Joomla! : | J!3.0 | J!2.5.xx | J!1.7.xx | J!1.6.xx | J1.5.xx | J!1.0.xx |

                              Version française (FR) D'autres versions sont disponibles depuis la version originale de FPA

                              UTILISER À VOS PROPRES RISQUES :
                              L'exactitude et l'exhaustivité de ce script ainsi que la documentation ne sont pas garanties et aucune responsabilité ne sera acceptée pour tout dommage, questions ou confusion provoquée par l'utilisation de ce script.

                              Problèmes connus :
                              FPA n'est actuellement pas compatible avec des sites Joomla qui ont eu leur fichier configuration.php déplacé en dehors du répertoire public_html.

                              Installation :

                              1. Téléchargez l'archive souhaitée : http://afuj.github.io/FPA/

                              Archive zip : https://github.com/AFUJ/FPA/zipball/master

                              2. Décompressez le fichier de package téléchargé sur votre propre ordinateur (à l'aide de WinZip ou d'un outil de décompression natif).

                              3. Lisez le fichier LISEZMOI inclus pour toutes les notes de versions spécifiques.

                              4. LIRE le fichier de documentation inclus pour obtenir des instructions d'utilisation détaillées.

                              5. Téléchargez le script fpa-fr.php à la racine de votre site Joomla!. C'est l'endroit que vous avez installé Joomla et ce n'est pas la racine principale de votre serveur. Voir les exemples ci-dessous.

                              6. Exécutez le script via votre navigateur en tapant: http:// www. votresite .com/ fpa-fr.php
                              et remplacer www. votresite .com par votre nom de domaine


                              Exemples:
                              Joomla! est installé dans votre répertoire web et vous avez installé la version française du fichier FPA:
                              Télécharger le script fpa-fr.php dans: /public_html/
                              Pour executer le script: http://www..com/fpa-fr.php

                              Joomla! est installé dans un sous-répertoire nommé "cms" et vous avez installé la version française du fichier FPA:
                              Télécharger le script fpa-fr.php dans: /public_html/cms/
                              Pour executer le script: http://www..com/cms/fpa-fr.php

                              En raison de la nature très sensible de l'information affichée par le script FPA, il doit être retiré immédiatement du serveur après son utilisation.

                              Pour supprimer le script de votre site, utilisez le lien de script de suppression fourni en haut de la page du script. Si le lien de suppression échoue pour supprimer le script, utilisez votre programme FTP pour le supprimer manuellement ou changer le nom une fois que le script a généré les données du site et le message publié sur le forum. Si le script est toujours présent sur le site, il peut être utilisé pour recueillir suffisamment d'informations pour pirater votre site. Le retrait du script empêche des étrangers de l'utiliser pour jeter un oeil à la façon dont votre site est structuré et de détecter les défauts qui peuvent être utilisé à vos dépends.
                              Voir plus
                              Voir moins
                              Travaille ...
                              X