[URL Cleaner] chemins relatifs - Images et CSS

[Kazé]

Heuu, ca corrige rien dans la feuille de style externe.

Effectivement, le patch de CaScadeS n'est plus actif
EDIT: j'avais fait une erreur dans le contents.rdf. C'est réparé sur la version 0.0.2.

Nota: les feuilles de styles externes ne sont pas corrigées par le nettoyeur de balises ; c'est uniquement l'éditeur CSS qui a été modifié (les feuilles créées ou modifiées avec CaScadeS auront donc toujours des URLs "relativisées" et des couleurs en héxa).
Il serait peut-être pratique de lancer la vérification des feuilles de style externes depuis le nettoyeur de balises... Peut-être un jour !

Heuuu2, une petite option a cocher pour que ca le fasse en transparent ?

Une option dans HandCoder pour lancer le nettoyeur de balise (sans ouvrir la fenêtre) avant Tidy, ça t'irait ?

[Do-IT]

Une option dans HandCoder pour lancer le nettoyeur de balise (sans ouvrir la fenêtre) avant Tidy, ça t'irait ?

Oui mais Non.

Donc : urlcleaner =

• dans cascade c'est automatique pour les feuilles interne et externe
• en dehors de cascade (code source) il faut passer par le nettoyeur

Si c'est ca une option dans hancoder nettoyerai que le code source ?
Non je dit des betises puisque urlcleaner est installé. Grr ! J'arrive plus a reflechir. Ok pour l'option qui lance le nettoyeur avant tidy !

[Ymai]

Heuu, ca corrige rien dans la feuille de style externe.

Effectivement, mais quand on exporte la feuille de style, le lien est absolu. Et les images liées dans les CSS sont en absolu.
Rien que ça rendait NVU inutilisable "in the real life". En plus du caractère aléatoire du type de lien: une fois c'est absolu, une fois c'est relatif.

Bon, en fait non, je suis injuste. En réalité, ce sont les auto-liens qui ne fonctionnent pas dans NVU: une page qui pointe vers elle-même est toujours en absolu.
Quel est l'intérêt d'un auto-lien, me direz-vous?
Si un menu est identique sur toutes les pages d'un site, un copier/coller du bloc contenant le menu permet d'épargner de l'ouvrage. J'ai constaté que les items qui pointent vers la page où se trouve le menu sont toujours en absolu. Exemples à l'appui (me demander l'adresse en PV).

Mais tout ça, c'est fi-ni.

[Do-IT]

urlCleaner-002-fr.xpi fonctionne sur la feuille externe.
Reste juste le message en haut. (dans la feuille externe)

Quel est l'intérêt d'un auto-lien, me direz-vous?

C'est de pouvoir revenir a la page d'accueil, en general. donc sur la page d'accueil c'est un auto lien

[Kazé]

Ok pour l'option qui lance le nettoyeur avant tidy !

Je vais mater ça.

Heuu, ca corrige rien dans la feuille de style externe.

Effectivement, mais quand on exporte la feuille de style, le lien est absolu.

Avec la version 0.0.2, le lien ET le contenu de la feuille de style externe sont corrigés.

Et les images liées dans les CSS sont en absolu.

Après décortication du code source, il me semble que c'est pour permettre la prévisualisation de la miniature de l'image que l'URL est convertie en URL absolue (!) par CaScadeS...

En réalité, ce sont les auto-liens qui ne fonctionnent pas dans NVU: une page qui pointe vers elle-même est toujours en absolu.

Oui !
C'est agaçant quand on utilise un simple "#" comme lien. Evidemment c'est une URL bidon, mais ça me sert pour faire des info-bulles sans JavaScript (au survol d'une image ou d'un bout de texte).

Si un menu est identique sur toutes les pages d'un site, un copier/coller du bloc contenant le menu permet d'épargner de l'ouvrage.

Il n'y a donc pas de section PHP dans ton tutoriel ???

[Ymai]

urlCleaner-002-fr.xpi fonctionne sur la feuille externe.
Reste juste le message en haut. (dans la feuille externe)

002? Et on la trouve où, cette merveille des merveilles? C'est le Graal?

Quel est l'intérêt d'un auto-lien, me direz-vous?

C'est de pouvoir revenir a la page d'accueil, en general. donc sur la page d'accueil c'est un auto lien

Serais-je même arrivé à me faire comprendre? Je m'épate, ce soir.

[Kazé]

Reste juste le message en haut. (dans la feuille externe)

Je m'attendais à celle-là !
Note que j'ai longuement hésité avant de laisser la ligne "generated with CaScadeS bla bla". J'ai même failli la remplacer par "générée avec CaScadeS + HandCoder, envoyez des sous à http://fabiwan.kenobi.free.fr/" (juste pour lire ta réaction) !

De mon coté, c'est l'indentation des feuilles de style que je n'aime pas. Actuellement :

Code : Tout sélectionner

/* Generated by CaScadeS, a stylesheet editor for Mozilla Composer */

  .regexp { background-color: #ccffff;
    }

  pre { border: 1px solid #6666cc;
    }

Je préfèrerais :

Code : Tout sélectionner

