Leaderboard

Hello everyone, I spend my sunday hacking a playground for the new admin theme together. Unfortunately it took almost the whole sunday, Fortunately it was raining anyway. If you find bugs or annoyances, please feel free to tell me about them. What is it? It is a backend with an integrated skin editor. In this weeks blog post @ryan showed how easily skinnable the new admin theme is. Now that can be done online without having to set up ProcessWire and LESS compilation (I did that for you). Show me http://pwadmin.youbility.de/processwire/ username: admin password: admin123 Why did you do that? I really think the new backend is one of the three key factors for ProcessWires future success (as well as the new website and the documentation; basically the things a user sees first when he's deciding for a CMS). Many many weeks ago, when Ryan introduced the new theme, he said he will need help from the designers in the community to create the best experience possible. As far as I've seen, since then there was not that much input from the community. I hope a ready-to-run theme editor can improve that a bit. How does it work? Right of the search field there's a new icon which opens the editor. Simply create a new skin and start playing with it. The skin will be available throughout all the session, even if you refresh or change to another skin. When you log out or lose your session the skin will be gone, so save your final result somewhere else too!! What other features will come? Probably none, unless there's something heavily requested. I could probably add something to store the skins permanently through LocalStorage. Or I could add more possibilities for customization than just the LESS file. But first I'd like to see if this is used and there's even the need for those features. Can I show my created skin to others? Of course. Right now just "default" and "pw-theme-reno" are public. I would love to show more skins there. Just post the content of your skin in this thread and I will add them to the public skins. I hope you find it useful and it helps making the most efficient and polished CMS backend out there.

They're marked translatable inside /wire/modules/Process/ProcessPageList/ProcessPageRender.php

Although your approach would be a bit faster (less function calls overall), it can be turned into a hook and be called on any class that extends WireArray, basically any collection returned by ProcessWire API // /site/ready.php wire()->addHookMethod('WireArray::chunk', function (HookEvent $e) { $chunkSize = (int)$e->arguments(0) ?? 1; $e->return = array_chunk($e->object->getArray(), $chunkSize); }); A common use case is to build grids <?php $myPages = $pages('template=my-template'); ?> <div class="grid"> <?php foreach ($myPages->chunk(5) as $chunk): ?> <div class="row"> <?php foreach ($chunk as $item): ?> <div class="col"><?= $item->title ?></div> <?php endforeach; ?> </div> <?php endforeach; ?> </div>

The page tree in the sidebar can be a little inconvenient at times, when the sidebar is small and the action buttons span on multiple rows or on mobile devices. I made them open in a drop-down on click. Here's a codepen.

Took some time why it's not working there but finally found it - the CSS rule is active only above 960px screen width and the panel width usually below this. I'll fix this in the next release. Probably if you zoom the page out you'll see too. I've checked the new UIkit theme and it's not bad. From AOS pov I saw only the language switcher that is misplaced but surely there are others too. I'll wait until more users will start to use it and if there will be too many AOS-related complains I'll start to fix them. I would be also happy if there would be only one theme to support.

It's often better to use a PW page for your AJAX url than a standalone PHP file - just create a special template / template file / page for the purpose and call it in your AJAX function. That way everything in PW, init.php, etc, is available just like normal.

While ProcessWire and WireArray does not have support for array_chunk, there is a simple way to achieve this. With array_chunk() you can easily add DIVs to a foreach loop, without having to set up counters when using general PHP (hat-tip to Laurance over at StackOverflow). The idea in a ProcessWire context is to use array_chunk() to split an array into chunks - and use eq() when looping page results. Simple example that will split a WireArray into three columns. Before we begin, you should know the array_chunk syntax: array_chunk($array, $chunk_size, $preserve_keys=true|false). <?php $p = $pages->get('/news')->children('limit=15, template=article, sort=-sort'); ?> <div class="row"> <?php foreach (array_chunk(range(0,14),5) as $chunk): ?> <div class="col"> <?php foreach ($chunk as $i): ?> <h5><a href="<?=$p->eq($i)->url?>"><?=$p->eq($i)->title?></a></h5> <?php endforeach; ?> </div> <?php endforeach; ?> </div> A more realistic example: <?php $p = $pages->get('/news'); $pp = $p->children('limit=15, template=article, sort=-sort'); ?> <h2><a href="<?=$p->url?>"><?=$p->title?></a></h2> <div class="row"> <?php foreach (array_chunk(range(0,14),5) as $chunk): ?> <div class="col"> <?php foreach ($chunk as $i): ?> <h5> <a href="<?=$pp->eq($i)->url?>"><?=$pp->eq($i)->title?></a> </h5> <?php endforeach; ?> </div> <?php endforeach; ?> </div>

hi and welcome to the forum! you can bootstrap pw from your app like this: https://processwire.com/api/include/ and create a custom login like this: not sure if that's the best solution in your case - you would have to give us more informations but maybe my links already help you a bit.

I certainly agree. I create a template and page called api for basic JSON outputs. One other method to handle arbitrary urls without using any page/template can be hooking into ProcessPageView::pageNotFound like this // /site/ready.php wire()->addHookBefore('ProcessPageView::pageNotFound', function (HookEvent $e) { if ($e->input->url === '/api/create/') { $pageId = $e->input->post->int('id'); $content = $e->input->post->text('text'); // your logic // or hand it to another function / class etc. header('Content-Type: application/json'); echo json_encode([ 'pageId' => $pageId, 'content' => $content ]); exit(); } });

I wasn't really sure what was the real issue here, but by manually removing Modules.wire and Modules.site entries from caches table in DB, the issue was resolved after a brief Teamviewer support .

Wrap the function with if(! function_exists('doSomething')) { // function doSomething() {...} } It works when used inside home.php because _func.php was included after the PW took over the request. But when you're calling the function directly apache calls _func.php instead of index.php and PW will not be defined until you include it. http://php.net/manual/en/function.function-exists.php

This is a simple loader for LessQL, an ORM alternative for PHP. It is based on NotORM, and provides a quick way to access and find things in a database, including traversals and back-traversals. As discussed in some earlier topics, there are times when you'd like to store some data away from ProcessWire's pages/fields/templates structure for whatever reasons. However ORMs are sometimes cumbersome and requires a lot more effort to deploy. LessQL offers a quick way to just up and go like you're using an ORM but without the added complexity and configuration files. Module: https://github.com/alguintu/LessQL This modules simply loads the LessQL library into ProcessWire and exposes a $lessQL variable (configurable in settings) that gives access to your database. It uses the same database specified in $config by default, but can be set to use a separate database, along with its credentials. Usage given a table person : $people = $lessQL->person()->select("id, firstname, lastname")->where("firstname LIKE ?", "%alex%")->orderBy("firstname")->limit(10); It uses lazy loading and doesn't execute the query until it needs to. Checkout www.lessql.net for more info on LessQL. Module wrapper is pretty much lifted from @teppo's RedBeanPHP module, but with a few modifications.

Well I do agree with you on something at least - I also think that the PW logo should be to the admin home. I guess on smaller screens we need a hamburger icon for the that full menu sidebar. Back to my thought on accessing the tree - when you are editing a page, or on a subpage of Setup, Modules, etc you can click on the "Tree" icon and get the tree in that sidebar overlay - I think this is great, but you can't access it from these "parent" pages because there is not breadcrumbs on these pages. If the breadcrumbs were added to these pages, then you could access the tree sidebar panel from anywhere and I'd be happy As much as I want to embrace the iframe'd sidebar tree available in UiKit, it just doesn't quite feel right - partly it's the iframes, but mostly it's the width restriction that force the page list action buttons onto a second line. Being able to access the side panel overlay tree from everywhere would be a really nice compromise I think.

Just in time with the new AdminThemeUiKit and RenoSkin, there is a fixed version of CroppableImage3 pushed to the repo today. Many thanks for his help goes to @tpr !!

This could be a good candidate for Jumplinks 2.

TextformatterTypographer ⚠️ Archived: This module is archived. Feel free to fork it if you would like to take it over. A ProcessWire wrapper for the awesome PHP Typography class, originally authored by KINGdesk LLC and enhanced by Peter Putzer in wp-Typography. Like Smartypants, it supercharges text fields with enhanced typography and typesetting, such as smart quotations, hyphenation in 59 languages, ellipses, copyright-, trade-, and service-marks, math symbols, and more. It's based on the PHP-Typography library found over at wp-Typography, which is more frequently updated and feature rich that its original by KINGdesk LLC. The module itself is fully configurable. I haven't done extensive testing, but there is nothing complex about this, and so I only envisage a typographical bug here and there, if any.

PHP has a useful array_chunk function: it is used to split an array into a number of smaller arrays ('chunks') of a size you specify, which are returned to you in a new array (i.e. an array of arrays). ProcessWire doesn't provide a method for WireArrays that is the equivalent of array_chunk, but we can add a new method for this in hook. In /site/init.php... // Add a new 'chunk' method to WireArray, the equivalent of PHP's array_chunk $wire->addHookMethod('WireArray::chunk', function($event) { $wire_array = $event->object; $size = $event->arguments[0]; if( !((int) $size > 0) ) throw new WireException('WireArray::chunk requires an integer $size argument greater than zero'); $array = array(); $count = count($wire_array); for($n = 0; $n < $count; $n += $size) { $array[] = $wire_array->slice($n, $size); } $event->return = $array; }); Now we can use this new chunk() method on any WireArray to return an array of smaller WireArrays. Remember that many array-like objects in PW are WireArrays, including PageArrays, Pageimages and Pagefiles. An example using a PageArray of 'workshop' pages. We are running a series of workshops and there is only time for four workshops per day, so we want to divide the workshops into groups of no more than four and put each group under a heading... // Get all workshop pages $workshops = $pages->find("template=workshop"); // say this returns 12 pages // Split the workshops into PageArrays of no more than 4 pages each $chunked_workshops = $workshops->chunk(4); // an array of 3 PageArrays of 4 pages each foreach($chunked_workshops as $key => $chunk) { // $key is the zero-based index of the array $num = $key + 1; // Output a heading followed by the workshop links echo "<h3>Day $num</h3>"; echo $chunk->each("<p><a href='{url}'>{title}</a></p>"); // $chunk is a PageArray } Another example, this time using images. Say we want to divide the images into groups of three or less - maybe they are to be arranged into rows or we are giving the groups some special styling. // Say this page's 'images' field holds 8 images // Split the images into Pageimages objects of no more than 3 images each // 8 does not divide evenly by 3 so the last Pagesimages object will contain only 2 images $chunked_images = $page->images->chunk(3); foreach($chunked_images as $chunk) { echo "<div class='image-group'>"; // $chunk is a Pageimages object foreach($chunk as $image) { echo "<img src='{$image->size(300, 300)->url}'>"; } echo "</div>"; }

HELLO! I've been working on a user messaging module which I am nearly ready to release as version 1. Currently I have the below functionality and I'm looking for feedback to what other things may be useful for people looking to add user to user messaging on their sites. compose message to one or more users known to PW js to enable tag based UI display of user names input on compose message form display all message threads with reply forms reply to message thread displaying each user name by each message in the thread display "unread" when a thread has new content that hasnt been seen by current user delete or unpublish message thread (configurable) display total message thread count display total unread threads (threads that have new replies that the current user has not seen) delete all message threads and associated data (not meant for the users to have access to) road map send email to user on new message to a thread they are included in

Font Awesome 5 Pro for ProcessWire At Github: https://github.com/outflux3/FontAwesomePro I whipped up a font awesome pro module so that i could use those icons in the admin; it will be one of those "BYO vendor files", so you'd load your own Font Awesome 5 Pro assets once you buy it (about 1 day left to get the discounted pro license!)... Just posting this here in case anyone else ...is working on something similar ...already built something like this ...wants to collaborate on it} The webfont version basically works well in current admin theme but requires a custom css with fontface redefinition to refer to legacy 'fontAwesome' which is used in the admin css. The svg framework seems to work well, and leaving in the legacy font-awesome means that any icons that can't be replaced by JS are still visible (like :after psuedo classes); SVG framework only works with solid, probably because the new prefixing (fal for light, far for regular..) This is also going to be interesting for future admin themes, and the new 'regular' style is cute... Solid (default): dashboard example showing more icons: SVG framework:

This week we've got new versions of the Uikit 3 admin theme, a new version of ProCache with SCSS and LESS support, plus a brand new module that provides user login, new user registration and a user profile editor, all for the front-end of your site. And of course, a new core dev version too (3.0.76)! https://processwire.com/blog/posts/pw-3.0.76-plus-login-register/

I almost always regret it when I copy paste some code. It takes many times more to debug than just write the code again / refactor it

Can you share your code? Do you have namespace ProcessWire; declared at the top of your file?

That fat arrow is a typo, it was meant to be a skinny arrow $config->paths. Thanks for the heads up

Hi Abdus, I'm wondering what this is.

just pushed an update to support ajax fields and also fields inside repeaters

Ahem...really Mike? ....the docs, Mike, the docs: Glad you got it sorted .

I noticed an issue when AOS is enabled. The collapsed fieldsets aren't fully expanded. In Chrome dev tools, you can hover over the "label" html element to see it. I think it has something to do with this rule: .aos_hasTooltip .title, .InputfieldCheckbox label { position: relative; display: inline-block; } I also noticed on those fieldsets, the AOS tooltip popup isn't working. Nothing pops up to show the edit field links. If I find a solution, I'll report back. Hope that helps, -Glenn

Thank you - awesome to have! The main thing I am missing at the moment is the full row hover And the position of the "Disable AdminOnSteroids" link is driving me a little crazy A couple of other things I have noticed: There is no support for the stick header/nav when using the traditional layout option. In sidebar mode it is built into the theme, but I don't like the iframe implementation. There is a weird layout issue with AOS on - note the doubled and missing borders on these elements Thanks for all your work on this!

One more example from @Robin S

Users are also stored as pages, so most API methods/variables apply here too. See the docs: https://processwire.com/api/variables/user/ and / or the PW cheatsheet: http://cheatsheet.processwire.com/

Hi, and welcome to the PW-forum. Can you tell us more about your PHP apps? Do you intend to use PW for more than just user-management? Do you plan to rewrite your custom apps with PW?

Hi @Zeka, Yeah, PHP 7 is a little more stricter. PHP 5 forgave such indiscretions . If you could open a bug report for me so that I don't forget to fix it, I'll appreciate it (along with other issues that have been recently reported). Thanks.

Thanks for implementing the Bcc field, @adrian! It works great on sites using WireMailSmtp. However, on a site using the default WireMail implementation, the bcc() call will fail and abort the whole process. It seems the default WireMail interface does not (yet) have bcc() defined while it is available in WireMailSmtp and others. I'd suggest doing a simple check for the bcc function. For that particular project, I have successfully used the following to fix it. Instead of (line 177): if($this->data['bccEmail'] != '') $mailer->bcc($this->data['bccEmail']); I inserted: if($this->data['bccEmail'] != '') { if (method_exists($mailer, 'bcc')) { $mailer->bcc($this->data['bccEmail']); } else { $mailer->to($this->data['bccEmail']); } } Since the default WireMail will send each to() recipient as a separate mail, the second to() call acts as a de facto bcc address. Maybe that will be enough, maybe you can think of a more sophisticated way of solving it.

I may not be understanding correctly, but you can also apply uk-grid-margin class to the parent grid div, and that will apply margin between rows automatically when they wrap: https://getuikit.com/docs/grid#component-options

Libs updated, bumped to 1.0.0 stable.

Hi Gazley, taka a look at this pen I quickly made: https://codepen.io/anon/pen/PJKogG Unfortunately I didn't find an "out of the box" way to set a responsive gutter inside of the grid, you should have to implement yourself I suppose.

Reinstalling did the trick.

Hey @tpr - any chance you could add the "Show pagelist actions on full row hover" tweak to the sidepanel tree - the one that shows when you click this icon in the breadcrumbs. I am starting to get into the habit of using that panel as a way to access the tree and I am really missing the full row hover. On another note - what are your thoughts on supporting the new UiKit theme now? It is starting to look more usable (although I must admit I still don't see any real advantages over an AOS tweaked default theme), but it would be a nice option to have going forward. No pressure by the way - I know it's going to become painful keeping up with three different themes. It will be interesting to see what happens - will UiKit takeover as default - will the others stop getting core upgrades? Comes back to my desire for one theme which is easily skinnable, rather than different structures!

Thanks for sharing

Yep - that's how it's working here for me. Are you trying to convert an existing Repeater field to a FieldsetPage field? I bet that is the problem. It looks like it is available an a type to change a repeater field to, but the settings might not actually be compatible - @ryan ?

Bumped to 0.3.0-beta: This release makes considerable changes to the way in which the module works. Here's the breakdown of notable changes in this release: No more page fields Instead of using actual attached fields on a page-by-page basis, the module now saves related data in a centralised manner to its own configuration, and page fields are built on the fly when needed. This means that, when a template is defined in the module's config to use sitemap options and is later removed from the list, sitemap options for affected pages are not removed. Should the template be added to the list at a later stage, all saved options for pages belonging to that template are 'restored', simply meaning that the module will refer to them during the build process. The only time sitemap options for a page are removed is when either the page in question is deleted after having been trashed, or when the module is uninstalled (everything gets deleted, in this case). Stylesheet Due to a bug in Chrome (and possibly other browsers, though untested), the stylesheet is now turned on by default. Further, small aesthetic changes were made to the stylesheet, and a bug regarding the priority column was fixed. Commit da42cb7 changelog: alter stylesheet use separate class-loader separate methods to traits bind options to module-config, instead of page-fields use stylesheet by default add debug trait remove gitignore stuff we don't need Requirements The module now requires at least ProcessWire 2.8.16+ or 3.0.16+, due to the use of saveConfig and getConfig. Upgrade notes As the module is in Beta, there is no upgrade path. You will need to uninstall Sitemap before installing it again if you would like to remove the redundant system fields. If it doesn't matter, then a normal upgrade will do fine.

I'd love this: - remove masthead - sidebar (left) always visible - change icons to uikit3 icons - breadcrumb on top (with search on the right which i forgot here) - some design fixes Some live changes:

Playing around with the UIKit theme this morning and tweaking it. It's called UIKit Classic and it's a nod to the Classic theme. For me the Classic theme always sticks in my mind as being most definitively Processwire-ey because It was my fist intro to PW I thought the colours were quite unique and like the mix of blue, pink and green. They're very distinctive and I'd hate for PW to look like just another WP install. In a crowded CMS marketplace I think it's good to differentiate visually. The two screengrabs are just the same screen. A before and an after. I put this together using the Chrome the web inspect tool so there's no fancy mixins or LESS etc. Actually there's not even any CSS now that I've refreshed the page. I do think there needs to be a detailed comprehensive through tutorial for people wishing to make their own themes. Probably 85% here don't need it and understand the directory structure and how it's all compiled but equally I think there's another 15% here with the design skills but not the tech chops to get this done. If we want designers to design themes then we need the process with screengrabs, list of software (I have CodeKit, Dreamweaver, Sublime etc). Anywho - just my 2€ worth The before shot below...

Yeah, I think this was in an earlier version of the regions spec and I just got used to using it (so always identifying the region you are modifying with the id attribute, and then adding pw-append / pw-prepend separately when needed). But I see now that it isn't mentioned in the most recent description of the spec. So maybe a bug/oversight that this functionality isn't working with pw-append="some-id". The main bug to watch out for though is this one: https://github.com/processwire/processwire-issues/issues/302 I really hope that it gets fixed sometime soon.

The very same story here with Stylus. I use it only for about a month or two but wouldn't go back. I get angry when I have to deal with other preprocessors and the curly braces

@MindFull The htaccess file does allow access to the directory: # ----------------------------------------------------------------------------------------------- # 12. Access Restrictions: Keep web users out of dirs that begin with a period, # but let services like Lets Encrypt use the webroot authentication method. # ----------------------------------------------------------------------------------------------- RewriteRule "(^|/)\.(?!well-known)" - [F]

You could use the API, or the AdminActions module's Page Maniplulator action. Maybe with settings like this:

Hi @itsberni - sorry for such a delayed response - I am just back from an extended time away from my computer. I have added a new Bcc email field to the module config settings. All emails will be Bcc'd to the entered address automatically. Please let me know how it goes for you.

For those people who cannot get this to work in PW3, the instructions say to put this in your head: <script type='text/javascript' src='https://maps.googleapis.com/maps/api/js?sensor=false'></script> This actually needs to be: <script src="https://maps.googleapis.com/maps/api/js?key=<?= $modules->get('FieldtypeMapMarker')->get('googleApiKey') ?>"></script> Or however you like to include your JS files. The sensor=false is no longer needed, but the API key is. Seemed to work for me, I havent had time to investigate the inner workings of the module to see if this should be done or not but is just a bug. Happy mapping.

The custom php code is executes as part of InputfieldPage and therefore all api variables are accessable as $this->… . Only $pages as $page are available as local variables.