monollonom

(I forgot to update the download link on the PW modules website, it should be good now!)

I just published an update that might be of interest to some: the ability to transpile any MJML code without it being part of a template. From the release note: This new release extracts the transpiling of MJML to HTML into its own public method allowing you to call it for any arbitrary piece of MJML code, instead of having to have the code in a template file: $mjml = "<mjml></mjml>"; /** @var PageMjmlToHtml $pmh */ $pmh = $modules->get("PageMjmlToHtml"); $result = $pmh->transpile($mjml); if($result->code === 200 && empty($result->errors)) { echo $result->html; } By default the options’ values are the ones set in the module’s settings. This new method is also hookable, which means you can for example set different options depending on the template: $wire->addHookBefore("PageMjmlToHtml::transpile", function(HookEvent $event) { $mjml = $event->arguments(0); /** @var Page $page */ $page = $event->arguments(1); $options = $event->arguments(2); if(!$page->id || $page->template != "specific-template") return; $options["relativeLinksParams"] = "utm_campaign=new-campaign-title"; $event->arguments(2, $options); });

Hi @Laksone, Sorry but somehow I forgot to have a look at it. I managed to update the QR code generation to accomodate for bigger content but there is still a limit to this so I added a note in the README and in the fieldtype’s "Details" tab. I also took on the opportunity to do some code cleanup and add the option to set the (interesting) error correction level. Please update the module and let me know if you’re facing any issues.

The blur animation is very laggy for me and impacts the slideshow as well: Screen Recording 2025-08-17 at 20.16.11.mov Most likely it’s because of the blur(0.6px) coupled with the svg filter. I understand why you went for this visually but I think it's unfortunately too heavy...

Quick css fix for the misaligned "Project" button: Add <button> to your css selector: .pw-module-primary-actions a, .pw-module-primary-actions button { } Another note: on the homepage you should add the width and height attributes on the slideshow’s images (maybe even a background-color?) so there’s no layout shift when loading the page: Also I think you could echo the logo’s svgs using file_get_contents to avoid the empty spot like in my screenshot. Lastly I would also advice to respect "prefers-reduced-motion: reduce" for the lottie animations (and have a fallback svg image in case there’s no javascript). It’s quite easy to do by setting the autoplay option using "window.matchMedia('(prefers-reduced-motion: reduce)').matches".

This is the css you want to counter when hovering .uk-card > .uk-card-body > a 🧐

Congrats on the launch @ryan and @jploch 🤝 @diogo for the design. I think it’s a great update! Two small things I noticed regarding the cards: This has to do with the width of .uk-card-body being 100% combined with a padding. I saw you added a max-width but it would be best to use "box-sizing: border-box" instead, so the padding is included within the 100% width. Also re:cards, I noticed there was some js to allow to click anywhere on a card to open its link. A nice css trick I learned is to use ::before on the <a> tag to "cover" its parent. In your case you could use this css: .uk-card .uk-card-body a::before { content: ""; position: absolute; inset: 0; } This way the <a> covers the card and makes the whole card clickable: (btw some external link are not working, e.g. Processwire Weekly, there seems to be a slash wrongly added at the beginning of the href)

This issue has been raised by @adrian as well in the new admin theme thread and aknowledged by @ryan:

Thanks for sharing @ryan. Do the CSS selectors need to be this specific? Or is it because we have to overwrite styles written with less that tend to produce these (thanks to the nested selectors)? For example: .PageListActions a { } /* instead of */ .PageList .PageListItem .PageListActions > li > a { } /* or */ .InputfieldRepeaterItem > .InputfieldHeader { } /* instead of */ .pw .Inputfields .InputfieldRepeater .InputfieldContent .InputfieldRepeaterItem > .InputfieldHeader { }

@ryan I didn’t fully test the new admin yet but I have these few quick questions: Are the "reno" and "rock" styles going to be converted into themes to normalize things? This way it would clarify how to create a new theme if one takes a look at the AdminThemeUikit code. Expect for inputfields.js, is the "templates-admin" folder (or its content) still needed?

Yes, this is an animation that’s triggered when an Inputfield is updated by the js. I hope I remember correctly but I think I added this to my CSS to counter this behavior: .Inputfield[style*="opacity"] { opacity: unset !important; }

Thanks for sharing, I should look into this as I also use this a lot. Does it cache per file or per render call? Or maybe you have a unique name in your $vars?

I wonder if the answer is not in the screenshot you shared: "This setting does not apply if the page is editable to the user as it will always be available for preview purposes" Do you see your issue happening as well when you are not logged in ? Edit: also I think you should use https://processwire.com/api/ref/page/get-languages/ to loop through active languages

(I’m not using AI assistants to code but) if this demand could go through the financial support of ProDevTools/@ryan that would be great

I don’t think it’s good to assume something like no default language = no languages at all. With a button the action is truly delibarate and I think the same as @FireWire that it would be best to keep it as an icon only + tooltip + confirm message to manage space. Which icon though... 😅 Using/tweaking the style of PageListActions: But even with a small string like “Clear all” I’m already picturing it will be too much if you have a bunch of multi-languages fields in the page, so more like: Ideally this should be in consideration / thought through with the new design @ryan is currently implementing. So thanks for bringing this up to him @bernhard!

Mothers are the best beta-testers haha. Maybe the change in the copy is indeed too subtle, but in that case maybe I’d go with your proposal of the Trash icon and the tooltip, shown when you cleared the main language. But like you said in this case this is more related to core than Fluency.

I feel like this is something the editor should know / be told about — the same way editing a page’s title doesn’t automatically update its name — and not something so prominently shown (adding a new button). At first I was thinking of a hook checking for a change in the main language and then adding a message to the Inputfield indicating they might want to update the other languages as well, something like this: But then I thought it could be more subtle / embedded within Fluency’s UI, maybe the button’s text could be "Translation Available" when idle, "Translate to all languages" when main language is changed (non-empty) and "Clear all languages" when the main language is cleared / empty AND the other languages have a value (otherwise, default to "Translation Available"):

@Cybermano you could also use this module I made https://processwire.com/modules/page-mjml-to-html/, though you lose the ability to see your changes live in VSCode. Pros and cons like @bernhard says 🙂

Regarding the API reference, I always wondered if there could be a way for you to add links to pages that reference a particular method and go in deeper details about its usage. One such case could be to link the blog post about output formatting in the $page->of() documentation. Maybe there’s already something in place like this and then it may just be a question of adding/updating links. Thanks and I’m (we’re all!) looking forward to seeing the new website! (and I hope all goes well for your HVAC installation)

You’re welcome! Another small remark from quickly using it: maybe you should only allow to drag-and-drop when using the handle, instead of the whole bar. If I try to select text (or double-click to select the whole text) I cannot because it moves the bar. Also if I happen to release the drag on a text field, it appends the bar’s position. simplesignature.mp4

Nice one, I can see myself using this for a quick email signature! Just one small UI issue: you need to specify "min-width:0" on .input-bar__field otherwise the bold icon doesn’t fit in on links (on Firefox at least):

You’re not the first one asking yourself this question 😁

Is it possible the output formatting is off within the saveReady hook? A PageImage will always default to a PageImages regardless of this option when the output formatting is off.

The name of the language does not automatically apply as a url segment for the homepage (otherwise you would have /default/about instead of /en/about). For this you have to edit the name of the root page, which is actually what you did in the database directly.

In the meantime this came out https://processwire.com/modules/page-edit-restore/ and it can definitely mitigate this issue of losing your edits.