Since this question is completly seperate from the one i just put on the list aswell, i make this a seperate entry
I was wondering about how to style bullet point lists. The only thing i found in the documentation was that i can use my own picture as the bullet point used by putting a line $puce = something into the |mes_fonctions.php.| I have a customer who is using those lists quite alot including many levels and now i want and really need to skin them properly. So is there a place where i can setup layout and/or change the code that is produced by spip. Like for example have different images used for the second level of lists (instead of reverting to standard ul/li tags?) If there is more documentation on the subject please hint me to it (if its french i would need to resort to babelfish or something for translation, but that usually works out ok too)
Since this question is completly seperate from the one i just put on the list aswell, i make this a seperate entry
I was wondering about how to style bullet point lists. The only thing i found in the documentation was that i can use my own picture as the bullet point used by putting a line $puce = something into the |mes_fonctions.php.| I have a customer who is using those lists quite alot including many levels and now i want and really need to skin them properly. So is there a place where i can setup layout and/or change the code that is produced by spip. Like for example have different images used for the second level of lists (instead of reverting to standard ul/li tags?) If there is more documentation on the subject please hint me to it (if its french i would need to resort to babelfish or something for translation, but that usually works out ok too)
Cheers (again)
Chris
I think you can either (old way) set the $puce value in the mes_options.php file (eg : $puce="<img ...>") and may use php conditionnal code. You can also use the #CHEMIN{mypicture.png} inside skeleton and store the picture file into the /squelette directory (for example). Beware the mes_options file is evaluated at each hit (not cached) !
Another way (the better IMHO) is to remove all of this from HTML and use the CSS to set properly the wanted pictures.
I didn't realise before just how vastly different the standard - lists are. So yes i agree using the real bullet lists -* that generate ul/li html tags are the way to go. Too bad i realise this now, because the text formatting shortcuts documentation still mentions the pseudo-format and my customer mostly used them. So is there a way to force that also to generate the same html ul/li as the proper -* lists would do?
Or is it possible to add a text filter that comes before the SPIP, so i could just replace the - lists with -* lists? (I made a javascript workaround that in the finished html page then swaps the dom so i have proper lists for now, but its kind of a nutty solution :D)
Others answered to this problem also, thank you for that. I only replied to this one, because the other answers were similar.
Cheers
Chris
Gilles Vincent wrote:
Hi, I suggest you not to use the pseudo-bullet (picture), but to use
real bullets. With css you can then skin your lists easily.
-* Your horse is:
-** chestnut;
-** bay;
-** black;
-* but my rabbit is
-** white:
-*** angora
-*** or short-haired.
.Gilles
---
On 10/19/07, Christoph Stahl <christoph@ideenbuch.de> wrote:
Heya everyone its me again
Since this question is completly seperate from the one i just put on the
list aswell, i make this a seperate entry
I was wondering about how to style bullet point lists. The only thing i
found in the documentation was that i can use my own picture as the
bullet point used by putting a line $puce = something into the
|mes_fonctions.php.| I have a customer who is using those lists quite
alot including many levels and now i want and really need to skin them
properly. So is there a place where i can setup layout and/or change the
code that is produced by spip. Like for example have different images
used for the second level of lists (instead of reverting to standard
ul/li tags?) If there is more documentation on the subject please hint
me to it (if its french i would need to resort to babelfish or something
for translation, but that usually works out ok too)
Bitte beachten:
TELEFONUMMER UND ADRESSE HABEN SICH GEÄNDERT.
Neue Telefonnummer: 05138 - 70 28 05
Neue Adresse: Christoph Stahl, Marktstraße 25, 31319 Sehnde
______________________________________________________________
Christoph Stahl_Culture Identity_Print_Web_Rettungsgestaltung_
Marktstraße 25_31319 Sehnde_Tel 05138-702805_VoIP 03221910162
So yes i agree using the real bullet lists -* that generate ul/li html tags are the way to go. Too bad i realise this now, because the text formatting shortcuts documentation still mentions the pseudo-format and my customer mostly used them. So is there a way to force that also to generate the same html ul/li as the proper -* lists would do?
yes the "belles puces" does this.
it is included in the "couteau suisse" pluggin.
Or is it possible to add a text filter that comes before the SPIP, so i could just replace the - lists with -* lists?
If using those shortcuts generats proper ul li lists such as :
ul class=level0
li blah blah /li
ul class=level1
li an do on...
that can be very easy to use CSS to skin properly classes level0 level1
level2 ... as well.
But as i do not use such lists very often (or not more than one level) the
spip's generated arrow was good enough for me
Javascript might also be a good deal on a scheme like this :
scanning DOM ...
get element UL
skinning this ul
then if this UL hasChildNodes
get them
skin them
and so on...
But I think CSS is the best.
Cheers.
Etienne.
Or is it possible to add a text filter that comes before the SPIP, so i
could just replace the - lists with -* lists? (I made a javascript
workaround that in the finished html page then swaps the dom so i have
proper lists for now, but its kind of a nutty solution :D)
Others answered to this problem also, thank you for that. I only replied
to this one, because the other answers were similar.
Cheers
Chris
Gilles Vincent wrote:
Hi, I suggest you not to use the pseudo-bullet (picture), but to use
real bullets. With css you can then skin your lists easily.
-* Your horse is:
-** chestnut;
-** bay;
-** black;
-* but my rabbit is
-** white:
-*** angora
-*** or short-haired.
.Gilles
---
On 10/19/07, Christoph Stahl <christoph@ideenbuch.de> wrote:
Heya everyone its me again
Since this question is completly seperate from the one i just put on the
list aswell, i make this a seperate entry
I was wondering about how to style bullet point lists. The only thing i
found in the documentation was that i can use my own picture as the
bullet point used by putting a line $puce = something into the
|mes_fonctions.php.| I have a customer who is using those lists quite
alot including many levels and now i want and really need to skin them
properly. So is there a place where i can setup layout and/or change the
code that is produced by spip. Like for example have different images
used for the second level of lists (instead of reverting to standard
ul/li tags?) If there is more documentation on the subject please hint
me to it (if its french i would need to resort to babelfish or something
for translation, but that usually works out ok too)
Bitte beachten:
TELEFONUMMER UND ADRESSE HABEN SICH GEÄNDERT.
Neue Telefonnummer: 05138 - 70 28 05
Neue Adresse: Christoph Stahl, Marktstraße 25, 31319 Sehnde
______________________________________________________________
Christoph Stahl_Culture Identity_Print_Web_Rettungsgestaltung_
Marktstraße 25_31319 Sehnde_Tel 05138-702805_VoIP 03221910162
Or is it possible to add a text filter that comes before the SPIP, so i
could just replace the - lists with -* lists? (I made a javascript
workaround that in the finished html page then swaps the dom so i have
proper lists for now, but its kind of a nutty solution :D)
On 10/20/07, Mortimer <mortimer.pa@free.fr> wrote:
L'oiseau2nuit idea, of using classes and javascript to style a list seems
overkill when you can just use the css selectors:
ul
ul > li > ul
etc...
to style the different levels.
You can see an example of that in the dist stylesheet for the forums.
Hi, generally you don't need javascript at all. CSS allows you to do a
lot of things : just look for exemple at listamatic
(Listamatic2: nested list options) -- the exemples
are pretty old, but they are quite simple to understand --