Créer un site de A à Z, Personnalisation du style

Par Mn0073RF, il y a 10 ans

PHP

Bonjour à tous, premièrement je dis sincèrement merci à Grafikart pour ce grand œuvre ; je suis entrains de m'exercer en suivant le tuto: créer un site web de A à Z et c'est vraiment magnifique quand bien même qu'il ya des choses à actualiser pour le moment !
Au faite mon problème est simple et est le suivant: moi je veux utiliser mes propres style pas celles de twitter ;
J’ai créé un fichier style.css dans le dossier CSS et je l’ai inclure comme suite : dans mon fichier include.php :

require ROOT.DS.'webroot'.DS.'css'.DS.'style.css';

le style repond bien mais quand je lance ma page web je vois les code de la page style.css s’affichés au-dessus de mes pages web.
que puis-je faire pour corriger ça SVP? merci

15 réponses

Benjamin Derepas, il y a 10 ans

Tu dois mettre les styles dans le header de ta page, dans une balise spécifique :

<head> <link rel="stylesheet" href="<?= ROOT.DS.'webroot'.DS.'css'.DS.'style.css';>" >
Mn0073RF, il y a 10 ans

Merci bien j'ai exactement comme tu a di en plus j'ai ajouté un echo devant pas de réaction Mais quand je remet mon include ça marche mais les codes Sont aussi visible dans les pages. Merci de m'aider.

Lartak, il y a 10 ans

Bonjour.

Merci bien j'ai exactement comme tu a di en plus j'ai ajouté un echo devant pas de réaction

Pourrais-tu nous montrer le header de ta page ?
Car pour que le navigateur puisse utiliser le CSS, il faut le lui préciser dans une balise link et non via un include comme tu le ferais pour un fichier PHP ou HTML.
La fonction include permet d'inclure un fichier et donc d'insérer tout son contenu, alors que pour les fichiers CSS/JS et autres on ne fait qu'une sorte de lien symbolique via la balise link d'où le nom de la balise d'ailleurs, c'est pour lui indiquer où il trouvera le(s) fichier(s) nécessaire(s) pour améliorer l'apparence/utilisation du site.

Mn0073RF, il y a 10 ans

Merci bien mais pour l'instant je ne sais pas vous montrer mon header Car je suis sur téléphone. Je vous les Montrerais ultérieurement. Mais je suis Sûr d'avoir bien respecter mon link Dans mon head. Merci encore.

Mn0073RF, il y a 10 ans

Bonjour à tous; voici comment j'ai remplacé le link de mon head

<head> <meta charset="utf-8" /> <!--link rel="stylesheet" type="text/css" href = "style.css" /--> <link rel="stylesheet" href="<?php=ROOT.DS.'webroot'.DS.'css'.DS.'style.css';?> " /> <title> <?php echo isset($title_for_layout)?$title_for_layout:'Ma page' ;?></title> </head>
Carouge10, il y a 10 ans

Bonjour,
Petit souscis de syntaxe.
Pour faire un echo avec les short tag c'est comme ceci :

<?= ROOT.DS....; ?>
Mn0073RF, il y a 10 ans

Je viiens de changer comme ceci rien ne mache

<head> <meta charset="utf-8" /> <!--link rel="stylesheet" type="text/css" href = "style.css" /--> <link rel="stylesheet" href="<?= ROOT.DS.'webroot'.DS.'css'.DS.'style.css';?> " /> <title> <?php echo isset($title_for_layout)?$title_for_layout:'Ma page' ;?></title> </head>
Benjamin Derepas, il y a 10 ans

Avec ce dernier code, qu'est ce que ça t'affiche dans ton head ?

Mn0073RF, il y a 10 ans

Avec ça rien ne s'affiche vraiment, et le style ne sont pas pris en compte.

Benjamin Derepas, il y a 10 ans

Avec ça rien ne s'affiche vraiment

On aime bien aider sur le forum, mais il faut y mettre du sien aussi ... est ce que tu as une erreur ? Y'a quoi dans l'attr href ?

Mn0073RF, il y a 10 ans

Ok j'essaie de trouver un autre moyen de le faire et je vous donnerais la suite. Merci

Lartak, il y a 10 ans

Bonjour.

Ok j'essaie de trouver un autre moyen de le faire et je vous donnerais la suite. Merci

Il ne t'est pas demandé de trouver un autre moyen, il t'est demandé de nous donner plus de précisions sur la situation actuelle.
Tu pourrais par exemple vérifier dans la console de l'inspecteur de ton navigateur s'il n'affiche pas d'erreur et de nous en donner un retour.
Car nous te donnons des précisions et des pistes/solutions, mais tu ne réponds pas à nos questions et tu ne nous dit pas exactement le problème que tu rencontres.
Si tu n'as pas le rendu que devrait permettre ton fichier CSS, c'est par exemple soit que le chemin du fichier CSS est incorrect, soit que le nom du fichier est incorrect ou que son contenu contient des erreurs ou est vide.
Donc, quand nous vous posons des questions, ce n'est nullement pour vous ennuyer, mais pour vous aider.
Si malgré cela ça vous dérange, abstenez-vous de venir demander de l'aide.

Mn0073RF, il y a 10 ans

C'est vraie, merci
Voici mon head

<head> <meta charset="utf-8" /> <!--link rel="stylesheet" type="text/css" href="style.css"/--> <link rel="stylesheet" type="text/css" href="<?= ROOT.DS.'webroot'.DS.'css'.DS.'style.css';?>" /> <title> <?php echo isset($title_for_layout)?$title_for_layout:'Ma page' ;?></title> </head>

Voici le erreurs que j'ai dans le console de mon navigateur

login:22 Not allowed to load local resource: file:///C:/wamp/www/tuto/site/webroot/css/style.css login:67 Not allowed to load local resource: file:///C:/wamp/www/tuto/site/webroot/css/style.css content.js:32 UA. Startup (background is ready) content.js:15 VK. Startup (background is ready) extensions::uncaught_exception_handler:8 Error in event handler for extension.onRequest: chrome.extension.onRequest content.js has wrong request.name

Alors que dans Elements de mon navigateur on reconnais le chemin du link exactement comme ce ci:

<link rel="stylesheet" type="text/css" href="C:\wamp\www\tuto\site\webroot\css\style.css">

Merci beaucoup de m'aider.

Lartak, il y a 10 ans

Nous y voyons un peu plus clair maintenant.
Tu ne devrais pas avoir un chemin absolu correspondant à ta machine mais plutôt au serveur, tu ne devrais donc pas avoir un chemin de type C:\... mais plutôt /webroot/css/style.css ou /css/style.css.
Car là, il est clairement dit que le serveur ne peut pas charger le fichier CSS.

Sinon, pour information, si tu parles bien de la série de tutoriels nommé Développer un site de A à Z, je te ferais remarqué qu'il y est clairement signifié :

Ce tutoriel est déprécié ! un tutoriel plus récent est maintenant disponible.

Mn0073RF, il y a 10 ans

Vous avez parfaitement raison c'été justement ça, voici mon nouveau link:

<link rel="stylesheet" type="text/css" href="<?= BASE_URL.DS.'webroot'.DS.'css'.DS.'style.css';?>" />

Je dis grand merci.