Stefanowitsch

Hi @bernhard I have an older project where I am using SCSS instead of LESS files. I want to make use of the SCSS parser function of RockFrontend. 1. I installed the SCSS module 2. I added this code to my ready.php: /** @var Scss $scss */ $scss = $modules->get('Scss'); $watchFiles = $files->find( $config->paths->templates . "styles/css", ['extensions' => 'scss'] ); // compile input SCSS to output CSS $scss->compileIfChanged( input: $config->paths->templates . "styles/styles.scss", watch: $watchFiles, ); 3. My stylesheet is included like this: <? $rockfrontend->styles() ->add($config->urls->templates . 'styles/styles.scss') ->minify(!$config->debug); ?> When opening the website in my browser I get this exception: ProcessWire\WireException Method Scss::compileRF does not exist or is not callable in this context By looking in the StylesArray.php in the RockFrontend module folder, line 293 I can see that this method is called here: $compiler->compileRF($asset->basename, $cssFile, $cssPath, $asset->dir, $style, $sourcemap); But the Method "compileRF" does not exist anywhere inside the RockFrontend folder.

Thanks! Now I understand what was happening. Removing the "int" argument let's me check via "isset" if any of those parameters are passed.

Hi @bernhard While testing my ajax endpoint with RockFrontend I noticed a behaviour. This is more a ProcessWire related theme however, there is nothing wrong with the ajax endpoint feature itself. I am using the ajax endpoints to handle form submissions on my pages. The URL for a request looks like this: /ajax/form?pageId=1401&formId=1418&lang=1016 So I am passing three get variables here: 1. pageId 2. formId 3. lang Inside my endpoint php file I am passing those values with the files->render method to handle the form submission: echo $files->render('elements/_formular',['page' => $pages->get($pageId), 'form' => $pages->get($formId), 'lang' => $lang]); As long as I am calling the endpoint URL together with those parameters, everything is fine. If I just call: /ajax/form I receive a PHP error that one ore more of the variables are "NULL". This is obviously! Now comes the part that I don't really get: I am retreiving the GET values like this via the ProcessWire API: $pageId = $input->get('pageId','int'); But this variable returns two different values, depending on how I output them: bd($pageId); // returns "0" return $pageId // returns "" So to check if I am actually passing values via GET I use the following condition: if (isset($pageId, $formId, $lang)) { echo $files->render('elements/_formular',['page' => $pages->get($pageId), 'form' => $pages->get($formId), 'lang' => $lang]); } But this does not work, the variables are all set to "0" when I am passing no parameter (I would expect NULL). So the question is: How would you elegantly check of one of those variables are set?

Sounds very promising @bernhard! I a past project I had the need of creating and managing recurring events, too. Back then there was no calendar module available for ProcessWire, so I wrote my own logic using PW repeater fields in combination with the RRULE PHP library. The interface for a event page looks like this. In this example the event occurs every third tuesday in every month from 4pm - 6pm. I handle the updates of the dates that are displayed in the frontend via a cronjob that runs every night. The date field then gets updated, based on the set of rules that are set for the event: What is handy feature for me is to get an overview of upcoming events. Either in a classic "calendar view" or maybe in a small list overview like here. I list all events within the current week:

Okay, so you commented out the save method and used the saveReady hook instead? I will try this out! Saving inside the "saveReady" hook brought me some trouble because I got catched in an endless save-loop. Thats why I used the 'noHooks' option here.

Hi @bernhard! I noticed that the Scrollclass Feature has stopped working in RockFrontend (I am on version 3.19.0) https://www.baumrock.com/en/processwire/modules/rockfrontend/docs/javascript/ See line 258 of RockFrontend.js, the variable declaration for "j" is missing here: for (j = 0; j < attrs.length; j++) { This same goes for line 264: scrollpos = window.scrollY; Here is the updated snipped that will work: /** * Add/remove class on scroll position * * Usage: * <a href='#' rf-scrollclass='show@300'>Add class "show" at 300px scrollposition</a> * * Add multiple classes (thx @StefanThumann) * <a href='#' rf-scrollclass='show@300 show2@600'>Add class "show" at 300px scrollposition, "show2" at 600px</a> */ (function () { let scrollElements = document.querySelectorAll("[rf-scrollclass]"); for (let i = 0; i < scrollElements.length; i++) { let el = scrollElements[i]; let attrs = el.getAttribute("rf-scrollclass").split(" "); for (let 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 () { let scrollpos = window.scrollY; if (scrollpos >= y) el.classList.add(cls); else el.classList.remove(cls); }); } } })();

Have you found a solution for specifying multiple "upload_dirs" inside this initial config call? It seems not to work here.