/* Generated by CaScadeS */
.regexp { 
    background-color: #ccffff;
}
pre {
    border: 1px solid #6666cc;
}

Faut en garder pour plus tard, non ?

002? Et on la trouve où, cette merveille des merveilles? C'est le Graal?

Ici, là ou encore là : http://fabiwan.kenobi.free.fr/HandCoder ... 002-fr.xpi

[Ymai]

C'est agaçant quand on utilise un simple "#" comme lien. Evidemment c'est une URL bidon, mais ça me sert pour faire des info-bulles sans JavaScript (au survol d'une image ou d'un bout de texte).

Non, non: j'évoque bien le lien de la page machinchouette.html vers la page machinchouette.html.
Ci-dessous, le code d'une page "loisirs.html". On y voit que le lien vers la page elle-même est en absolu. Et c'est la règle générale. Par contre, les liens vers d'autres pages sont impeccables.
(le code est brut, extrait d'un travail d'élève, tel que produit par NVU)

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title>Mon premier site web</title>
</head>
<body>
<h2 style="text-align: center;"><br>
</h2>
<h2 style="text-align: center;"><br>
</h2>
<div
 style="position: absolute; top: 131px; left: 7px; background-color: rgb(200, 0, 200);"><a
 href="index.html">Accueil</a><br>
<br>

<a href="file:///P:/mon%20site%20web/loisirs.html">Mes loisirs
pr&eacute;f&eacute;r&eacute;s</a><br>
<br>
<a href="chanteur.html">Mon chanteur favori</a><br>
<br>
<a href="chinois.html">Mon portrait chinois</a><br>
<br>
<a href="http://lilie-miss-greek.skyblog.com/">Mon site web
pr&eacute;f&eacute;r&eacute;</a><br>
</div>

<div
 style="position: absolute; top: 22px; left: 150px; width: 600px; background-color: rgb(255, 153, 255); height: 400px;">
<div style="text-align: center;"></div>
<h1 style="text-align: center;">Mes loisirs
pr&eacute;f&eacute;r&eacute;s</h1>
<table style="text-align: left; width: 100%;" border="0" cellpadding="0"
 cellspacing="0">
  <tbody>
    <tr>
      <td>
      <h2>La natation</h2>

      </td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td>
      <h2>Etre en Gr&egrave;ce</h2>

      </td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td>
      <h2>Les anges</h2>

      </td>
    </tr>
    <tr>
      <td><img style="width: 200px; height: 150px;" alt="NATATION"
 src="images/natation2.jpg"></td>
      <td><img style="width: 200px; height: 237px;" alt="grece"
 src="images/grece.gif"></td>
      <td><img style="width: 1px; height: 1px;" alt="anges"
 src="images/anges.gif"><img style="width: 182px; height: 200px;"
 alt="ANGES" src="images/ANGES2.jpg"></td>
    </tr>
  </tbody>
</table>

<div style="text-align: center;"><br>
</div>
<h2 style="text-align: center;"><br>
</h2>
</div>
<h2 style="text-align: center;"></h2>
<h2 style="text-align: center;"><br>
</h2>
<h2 style="text-align: center;"></h2>
</body>
</html>

Si un menu est identique sur toutes les pages d'un site, un copier/coller du bloc contenant le menu permet d'épargner de l'ouvrage.

Il n'y a donc pas de section PHP dans ton tutoriel ???

Ben non, ça doit pouvoir être abordé par des collégiens...

[Kazé]

C'est agaçant quand on utilise un simple "#" comme lien. Evidemment c'est une URL bidon, mais ça me sert pour faire des info-bulles sans JavaScript (au survol d'une image ou d'un bout de texte).

Non, non: j'évoque bien le lien de la page machinchouette.html vers la page machinchouette.html.
Ci-dessous, le code d'une page "loisirs.html". On y voit que le lien vers la page elle-même est en absolu. Et c'est la règle générale.

Oui, j'avais saisi. Je voulais juste dire que le problème se pose exactement dans les mêmes termes quand on utilise des info-bulles CSS à la Eric Meyer (avec un # ou autre lien sur la même page).

Si un menu est identique sur toutes les pages d'un site, un copier/coller du bloc contenant le menu permet d'épargner de l'ouvrage.

Il n'y a donc pas de section PHP dans ton tutoriel ???

Ben non, ça doit pouvoir être abordé par des collégiens...

Dommage.
Un simple chapitre sur l'utilisation de <?php include("menu.html"); ?> pour faire des menus aurait été pratique pour nombre de lecteurs de ce forum... Surtout quand on leur dit que Nvu ne supporte pas les framesets.

[Do-IT]

un extrait de ma feuille externe

Code : Tout sélectionner

