IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

[HTML] solution pour mon site


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Inscrit en
    Août 2007
    Messages
    416
    Détails du profil
    Informations forums :
    Inscription : Août 2007
    Messages : 416
    Par défaut [HTML] solution pour mon site
    Bonjour,

    J'ai créer un site qui contient 4 pages .html et 1 page .css, je voudrais réaliser un template car pour toutes les pg il y a juste le contenu qui changent.

    Pouvez vous m aider pour se template car je ne sais pas trop comment faire ?

    merci à vous

    index.html

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
    	<head>
    		<link href="itech.css" rel="stylesheet" type="text/css">
    	</head>
     
    	<body>
    	<div id="conteneur">		
    		<h1 id="header"><a href="index.html" title="ici votre logo"></a></h1>
     
    		<ul id="menu">
    			<li><a href="index.html">Accueil</a></li>
    			<li><a href="bienetre.html">Bien être</a></li>
    			<li><a href="minceur.html">Minceur</a></li>
    			<li><a href="product.html">Nos Produits</a></li>
    			<li><a href="mailto:email@adresse.com">Contact</a></li>
    		</ul>
     
    		<div id="contenu">
    			<h2>Indiquez ici la description de votre société</h2>
    				<p style="text-align: center"><b><a href="../shop.html">
                    <font size="4" color="#FF0000">Retour vers Store online</font></a></b></p>
    		</div>	
    		<p id="footer">© Copyright 2007 Votre Société</p>
    	</div>
    	</body>
    </html>

    bienetre.html

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
    	<head>
    		<link href="itech.css" rel="stylesheet" type="text/css">
    	</head>
     
    	<body>
    	<div id="conteneur">		
    		<h1 id="header"><a href="index.html" title="ici votre logo"></a></h1>
     
    		<ul id="menu">
    			<li><a href="index.html">Accueil</a></li>
    			<li><a href="bienetre.html">Bien être</a></li>
    			<li><a href="minceur.html">Minceur</a></li>
    			<li><a href="product.html">Nos Produits</a></li>
    			<li><a href="mailto:email@adresse.com">Contact</a></li>
    		</ul>
     
    		<div id="contenu">
    			<h2>Bien être xxxxxxxxxxxxxxxxxxxx</h2>
    				<p style="text-align: center"><b><a href="../shop.html">
                    <font size="4" color="#FF0000">Retour vers Store online</font></a></b></p>
    		</div>	
    		<p id="footer">© Copyright 2007 Votre Société</p>
    	</div>
    	</body>
    </html>

    itech.css

    Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
     
     
    		body
    		{
    			margin: 10px 0 ;
    			padding: 0 ;
    			text-align: center ;
    			font: 0.8em "Trebuchet MS", helvetica, sans-serif ;
    			background: #dea ;
    		}
     
    		div#conteneur
    		{
    			width: 770px ;
    			margin: 0 auto ;
    			text-align: left ;
    			border: 2px solid #ab4 ;
    			background: #fff ;
    		}
     
    		h1#header
    		{
    			height: 258px ;
    			margin: 0 ;
    			background: url(pomme.jpg) no-repeat left top ;
    		}
     
    		h1#header a
    		{
    			width: 400px ;
    			height: 70px ;
    			display: block ;
    			background: url(title.gif) no-repeat ;
    			position: left ;
    			left: 350px ;
    			top: 15px ;
    		}
     
    		h1#header a span
    		{
    			display: none ;
    		}
     
    		ul#menu
    		{
    			height: 35px ;
    			margin: 0 ;
    			padding: 0 ;
    			background: url(bg_menu.gif) repeat-x 0 -25px ;
    			list-style-type: none ;
    		}
     
    		ul#menu li
    		{
    			float: left ;
    			text-align: center ;
    		}
     
    		ul#menu li a
    		{
    			width: 130px ;
    			line-height: 25px ;
    			font-size: 1.2em ;
    			font-weight: bold ;
    			letter-spacing: 2px ;
    			color: #fff ;
    			display: block ;
    			text-decoration: none ;
    			border-right: 2px solid #dea ;
    		}
     
    		ul#menu li a:hover
    		{
    			background: url(bg_menu.gif) repeat-x 0 0 ;
    		}
     
    		div#contenu
    		{
    			padding: 0 25px 0 100px ;
    			background: url(bg_page.gif) no-repeat 15px 15px ;
    		}
     
    		div#contenu h2
    		{
    			padding-left: 25px ;
    			line-height: 25px ;
    			font-size: 1.4em ;
    			background: url(little_apple.gif) no-repeat left bottom ;
    			color: #9b2 ;
    			border-bottom: 1px solid #9b2 ;
    		}
     
    		div#contenu h3
    		{
    			margin-left: 15px ;
    			padding-left: 5px ;
    			border-bottom: 1px solid #9b2 ;
    			border-left: 3px solid #9b2 ;
    			color: #9b2 ;
    		}
     
    		div#contenu p
    		{
    			text-align: justify ;
    			text-indent: 2em ;
    			line-height: 1.7em ;
    		}
     
    		div#contenu a
    		{
    			color: #8a0 ;
    		}
     
    		div#contenu a:hover
    		{
    			color: #9b2 ;
    		}
     
    		p#footer
    		{
    			margin: 0 ;
    			padding-right: 10px ;
    			line-height: 30px ;
    			text-align: right ;
    			color: #8a0 ;
    		}
     
    		pre
    		{
    			overflow: auto ;
    			background: #dea ;
    			border: 2px solid #9b2 ;
    			padding: 5px 0 0 5px ;
    			font-size: 1.2em ;
    		}
     
     
    		pre span
    		{
    			color: #560 ;
    		}
     
    		pre span.comment
    		{
    			color: #b30000 ;
    		}

    Idem pour les autres pages minceur.html ect

  2. #2
    Membre Expert
    Avatar de trotters213
    Profil pro
    Inscrit en
    Janvier 2005
    Messages
    2 571
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : France, Gard (Languedoc Roussillon)

    Informations forums :
    Inscription : Janvier 2005
    Messages : 2 571
    Par défaut

    Tu peux par exemple utiliser un include (php) dans ton div contenu afin d'inclure une page en fonction du lien sur lequel tu cliques.

  3. #3
    Membre éclairé
    Inscrit en
    Août 2007
    Messages
    416
    Détails du profil
    Informations forums :
    Inscription : Août 2007
    Messages : 416
    Par défaut
    Bonjour,

    Merci à vous pour votre réponse, comment dois je faire pour l include ??

    Merci à vous.

    ps : sorry je suis débutant

  4. #4
    Membre confirmé Avatar de Momodedf
    Inscrit en
    Juillet 2007
    Messages
    246
    Détails du profil
    Informations personnelles :
    Âge : 36

    Informations forums :
    Inscription : Juillet 2007
    Messages : 246
    Par défaut
    Include est une fonction en PHP permetant d'inclure une page dans une autre (entre autre).
    La syntaxe est la suivante :

    include("mapage.html");


    Si tu ne connais pas ce langage tu peux commencer par ça :
    http://php.developpez.com/cours/

  5. #5
    Membre éclairé
    Inscrit en
    Août 2007
    Messages
    416
    Détails du profil
    Informations forums :
    Inscription : Août 2007
    Messages : 416
    Par défaut
    J ai essayer avec la doc mes je ne comprend pas comment je dois faire car toute mes pg son en .html

  6. #6
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Renomme simplement tes pages en .php pour pouvoir utiliser la fonction d'include.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Solution de pub pour mon site
    Par jorgeV84 dans le forum Publicité
    Réponses: 1
    Dernier message: 23/03/2013, 14h21
  2. Plusieurs dossiers pour mon site en HTML
    Par roubla dans le forum Balisage (X)HTML et validation W3C
    Réponses: 7
    Dernier message: 19/12/2011, 16h31
  3. Quelle solution ovh pour mon site ?
    Par 007007 dans le forum OVH
    Réponses: 0
    Dernier message: 28/05/2010, 20h42
  4. Quel forum pour mon site ?
    Par David 01 dans le forum EDI, CMS, Outils, Scripts et API
    Réponses: 43
    Dernier message: 15/07/2009, 09h45
  5. Réponses: 5
    Dernier message: 21/03/2007, 14h21

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo