Stefanowitsch

Always interesting how people approach ways to create and manage content in ProcessWire in so many creative and different ways. For handling and sorting different content sections on a page the Repeater Matrix was my go-to module in the past. Nowadays I use the RockPageBuilder from @bernhard which is far better in my opinion ?

To use background images I use the following plugins: 1. Lazysizes: https://github.com/aFarkas/lazysizes 2. The Lazysizes bgset extension: https://github.com/aFarkas/lazysizes/tree/gh-pages/plugins/bgset Note: The bgset extension must be loaded before the Lazysizes plugin. That's why I disabled the "Use Lazy Loading" in the module settings and load both files above manually in the correct order. To make use of a background image this code here works for me: <div class="img-title-wrapper lazyload" data-sizes="auto" data-bgset="<?php echo $image->size($imgFormat)->srcset() ?>"> /* your content */ </div>

Thanks! I found out you can change the label text for the page reference field in the field settings itself.

Wow, it does indeed work! All you have to to is 1. Create a page reference field 2. Select the parent page in the field settings (which is the repeater page in that case, hidden under the admin site in the page tree!) 3. Now you can select the repeater items from there like a page reference The only drawback is that this list shows the programmatic created names that are used for the repeater item pages by the system. THIS can be solved by changing the label in the field settings:

Hi have a general question if this would be possible: I have a page that contains a repeater. This repeater holds an image and a cite for each repeater item. On the page itself all repeater items (= all cites) should be visible in a carousel. But on other pages I would like to select a specific single (!) cite from that repeater to be shown. This cite should be selectable from a list, not just hard coded as a ProcessWire selector with the ID of the repeater item... I know that this could be achieved with a page reference field. But in that case I can't make use of the repeater field but instead have to create a subpage for each cite I want to add. The repeater solution seems to be more straight forward.

I have the need to change the text colors in a TinyMCE field. There seems to be a plugin available for this case: https://www.tiny.cloud/docs-4x/plugins/textcolor/ But in the field settings this plugin option is missing: What could be a workaround for this? SOLVED: The documentation link was for version 4... in the current version 6 you have to insert the "forecolor" setting into the toolbar. That's it!

@joshua Great! Thank you very much for the fast and simple solution.

Yes I have to observe it some new bugs will appear. I don't even know why fastclick solves this issue, maybe it would be enough to find out that little piece of code inside this library that does the trick and just extract hat.

If anyone is looking for a workaround: Using JS fastclick solves this issue for me. This seems to be an iOS related problem. If you google for "iOS double tap link issue" you'll find plenty of threads. Mostly they have to do with CSS hover pseudo elements but this was not the case here.

It would be a very useful feature. Setting up PrivacyWire from ground up is a bit of work and not all my sites need it. It would be easier to be able to switch it on/off depending on the clients needs.

Is there a simple way to turn the cookie banner active/inactive in the module settings? I would like to prepare a default banner for my projects that is not shown by default.

@bernhard I made a little tweak to the rf-scrollclass script. Okay it was not me directly. Instead I asked a certain AI if it is possible to alter the script... just for scientific purposes of course ? I want to add multiple rf-scrollclass attributes to one DOM element: <header class="rf-scrollclass" rf-scrollclass="scrolled@20 scrolledmobile@15"> Now the class "scrolledmobile" gets added at 15px, the "scrolled" class gets added at 20px - all on the same element. This gives me the ability to use css media queries for some responsive tweaking of the position of my fixed navbar (for example!) header { position: absolute; top: 40px; width: 100%; z-index: 100; @media @min-m { &.scrolled { top: 20px; position: fixed; } } @media @max-s { top: 30px; &.scrolledmobile { top: 15px; position: fixed; } } } Long story short, here's the updated script: (function () { let scrollElements = document.querySelectorAll("[rf-scrollclass]"); for (i = 0; i < scrollElements.length; i++) { let el = scrollElements[i]; let attrs = el.getAttribute("rf-scrollclass").split(" "); for (j = 0; j < attrs.length; j++) { let parts = attrs[j].split("@"); if (parts.length != 2) return; let cls = parts[0]; let y = parts[1] * 1; window.addEventListener("scroll", function () { scrollpos = window.scrollY; if (scrollpos >= y) el.classList.add(cls); else el.classList.remove(cls); }); } } })();

Awesome! It is working now.

I included the script in my head like this: <? $rockfrontend->scripts() ->add($config->urls->templates . 'scripts/uikit/uikit.min.js') ->add($config->urls->templates . 'scripts/uikit/uikit-icons.min.js') ->add("/site/modules/RockFrontend/scripts/rf-scrollclass.js", "defer") ->minify(!$config->debug); ?> When minify is set to "true" this is rendered in the <head> section ("defer" missing):

@bernhard can you take a look? When using the minify function of RockFrontend the "defer" attribute gets lost. So the script will never fire. A workaround for me was to wrap the script into a JS "DOMContentLoaded" Function.

My interest in in RockFrontend was initiated as the module was launched last year: At first only because of the auto-refresh feature. Being tired of hitting F5 all the time that feature alone (!) made development far more enjoyable for me. Even back then RF offered many many features, most of them I still don't use today (shame on me!). Plus - @bernhard is constantly adding new features to this module and I have to say that it's hard to keep track sometimes. For example I just learned "by accident" about the new rf-scrollclass feature ? So simultaneously you have to keep 3 different places up-to-date when new changes arrive: - Github - The PW module page entry - The module thread in the PW forum oh and also Youtube ? Therefore I can agree - I find myself from time to time looking for "that one thing that I read" and I don't find it anymore. In that case I ask Bernhard personally via PM like "how do I do this and that?". If it's something that is not supported by RF yet but would be useful it is not unlike that Bernhard will include it in a new version. I think people have to see RockFrontend as a big toolbox. You don't need everything in it. You only grab the tools you need for your current task.

Can someone explain to me what this means? In case of best-practice. Usually for the sender address I use something like noreply@mydomain.com but this address does not send the mail actually. In fact I have a separate address like mailer@mydomain.com (as SMTP user in the module settings) which sends out the mails from the forms on a website. As far as I understand those addresses have to match in some cases?

I want to show you a project that I started developing in summer of 2022 and that went online in january 2023. Kulturhaus Wilster ("Arts Centre Wilster") https://www.kulturhauswilster.de The Kulturhaus Wilster - also called "Wilster's living room" by many visitors - is a socio-cultural center in the heart of Wilster. Wilster is a small City located north from Hamburg, germany. Despite the fact that this is a small venue they offer large amount of events. The events range all the way from concerts to theatre and everything inbetween! The old version of the site was a super simple WordPress website in a black-and-white only color scheme. In my opinion it did no justice to the very colorful program that the Kulturhaus offers so I tried my best to bring some color into the game. The whole website should have a shabby-chique look combined with clean, modern elements. The Homepage offers a preview of the next 8 upcoming events. A blog section is also included and the latest post is displayed next to the event calendar book as PDF download. The event pages offer a quick-reservation form (tickets are not sold online) and a quick look to the next upcoming events in the sidebar. The website features a large event calendar. It was a really nice exercise in using ProcessWires very own paging and selector features. Events can be searched and filtered by type (and month), too. All with a few lines of code only. For example "Look for events that take place in the future in a specific category" $events = $pages->find("select_event_cat.title~|%=$c, template=event, date_event>=today, sort=date_event, sort=time_from, limit=6"); Besides that the website features some colorful content pages with large images, galleries, textboxes and some teaser elements. The editors of the website are able to display all facets of the Kulturhaus this way. Tech Talk: Frontend Framework is Bootstrap 4.6 ProcessWire Modules used on this one are: - WireMail: SMTP (https://processwire.com/modules/wire-mail-smtp/) - SEO Maestro (https://processwire.com/modules/seo-maestro/) - All in one minify for asses (https://processwire.com/modules/all-in-one-minify/) - PageImageSource for webp image srcsets (https://processwire.com/modules/pageimage-source/) - JkPublishPages is used for time-controlled publishing of the blog posts. Please check out this module! Thanks @Juergen - @bernhards great RockFrontend was also used. In this particular project only the autorefresh feature (because this module was brandnew back then and development of the page was almost done). But even "only" using autorefresh makes it worth using it! Please have a look:

I just used this module in a project where I needed to add a line break into a headline field that does not allow HTML tags. Normally you would just insert a <br> tag. Sometimes you have this case where you need just this one little tweak and don't want to change field settings globally or create a new field/setting just for a single purpose. For example: How do you get a linke break into this headline when HTML is now allowed in the field settings? You could shrink down the parent container in the front end to "force break" the text. But this is kind of unpredictable as you never now if the client changes the text at one point in the future. So here's my solution. I can define line breaks via the @-sign like this: Not without some custom code of course: $wire->addHookAfter("TextformatterRockDown::replace", function ($event) { $str = $event->arguments(0); $str = preg_replace("/@/", "<br>", $str); $event->return = $str; }); This is the result:

A big shout-out and thank-you to @bernhard for keeping on improving the RockFronend. (and the whole Rock-EcoSystem) continuously. I asked for a minify-feature and here it is! I am using RockFrontend in every project now as it combines some must-have features for frontend development (IMHO!). Today a new feature was added (or lets say improved as auto-minify was included before) The Minify Feature (for Styles and Scripts!) See the Wiki entry here Lets start simple: How do I include stylesheets with RockFrontend in the first place? RockFrontend always had the feature to bundle stylesheets via the styles() function. For example I am loading some LESS partials into my header like this. You don't have to use LESS files, regular CSS files work the same. Note: Since RockFrontend offers LESS support you can add those files directly, no need to compile them and add the CSS files. For this you have to install the ProcessWire Less module. <? $rockfrontend->styles() ->add($config->urls->templates . 'styles/less/uikit/_custom-import.less') // add single LESS or CSS file ->addAll($config->urls->templates . 'styles/less/project') // point to folder to include files automatically ->addAll($config->urls->templates . 'styles/less/custom') ?> The result in this case is a single compiled CSS file that will be included in your head automatically. RockFrontend is very smart. You don't have to include tons of partial LESS project files here. Just use the addAll() function and point to a folder where your assets are saved and the module does the import for you. This is how my folder structure looks like. If I create new LESS files in there, they will be added and compiled automatically at runtime. How to minify For debugging and development purposes I don't use the minify feature. Instead I use it on the staging server exclusively. To generate a minified version of your stylesheet just add minify(true) <? $rockfrontend->styles() ->add($config->urls->templates . 'styles/less/uikit/_custom-import.less') ->addAll($config->urls->templates . 'styles/less/project') ->addAll($config->urls->templates . 'styles/less/custom') ->minify(true); ?> If you want to chain the minify function it to your debug-mode state you can do it like this (my preferred solution). <? $rockfrontend->styles() ->add($config->urls->templates . 'styles/less/uikit/_custom-import.less') ->addAll($config->urls->templates . 'styles/less/project') ->addAll($config->urls->templates . 'styles/less/custom') ->minify(!$config->debug); ?> That's it! Does minify work with Scrips? Yes, exactly the same. But you make use of the scripts() function in this case. <? $rockfrontend->scripts() ->add($config->urls->templates . 'scripts/script1.js') ->add($config->urls->templates . 'scripts/script2.js') ->add($config->urls->templates . 'scripts/script3.js') ->minify(!$config->debug); ?> Note that these script files are not bundled (even if you chose minify false). Instead they all come out as minified versions separately. I find that this workflow I straight forward and it combines some of the best features that RockFrontend offers! If you combine this with the awesome autorefresh feature, frontend development becomes a breeze!

This entry is added to the exceptions log. Maybe it's not a problem of your module at all as it seems but has to to with the latest dev version? I have no idea why this is happening, though. No Template specified (in /wire/modules/Process/ProcessTemplate/ProcessTemplate.module line 760)

@Richard Jedlička I've been using this module for years and it is really a helper. After upgrading to PW Version 3.0.213 dev (!) I encounter an error when I want to edit the page template via the quick link. The other quick links for the fields are working fine. Heres the message: #0 /Users/XXX/XXX/wire/core/Wire.php(413): ProcessWire\ProcessTemplate->___executeEdit() #1 /Users/XXX/XXX/wire/core/WireHooks.php(952): ProcessWire\Wire->_callMethod('___executeEdit', Array) #2 /Users/XXX/XXX/wire/core/Wire.php(484): ProcessWire\WireHooks->runHooks(Object(ProcessWire\ProcessTemplate), 'executeEdit', Array) #3 /Users/XXX/XXX/wire/core/ProcessController.php(350): ProcessWire\Wire->__call('executeEdit', Array) #4 /Users/XXX/XXX/wire/core/Wire.php(413): ProcessWire\ProcessController->___execute() #5 /Users/XXX/XXX/wire/core/WireHooks.php(952): ProcessWire\Wire->_callMethod('___execute', Array) #6 /Users/XXX/XXX/wire/core/Wire.php(484): ProcessWire\WireHooks->runHooks(Object(ProcessWire\ProcessController), 'execute', Array) #7 /Users/XXX/XXX/wire/core/admin.php(160): ProcessWire\Wire->__call('execute', Array) #8 /Users/XXX/XXX/wire/modules/AdminTheme/AdminThemeUikit/controller.php(15): require('/Users/sthumann...') #9 /Users/XXX/XXX/site/templates/admin.php(15): require('/Users/sthumann...') #10 /Users/XXX/XXX/wire/core/TemplateFile.php(328): require('/Users/sthumann...') #11 /Users/XXX/XXX/wire/core/Wire.php(413): ProcessWire\TemplateFile->___render() #12 /Users/XXX/XXX/wire/core/WireHooks.php(952): ProcessWire\Wire->_callMethod('___render', Array) #13 /Users/XXX/XXX/wire/core/Wire.php(484): ProcessWire\WireHooks->runHooks(Object(ProcessWire\TemplateFile), 'render', Array) #14 /Users/XXX/XXX/wire/modules/PageRender.module(575): ProcessWire\Wire->__call('render', Array) #15 /Users/XXX/XXX/wire/core/Wire.php(416): ProcessWire\PageRender->___renderPage(Object(ProcessWire\HookEvent)) #16 /Users/XXX/XXX/wire/core/WireHooks.php(952): ProcessWire\Wire->_callMethod('___renderPage', Array) #17 /Users/XXX/XXX/wire/core/Wire.php(484): ProcessWire\WireHooks->runHooks(Object(ProcessWire\PageRender), 'renderPage', Array) #18 /Users/XXX/XXX/wire/core/WireHooks.php(1060): ProcessWire\Wire->__call('renderPage', Array) #19 /Users/XXX/XXX/wire/core/Wire.php(484): ProcessWire\WireHooks->runHooks(Object(ProcessWire\Page), 'render', Array) #20 /Users/XXX/XXX/wire/modules/Process/ProcessPageView.module(184): ProcessWire\Wire->__call('render', Array) #21 /Users/XXX/XXX/wire/modules/Process/ProcessPageView.module(114): ProcessWire\ProcessPageView->renderPage(Object(ProcessWire\Page), Object(ProcessWire\PagesRequest)) #22 /Users/XXX/XXX/wire/core/Wire.php(416): ProcessWire\ProcessPageView->___execute(true) #23 /Users/XXX/XXX/wire/core/WireHooks.php(952): ProcessWire\Wire->_callMethod('___execute', Array) #24 /Users/XXX/XXX/wire/core/Wire.php(484): ProcessWire\WireHooks->runHooks(Object(ProcessWire\ProcessPageView), 'execute', Array) #25 /Users/XXX/XXX/index.php(55): ProcessWire\Wire->__call('execute', Array) #26 {main}

Thank you! I found an old amazon tablet here (android) and there the button click events are working fine too. This looks more and more like an iPhone bug.

Yes I can confirm now hat everything works as expected.

I'll send you a PM with some screenshots of my page structure and the settings.