#fo_entete { position: relative; height: 30px; margin: 0; padding: 0; background-color: #fc3; border-bottom: 1px solid #008; }
.fo_sous_titre1 { position:absolute; top: 0px; right:260px; margin: -2px 0 0 0; padding: 0; font-size: 12px; color: #060;  z-index:20; font-family: Courier New,Courier,monospace; }
.menu1 a { display: block; margin:0; padding: 3px 6px 3px 6px; width: 99px; background-color: #339; cursor: crosshair; border-top: 1px solid #eee; border-right: 3px solid #fff; border-left: 3px solid #fff; text-decoration: none; color: #fff; }

/* Generated by Do-IT */

[Kazé]

Dans ces cas-là on dit que l'indentation est "optimisée pour les performances au chargement de la feuille !"

[Ymai]

Dommage.
Un simple chapitre sur l'utilisation de <?php include("menu.html"); ?> pour faire des menus aurait été pratique pour nombre de lecteurs de ce forum... Surtout quand on leur dit que Nvu ne supporte pas les framesets.

La question est effectivement récurrente.
Il faudrait donc peut-être que quelqu'un qui a plus la fibre "citoyenne" (ou moins de choses sur le feu) que moi se fende d'un tel tuto.
Dans cette optique, est-ce bien un
<?php include("menu.html"); ?>
qu'il faut proposer?
Un .html ne se doit-il pas d'être complet, <html> <head> <body> </html> </head> </body> et autre fariboles comprises? Ce qui ne serait pas sans poser des problèmes de validité du code en cas d'"include".
Il faudrait donc plutôt un
<?php include("menu.php"); ?>
où "menu.php" serait qque chose du genre

Code : Tout sélectionner

<a href="lien1.html">Lien 1</a><br>
<a href="lien2.html">Lien 2</a><br>
<a href="lien3.html">Lien 3</a>

qui ne contiendrait le code html que du menu.
Et ça, impossible de le gérer avec NVU qui va joyeusement nous corriger ce code brut en HTML valide.
Il faut donc un deuxième outil en parallèle. Pas sûr que NVU soit adéquat.
C'est pourtant l'éditeur Wysiwyg le plus abouti du mond libre, me semble-t-il.

[Kazé]

La question est effectivement récurrente.
Il faudrait donc peut-être que quelqu'un qui a plus la fibre "citoyenne" (ou moins de choses sur le feu) que moi se fende d'un tel tuto.

Moi j'ai pas la fibre citoyenne. Tant pis !

Dans cette optique, est-ce bien un <?php include("menu.html"); ?> qu'il faut proposer?
Un .html ne se doit-il pas d'être complet, <html> <head> <body> </html> </head> </body> et autre fariboles comprises? [...]

La partie à inclure, ça s'appelle un fragment de code HTML. Ca n'est pas du PHP, donc une extension *.php est complètement inapropriée ; traditionnellement, on utilise *.html, *.xml, *.tpl ou *.txt.

Il ne faut surtout pas que ce fragment contienne <html>, <head> ou <body> ; ce qui nous laisse deux type d'outils possibles pour éditer un fragment :

• un éditeur texte : bloc-note, SciTE, Vim, Emacs...
• ou Nvu + HandCoder (tadaaaa !)

On peut inclure un menu dans un site web avec Nvu (+HandCoder) sans avoir recours à un éditeur texte.

Pas sûr que NVU soit adéquat.
C'est pourtant l'éditeur Wysiwyg le plus abouti du mond libre, me semble-t-il.

Nvu EST l'éditeur wysiwyg le plus abouti du monde libre, de loin (c'est aussi le plus abouti "tout court" sous Linux mais c'est une autre histoire) !

[chinon37]

Bonjour Kazé, Ymai, Do-it et les autres (et j'en passes et etc...)

Heuuu3, chez moi, ça marche pô!
j'ai essayé en style interne, sur feuille de style interne, sur feuille de style externe en attribuant une image au body en fond, l'adresse reste en absolu. et en cas de feuille externe, même l'adresse de cette feuille reste en absolu!
Que fis-je qu'il ne faille point que je fasses? le nettoyeur de balises a bien les options cochées... Il me donne un zéro pointé sur toutes les modifications qu'il est censé apporter!
Est-ce une mauvaise manip de ma part?
fichier utilisé: urlCleaner-001-fr.xpi

Bon, d'accord, j'arrive 2 jours après la bataille, j'aurais été mauvais dans la cavalerie.... Kazé, j'avais suivi le lien de ton MP et il n'affichait pas les derniers messages!

[Do-IT]

Je préfèrerais :

Code : Tout sélectionner

/* Generated by CaScadeS */
.regexp {
    background-color: #ccffff;
}
pre {
    border: 1px solid #6666cc;
}

Faut en garder pour plus tard, non ?

Mon css est en 'mode optimisé' seulement parceque c'est plus lisible pour moi, pas pour faire plaisir aux navigateurs. Si je mettais une instruction par ligne, la molette de ma souris serait usée prématurement.

J'ai en tête un éditeur CSS pour Nvu, bien dans l'esprit de HandCoder et complètement différent de CasCadeS II ... J'en garde pour plus tard.

L'ideal serait d'avoir un editeur 'externe' genre scite, mais en onglet en bas dans nvu. Humm chouette l'extension.

Comme dit, je n'attends qu'une seule chose pour commencer a utiliser nvu, c'est un editeur de code en interne.
Mais pour l'utilisateur type de nvu, je pense que la synchro est plus prioritaire, un peu comme le nettoyeur.

Ca t'en fait des choses a garder pour plus tard.