Can someone help me? Each time I create a new project with "ddev config" I have to adjust the then created config yaml file manually (php version, etc.). I know there is a global ddev config file located here: $HOME/.ddev/global_config.yaml As far as I understand I can add some configuration options there and each time I create a new project all the settings should be inherited from this global config file. Unfortunately that does not work, my additions just get ignored. I know I can add the arguments to my initial ddev config call like this: ddev config --php-version 8.3 But I have a few more additions and this command line is way to long just to type away. How do you handle this?

Here's my solution to this. For anybody who might integrate it in a similar way: 1. Create a custom search index field and add it to the page templates that should be included in the search. The idea is that all RockPageBuilder blocks on a page will write "their content" into this field so that when searching for keywords the corresponding page (that includes a block) will be listed 2. Create a method called "createIndex" in each RockPageBuilder block class that you want to include in the search results. For example a simple Textblock would only return its body field: public function createIndex() { return "{$this->body}\n"; } 3 Make use of the Pages::saved Hook in ready.php to save the content of all RockPageBuilder bocks into the search index field: $wire->addHookAfter('Pages::saved', function($event) { $page = $event->arguments(0); $index = ''; // Iterate over all fields on the page foreach($page->fields as $field) { // Check if the field is of the type used by RockPageBuilder if ($field->type instanceof FieldTypeRockPageBuilder) { // Get the formatted content of the field $blocks = $page->getFormatted($field->name); // Further processing of the blocks if needed foreach($blocks as $block) { if (method_exists($block, 'createIndex')) { $index .= $block->createIndex(); } } } } //bd($index); // Save index to custom search index field $page->block_search_cache = $index; $page->save(['noHooks' => true]); }); 4. Inside your search template you can search for pages that contain blocks like this: $matches = $pages->find('block_search_cache%=' . $q);

I just want to see which user did the latest changes on a specific block. In the backend page tree I modified the view like this: This works for pages but you can not see which page builder block (inside those pages) has been edited by which user.

Hi @bernhard! I don't know if this is a RockFrontend or RockPageBuilder related question (or maybe only PageFrontEdit?). But here we go: In the PW backend I can see unter the "settings" tab of a page which user modified this page recently: $modifiedFormatted = date("d.m.y H:i", $page->modified); $lastModifiedByUser = $page->modifiedUser->name; Is it possible to display this information when editing a RPB Block in a modal window, for example on the top? Something like this:

Thanks, bernhard. I will try this out. So basically each block saves it's own content into a hidden field that is part of the "parent" page template. That makes sense, it should work.

I have not tried this before. So I would like to ask if it is -practically- possible to include RPB blocks in the search results. As far as I understand - each block is a separate page - so this makes searching a bit tricky. Because how does ProcessWire know where this particular RPB block is located in the frontend - I mean on which page? If I search for "lorem ipsum" (you get the Idea...) will the search result find the page where a RPB block is placed that contains this string?

@heldercervantes Managing Content Blocks Previews with The RockPageBuilder is actually quite nice and super easy: All you have to do is take a preview-icon-picture and save it directly inside the corresponding block folder. It will show up automatically:

Not it seems that those settings are not part of the Docs (at the moment). Have a look in inside RockPageBuiler.module.php on Line 257. There you will finde all attributes that you can change in the markup: // setting specific to rockpagebuilder blocks 'noBlock' => false, // prevent block icons if true 'addTop' => null, // set to false to prevent icon 'addBottom' => null, // set to false to prevent icon 'addHorizontal' => null, // shortcut for addLeft + addRight 'move' => true, 'isWidget' => $isWidget, // is block saved in rockpagebuilder_widgets? 'widgetStyle' => $isWidget, // make it orange 'trash' => true, // will set the trash icon for rockpagebuilder blocks 'clone' => true, // can item be cloned? 'widgetable' => $widgetable, // can be converted into widget?

That looks good! I have just finished a project with some complex layouts that required some nested RockPageBuilder blocks. And I did it the same way as you. I have multiple layouts block that just render the markup: A layout block looks like this: <?php namespace ProcessWire; use RockPageBuilderBlock\LayoutA; /** @var Page $page */ /** @var LayoutA $block */ ?> <section class="rpb-layouta" <?= alfred($block,["trash" => false, "clone" => false, "widgetable" => false])?>> <div id="div1" class="col-2x1"><?= $block->rpb_cell_2_1_a->render(true); ?></div> <div id="div2" class="col-1x1"><?= $block->rpb_cell_1_1_a->render(true); ?></div> <div id="div3" class="col-1x1"><?= $block->rpb_cell_1_1_b->render(true); ?></div> <div id="div4" class="col-2x2"><?= $block->rpb_cell_2_2_a->render(true); ?></div> </section> Inside there are some nested - custom - RockPageBuilder fields. Inside these fields you can insert various other RockPageBuilder content blocks. Like Text, Images, whatever. This is especially neat when editing the site in the frontend. The "naked" layout block looks like this: Then you can insert content to each of those cells via the nested RPB fields; However I have to say that the backend editing of these blocks is a bit "convoluted". When the project reaches a "final state" I will explain the details in a showcase here in the forum in more detail.

