Extension talk:TemplateStyles

I've migrated from an older version of MediaWiki to 1.42 and have run the migration process.

On this version, the extension is broken for me. Any page that uses templatestyles errors:

[28f87f8c8bbc938d5c805a53] 2024-09-24 22:59:30: Fataler Ausnahmefehler des Typs „Error“

I don't know the exact translation, but a direct translation would be "Fatal Uncaught Error of Type 'Error'"

All the usual debugging steps don't work either. I've set the following, and nothing is output on the page nor written to the log file:

error_reporting( -1 );

ini_set( 'display_errors', 1 );

$wgDebugDumpSql = true;

$wgDevelopmentWarnings = true;

error_reporting(E_ALL);

$wgDebugLogFile = "/var/log/mediawiki/debug.log";

I've also tried disabling all other extensions to make sure this is not a combination of two Issues breaking.

Any idea how I could further debug or fix this issue?

I believe this has something to do with the sanatization of the CSS or the sanatized CSS space? All existing pages and articles that contain templatestyles, including the existing CSS pages are broken. When trying to create a new css page, I get the error and the changes are not submitted.

My mistake: I read through everything several times, but somehow overlooked the part that said the git repo is not ready to go. Downloaded it through the normal download now and it works.

Classic :) Good for you!

Every time I install it, I get a blank screen. I've tried setting it to things and that still doesn't do anything. This has made me gone crazy.

I've tried so many things. Installing it normally and from git.

Everything I try, NOOOPE, it doesn't work. I've googled everything related to this glitch. Yet there's no result besides something stupid and unreliable.

Hi my friend. Please see Manual:How_to_debug otherwise it's impossible to help you. But double-check that you are installing the right version of this extension, on the right extension of MediaWiki.

Still shows a blank screen when debugging. I am using MediaWiki 1.41.1, with the PHP version being 8.3.8.

@Valerio Bozzolan

My friend please carefully read the above page, look for errors in your webserver logs, and in your PHP logs, and in your MediaWiki logs. Read the section "Setting up a debug log file". If it does not work, contact your hosting provider to try to provide these information, so you can share them. Thanks

Can the tag have content?

Or is it always self-closing with />?

I'm asking because Visual Editor has an inspector for tags. It shows a textarea. Can it ever have any relevant content?

It can't.

ExtensionDistributor issues, tracked in T363063

Since User:Clump just chose to delete the feedback:

That "4 year old report" has the exact error message I got when I tried to use this extension ("Class 'Wikimedia\CSS\Parser\Parser' not found"). I downloaded the version for 1.41 from the extension page, and that version is obviously missing the software, which the extension page says "should not happen anymore".

So something should be done here, and that something is certainly not simply deleting feedback and talking about some obscure "support desk" in the edit summary, which most users will never see. Most unhelpful behavior here by User:Clump.

Putting a comment in the middle of the documentation is not "feedback". Thanks for taking the time to do it the proper way. Filed as T363063.

I'm using a docker image of 1.40.x and a VM running 1.35.x, and whenever I try to put a wiki table inside a Colored box template, all I get is colored box with one curly opening bracket. That's it. I'll share my code below:

{{Colored box|title = General Documents|content=
{| class="wikitable"
|+ Department Specific Documents
|-
! Name !! Maintainer !! Link
|-
|  Orientation
| 
| [[Onboarding]]
|-
|Design Blueprint
|The Office
|[[Design Blueprint]]
|-
|Orientation
|Other
|[[Other Onboarding]]
|}
}}

This requires the TemplateData & TemplateStyles Extension to be loaded, and the Coloredbox template.

See Help:Extension:ParserFunctions#Escaping_pipe_characters_in_tables.

Thank you! I'll check that out.

Is there a way to allow display: contents; or display: subgrid; per wiki?Alexander Mashin ^talk 08:40, 21 September 2023 (UTC)

Not without adding it to the validation rules. Feel free to file a bug for css-sanitizer.

Hi everyone.

First of all, thanks for your future answers. This problem keeped me awake for an entire ngiht. I've been using MediaWiki for a couple hours only, and i figure it out how to use Infobox. But I got a problem with Templatestyles, on my Infobox.