The path seems to be correct. I am using the same path in my font declarations: @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Barlow Regular'; font-style: normal; font-weight: 400; src: url('/site/templates/fonts/barlow-condensed-v12-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } I would try out this advice from @da²

I just installed the Core Module "SystemNotifications". It works as expected: I get a notification when another user is editing the same page in the backend. I have two questions: 1. Changing the date format that is displayed What looks ab it weird is the Date Format: %+2024 I found that you can change the Date format in the module settings, but no matter what i enter here, I always get the same formatting: %+2024 2. Displaying the message when doing frontend editing I am using @bernhard RockPageBuilder for Frontend Editing. Besides from this special module Frontend Editing has been Processwire feature for a long time. I want to display this warning Message in case two users are editing the same page in the frontend, too. How is this possible? (If it is possible at all...) I just discovered that there is ProModule that is a bit more sophisticated: https://processwire.com/store/pro-dev-tools/user-activity/ Does this Module offer the "Frontend Notices" in some way or the oher?

THANK YOU! Disabling mutagen did the trick! ddev mutagen reset && ddev config global --performance-mode=none && ddev config --performance-mode=none Now newly uploaded images have the correct permissions: 644. UPDATE: This is the typical mutagen behaviour: https://github.com/mutagen-io/mutagen/issues/23#issuecomment-345277107 But there is a also a way to have mutagen enabled and still get the correct file permissions: Add this line to your DDEV config.yaml: upload_dirs: - site/assets/files

Hi! Per default all my web projects are located in my "Websites" folder inside my user folder (I am working on a mac). For testing I moved my current ddev project into a different folder, unlisted the project from ddev, started it new and I still have the problem that the file permissions are set to 600.

Lately I switched from MAMP PRO to DDEV. However since then I noticed some strange behaviour: Everytime I uploaded a finished project to a webserver, some assets like images, CSS files or JS files all threw the "403" Error when visiting the website. After a bit of testing I realised that newly created files (like images that are uploaded through an image field) all get CMOD 600 instead of 644. So on my local machine this is no problem, but on a webserver it is! By the way, this is set in my ProcessWire config: $config->chmodDir = '0755'; // permission for directories created by ProcessWire $config->chmodFile = '0644'; // permission for files created by ProcessWire I tested the same project with MAMP PRO and there all uploaded and newly created files get the correct permissions - 644. The downside is that MAMP PRO is awfully slow compared to DDEV.... and I really don't want to switch back. I have absolutely no clue why this is the case? Why do all new files created by ProcessWire get CHMOD 600 instead of 644 - but only in DDEV and not in MAMP? I did some research and checkt the umask setting inside the DDEV container, which look exactly like it should: umask 0022 There seem to be some workarounds like running a script to re-alter the file permissions, but that does not solve my problem in the long run: #!/bin/bash find /path/to/your/uploads -type f -exec chmod 644 {} \;

Yes that works but my problem is - if define a custom font-family here like this: #Headings h1 { font-family: 'myWebFont' } /* My headline 1 */ The stylesheet does not know where and how 'myWebFont' is defined. I need to place this information somewhere in the stylesheet that the editor is using to make it work: @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'myWebFont'; font-style: normal; font-weight: 400; src: url('/site/templates/fonts/barlow-condensed-v12-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } I added this @font-face declaration to my custom editor body stylesheet and it is working there. But not in the Headings Dropdown menu.

Great! This is working. Thank you. Another question. The new styles don't apply to the dropdown menu stylings. Where can I alter those styles so the headlines also use the webfont?

Hello! Has anybody tried this? I want to apply the webfont family that I am using in the frontend of my website to the TinyMCE styles. Per default the editor uses it's own custom stylesheet that defines own font families. So you always this look out of the box: Where can I change these styles? The editor area is embedded via an iframe so external style rules won't apply.

One of the downgrades of front-end editing is indeed the fact that you have to put in some work for making the editor and its appearance not being affected by third party styes. For example I have these overrides in all my projects: .alfred { overflow: visible; } .tox.tox-tinymce-inline { z-index: 100; } This is because the editor toolbar in the frontend sometimes gets overlayed by other elements in the DOM hat have - design wise - a higher z-index for example.