La page Modèle:Infobox/Pictogramme/persofiction.css doit avoir un modèle de contenu « CSS nettoyé » pour TemplateStyles (le modèle actuel est « wikitexte »).

Translation time : It is says, that persofiction.css, must be "css cleaned" (don't know what thats means). And when i "clean" it (i delete what's inside), the message, is that persofiction.css in not existing.

Here what I type in persofiction.css :

.entete.persofiction { background-image: url("//upload.wikimedia.org/wikipedia/commons/3/37/Picto_infobox_masks.png"); } /* persofiction */

I really need to understand what's going on over here, because, it makes me crazy.

Thanks all.

Modèle:Infobox/Pictogramme/persofiction.css has the wrong content model, it should be sanitized CSS. Probably a wiki configuration problem (the page should have been created with that model in the first place), but for this specific page you can change it via page information (on the sidebar menu) -> change content model.

Ok, so i did what you said. I fund the way to change, but i got an error when i try.

[36e331be38efefa4915a14c8] 2020-04-27 22:13:15: Erreur fatale de type « Error ».

I'm not sure what I've done wrong when I've install Mediawiki. Is that something to do with cache ? Or with the GNU diff ? That was the two only things that were missing. I have to precise that i'm working with Wamp on Windows, because I don't want my wiki to be seen by a bot. Not sure that help

Hard to tell without knowing what the error is. See Manual:How to debug.

HirderWiki, I hope you figured out your problem. If it's any consolation, I've experienced both of the things you describe, although, as Tgr said, it's hard to surmise exactly what your "fatal error" pertains to unless you enable, for example $wgShowExceptionDetails, or send the debug messages to a log file.

I have experienced some odd behavior regarding content models since upgrading wikis to 1.35.x, which could be similar to the problem you're having with TemplateStyles. In my case, "Page information" (in the "toolbox" section of the sidebar with the Vector skin) shows the correct content model, but I still get errors about content models when I try to #invoke modules, or I don't get the fancy CodeEditor editor when I try to edit pages with a CSS content model. Setting the affected page's content model—from "Page information" in the sidebar—to something like "plain text" and then back again to its original content model like "Scribunto" or "Sanitized CSS" seems to fix this problem for me.

A side note «CSS nettoyé» translates to "Sanitized CSS" in the English localization and it's just the designation that CSS pages to be used with Extension:TemplateStyles receive. It's not meant to imply that you need to do anything to "clean" it. If you're trying to use a page with TemplateStyles and it has the wrong content model, change it to «CSS nettoyé» as I described above.

@Ernstkm content model storage was revamped in 1.32, see Requests for comment/Content model storage, T182682 and populateContentTables.php.

Useful context, thanks!

Hi I have a question, will this extension work for Mediawiki 1.35 versions?

@Quarnds I updated the information box on the extension page to better reflect what's supported by current and previous versions of the extension. Please start a new thread for a new question in the future, though.

Okay thanks, <3

Update is coming (I forgot I had writing this).

So, nothing have change. I still have problem, and I don't know how to fix it. Even, when I put $wgShowExceptionDetails (for other reason), I don't see a clear error.

But what I can tell you, it's that, I had found a solution (I don't how), and my Infobox worked fine, until I upgraded to 1.35.7. I had to reinstall TemplateStyles, and I still have these problem.

And to be honest, the solution brought here, doesn't help at all. I didn't find "Page Information", or something like that.

Here's what I got on the top of my Infobox. . So i decided to check my Infobox Model page, and the same errors appears on my exemple uses on the documentation page.

So, I checked Modèle:Infobox V3/Début that is on the top of my Infobox, and ... Boom. Same errors again (La page Modèle:Méta documentation de modèle/styles.css doit avoir un modèle de contenu « CSS nettoyé » pour TemplateStyles (le modèle actuel est « wikicode »). Erreur de script : le module « Documentation » n’existe pas.).

Do I have to install something ? or to reinstall something ?

Is Modèle the Scribunto namespace? This is probably T200914 then (which was fixed in 1.33 but that will only affect pages created after the upgrade).

Scribunto is the name of an extension that is in the MediaWiki based installed extension since version 1.30 I guess.

I don't know. For a comparaison, Modèle is like this one https://en.wikipedia.org/wiki/Infobox. It is the same process.

background-clip:text is not supported by Chrome

It seems that background-clip:text cannot pass the sanitizer ?

I discovered that background-clip:text is not supported by Chrome

The Wiki I edit is on MW 1.31.7 with plans to update to 1.35 in mid-year. Our sanitization interpreter seems to be rather out-of-date: transform:translateX(x); is marked illegal – there is a workaround with translate(x,0), so we can still make do with it.

My main problem comes from transform:translate(x1,y1) translate(x2,y2); being marked illegal – In fact, it appears that any combination of multiple transform functions inside the same transform property is considered illegal.

I hope this can be (or is already, considering our geriatric MW version) addressed in a newer version of TemplateStyles; in the mean time, I wonder if there is any workarounds I can try?

My particular use case...

I am trying to create a CSS animation where a longer string of internal link scrolls from the first letter to the last inside a narrower container. If I boil down the HTML and CSS a bit, they would look like:

<div class='outer-container'>
...
  <span class='container long-text-scroll'>
    [[Link|A long string of descriptions]]
  </span>
</div>

/*.outer-container has position:relative*/
...
.container {
    position: absolute;
    right: 0;
    bottom: 18px;
    width: 60px;
    height: 16px;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
}

@keyframes long-text-scroll {
     0% {opacity:1;transform:translate(0,0);}
    75% {opacity:1;transform:translate(-100%,0) translate(60px,0);}
    85% {opacity:1;transform:translate(-100%,0) translate(60px,0);}
    87% {opacity:0;transform:translate(-100%,0) translate(60px,0);}
    88% {opacity:0;transform:translate(0,0);}
    90% {opacity:1;transform:translate(0,0);}
    99% {opacity:0;transform:translate(-100%,0) rotate(45deg);}
}

.outer-container .long-text-scroll>a {
    position: absolute;
    top: 0;
    left: 0;
    animation-name: long-text-scroll;
    animation-duration: 6s;
    animation-timing-function: cubic-bezier(0.15, 0, 0.85, 1);
    animation-iteration-count: infinite;
}

This style is applied to multiple instances of texts where they are longer than 60px. I believe that for the first-to-last-letter effect, I must use multiple translate functions in the same transform function: the -100% to align the end of text to the left edge, the +60px to move the end back to the right edge. The animation keyframe can only be defined in a style sheet, so I can't use inline definitions; Perhaps I can ask my SysOp to use widget, but that is not ideal.

Thanks in advance for any suggestions.

Old-style quick and dirty way: create a CSS class inside your common.css and then use it.

The CSS sanitizer is largely stuck in the state in which it was created, I doubt updating the extension would change anything. If you feel adventurous, you can update the rules yourself (see Extension:TemplateStylesExtender for an example; it can be done without changing extension code). Otherwise, as Valerio says, you'll have to define the rule elsewhere.

I decided to try out the newest copy of TemplateStyles as of yesterday on my local testing MediaWiki instance, and what I have up there triggers no warning, and I saved it as sanitized CSS with no complaint from the server. Though I am not familiar with php syntaxes, StylePropertySanitizer.php seems to contain entries that addresses my issue (combining multiple transform functions inside the same transform property).

Meanwhile, the wiki site I edit won't even let me use percentages in translate()... I will just assume that this is caused by a really out-of-date TemplateStyles build and pepper the SysOp about updates then.

I don't have the privilege to edit site-wide common.css, and using it seems to be a bit overkill as the animation will probably affect only one or two pages – especially when the planned update should do the trick.

Anyways, thank you Tgr and Valerio for the help!

There was a big update three years ago which included transforms. I thought that was pre 1.31 but apparently not... apologies for the misleading advice.

so, building some html construct, i tried to add to templatestyles something line this:

.skin-minerva .myclass_X { display: none; }

however, this does not work, since the extension adds another class .mw-parser-output, and since the skin class belongs to the body, no element matches

.mw-parser-output .skin-minerva .myclass_X { display: none; }

i think the extension should treat classes that looks like skin-XXXX nicer, and parse

.skin-minerva .mw-parser-output .myclass_X { display: none; }

instead, so i can choose to be "skin sensitive".

peace.

See the FAQ.

Thanks. My bad. Peace.