Leaderboard
Popular Content
Showing content with the highest reputation on 10/16/2018 in all areas
-
We used http://barbajs.org/ for the transitions. This was for me the best tool to create good transitions. It also includes a preloading/prefetch option: http://barbajs.org/prefetch.html. When the user hovers over a link, it preloads the page. The time difference between hover and click is about 250ms to 750ms in our tests. This is in the most cases enough to load the full .html document. Here is an interesting website to test it yourself: http://instantclick.io/click-test This is how a transition works: The user hovers over a link The browser prefetches the site (Including Base64 placeholder images) The user clicks the link (The time difference between hover and click is long enough to load the document) The actual page transition out The loading screen transition in (In most cases it will skip this step because the page is already loaded) The new page transition in We can change the direction of the transition with data-attributes: <a href="/arbeit/" class="button-enter introduction-button" data-transition-direction="left">Arbeit</a> When you have other questions please feel free to ask ?7 points
-
https://www.meuter.de/blog/wieso-processwire-als-content-management-system-cms-oft-die-bessere-alternative-ist/7 points
-
Hi all - I've just committed a pretty major update to the Console and File Editor panels. 1) Adds all ACE editor themes with a config setting to choose the theme 2) Options to set the font size and line height 3) I have refactored the sizing of various divs in both these panels that should solve lots of minor layout bugs especially when resizing the panels. *Be sure to do a hard reload to get the latest CSS/JS files. 4) Updated the core SplitJS library which now adds support for dragging by fixed increments which lock to the code line height - before I was hacking this on and it wasn't anywhere near as nice. 5) Various bug fixes for the keyboard shortcuts for resizing the console panes. Also, just a quick note to say that this version doesn't yet include the PW variables code completion. That will come in the next version. I am on a semi-vacation at the moment so haven't had any dedicated blocks of time to get that quite as I want yet. Please let me know how this new version goes for you!4 points
-
4 points
-
We recently finished a relaunch of our agency website: https://www.meuter.de/ Features: Minimalistic and modern design Page transitions and preloading for a really fast browsing expierence Custom content builder for blog posts, references and subpages Content is king: Many case studies and blog posts Under the hood: Webpack with ES6 and SCSS LQIP with Base64 Images Lazy loading with lazysizes Automatic generation of scrset images, Base64 placeholder images and background positions Page transitions with barba.js Preload pages when user hover over link Interactive components which reacts on scroll events. Built with ScrollMagic Handwritten template Modules used: ProFields Markup Sitemap XML Video embed for YouTube/Vimeo Our Content Builder for a reference: Clean page structure: The code for the image generator: <?php // ------------------------------ // Image modifications // ------------------------------ /** * Responsive Image Options */ class imageModifier { // Responsive Sizes from lowest to highest private $responsiveSizes = array(320,640,768,1024,1366,1600,1920,2560); private $base64ImageWidth = 20; private $imageOptions = array( 'upscaling' => true ); // Return a string with the srcset information public function getSrcSet($image){ // Create an emptry output string $srcSetOutputString = ''; // Create each image for each size foreach ($this->responsiveSizes as $responsiveSizeId => $responsiveSizeWidth) { // Check if the image is bigger then the final size if($image->width >= $responsiveSizeWidth){ // Create the image and put the url into the output string $srcSetOutputString .= $image->width($responsiveSizeWidth, $this->imageOptions)->url; // Put the width in the output string $srcSetOutputString .= ' ' . $responsiveSizeWidth . 'w' . ','; } } //When the original image is smaller then the highest quality if($image->width < $this->responsiveSizes[count($this->responsiveSizes) - 1]){ // Create the image and put the url into the output string $srcSetOutputString .= $image->width($image->width)->url; // Put the width in the output string $srcSetOutputString .= ' ' . $image->width . 'w' . ','; } // Remove last commata $srcSetOutputString = rtrim($srcSetOutputString, ','); // Return the srcSet information return $srcSetOutputString; } //Returns the lowest quality image public function getLowestQuality($image){ return $image->width($this->responsiveSizes[0]); } //Returns the highest quality image public function getHighestQuality($image){ // if image is bigger or same than max quality if($image->width >= $this->responsiveSizes[count($this->responsiveSizes) - 1]){ return $image->width($this->responsiveSizes[count($this->responsiveSizes) - 1]); } // When image is smaller then the highest quality else { return $image; } } // Returns the base64 data string public function getBase64($image){ // Get the image path $imagePath = $image->width($this->base64ImageWidth)->filename; // Get the image extension $imageType = pathinfo($imagePath, PATHINFO_EXTENSION); // Get the data of the image $imageData = file_get_contents($imagePath); // Create the base64 Code $base64Code = 'data:image/' . $imageType . ';base64,' . base64_encode($imageData); // Return the code return $base64Code; } // Returns the position point public function getPosition($image){ // Get distance from top $distanceTop = '' . intval($image->focus()['top']); // Get distance from left $distanceLeft = '' . intval($image->focus()['left']); // Return the position with percent return $distanceLeft . '% ' . $distanceTop . '%'; } } Thanks for the community and Processwire. It is a joy to use ?3 points
-
Thanks to all who got in touch. I have found a developer to take this one on now.3 points
-
3 points
-
I've always used the all tables option but on my recent mathparser module I've used 3 fields for the same functionality: 1) radio active by default yes/no 2) if no, fields to include 3) if yes, fields to exclude1 point
-
I don't know if popular is the right word. I have never came accross another person who knew ProcessWire here in The Netherlands. Ofcourse people use it and I got a feeling there is growth. Most people who have used ProcessWire definately keep using it or at least they want to use it. That is on itself a great accomplishment only achieveable by a few people. Same for the good community and such loyal users while the development is solid with great pro modules. I guess it is really hard to break through a next level. Just keep promoting it ?.1 point
-
Would it make sense to add an option to exclude tables from the backup, instead of choosing the tables to include? This would be especially useful with regards to the sessions table. I have a project with a moderate amount of visitors, but 1million+ rows in the sessions table. The backup module fails since the process needs too much memory. If I exclude the sessions table, the export shrinks from 150MB to 30MB, which the server can easily handle. Now, I can already select all tables and leave the table sessions unchecked. However, as soon as I add a field, template, etc., all future backups will be missing that table completely. In that scenario, an exclude option would be the better option. I might just whip up a PR when I find the time, but was wondering if anybody else feels this is necessary or a good idea.1 point
-
Yep, it works fine. I'll see if I can come up with something for the php linting and the compatibility error (but am not in a hurry). Ah, and now I notice my syntax error for the httpHosts, should have just been a string with the hosts separated by newlines like in your defaults: $hosts = "www.".ltrim($this->host, 'www.')."\n".ltrim($this->host, 'www.'); Cheers.1 point
-
Thanks for this module, I am just getting into it - the long way ? I will explain what I needed to hack in order to make this work with my three-container Docker setup. First, I want to ask something: How can I set 'timezone' and 'httpHosts'? I saw in the example kickstartfile you had a numeric ID for Vienna, but that seems very odd (and how to find out the ID)!? I tried with these, but they didn't make it into the config.php 'timezone' => 'Europe/Helsinki' 'httpHosts' => ['0.0.0.0:2015','0.0.0.0','localhost:2015','localhost'] Now some interesting notes from my Docker adventure. These are hacks to the kickstart.php file. - I had to change the checkPHP function to always return true, because it wanted to run 'php -l', but php binary does not exist in my web server container! I can always validate the syntax of my recipe myself, so it's fine. - I learned I need to specify 0.0.0.0 in my Caddyfile instead of localhost, because otherwise curl will get connection refused. This was helpful in debugging: https://blog.kettle.io/debugging-curl-requests-in-php/ Then in the postToPW function I gave the container address: $url = 'http://caddy:2015/install.php'; - because Caddy is not Apache, I always get the Apache mod_rewrite on PW's compatibility check. So I silenced the error: // do all the pw installation steps if($this->postToPW(['step'=>1], ['stepname' => 'Check compatibility', 'errors' => [], 'quiet' => true])) { During the testing phase I benefited from commenting out the zip download and deletion: //$this->downloadAndSave($this->config['pw'], 'pw.zip'); and //if($delete) unlink($zipfile);1 point
-
1 point
-
Hi @Basil. Sorry I missed your post. Just seen it now. Please see the first post In this thread for details. Existing users will be able to buy the new padloper at a discounted price. The discount % hasn't been decided yet :-).1 point
-
Sehr schön! Could you tell us a bit more about the page transitions and preloading? It looks really smooth.1 point
-
This post contains an introduction to our plans for rebuilding the ProcessWire.com website. In part one, we take a look at the initial strategy, framework, and concept for the new site, primarily from the development side: https://processwire.com/blog/posts/rebuilding-the-processwire.com-website--part-1-/1 point
-
I know you already rest your case, but still wanted to point out that Uikit is actually very configurable, meaning that you can pick and choose the components you need. You don't have to include the full framework, and when using SASS or LESS you can easily recompile the framework at any time. There's also another thing that in my opinion makes it a great fit for ProcessWire: Uikit also includes the concept of hooks. You quite literally modify it the same way as you'd modify ProcessWire. The point behind front-end frameworks is that you don't have to reinvent the wheel every single time. In most cases our grids, carousels, cards, and whatnot are not really that different from project to project. Sure, they are styled differently, and may even behave differently, but the basic structure and function is similar. So, why write a new component every single time when you can reuse the old structure/behaviour and just give it a brand new bespoke look and feel? What you're essentially claiming is that every Uikit site looks the same (or requires a lot of hacks to not), yet I disagree. Again if you take an out-of-the-box version of Uikit and use the ready-made default theme (you did notice that using it is completely optional, right?) then yes, it's going to look like... well, an out-of-the-box Uikit with a ready-made theme. Just don't do that, and you'll be fine. Yes, with a framework there will always be some amount of configuration and hooking/overwriting involved, but that's a small price for the benefits you reap. For arguments sake: if we thought that all pre-made components were pure evil, we shouldn't be using ProcessWire either. ProcessWire doesn't dictate your sites look and feel, but it sets a baseline for how it'll work behind the scenes. Uikit does the same for the front-end. Both are easily configurable and modifiable. One might even go as far as say that they are natural allies – two parts of a whole. For the record, before writing this post I was not fully convinced of Uikit: I've been using Foundation, which in my opinion is superior in many ways, and has a rather different method of modification – essentially a massive config file for modifying pretty much every single thing you can imagine. But diving into the Uikit docs made me like it a lot more, and not least so because it really does have certain similarities with ProcessWire itself. In short: Uikit is a great choice for the new processwire.com.1 point
-
Excited about the new processwire.com! I agree that the search could be better - especially if processwire.com is to be advertised as powered by ProcessWire. I get why the forum search might be poor because that is not powered by PW, but it has long puzzled me why the Modules Directory search is so poor seeing as that is PW-powered. An example: right now in the "Latest Additions" section we can see a module from netcarver titled "Street Address". So how come when I enter the exact words "Street Address" in the search box that module doesn't appear as the first result, and even doesn't appear on the first page? https://modules.processwire.com/search/?q=Street+Address1 point
-
I know this is an old thread, but since it looks unsolved I thought I would share what worked for me in case people are searching the forums. Here are the steps I took: renamed mystyles.js to customstyles.js located at site/modules/InputfieldCKEditor/customstyles.js edited customstyles.js to change the text from mystyles to customstyles.... CKEDITOR.stylesSet.add( 'custom-styles', [ edit the field settings for the field to point to the new customstyles.js The problem for me was that I needed to change the prefix as well from mystyles:/site/modules/InputfieldCKEditor/customstyles.js to customstyles:/site/modules/InputfieldCKEditor/customstyles.js They have to match the file name. Hope that helps someone.1 point
-
In case: https://github.com/Alexia/php7mar https://github.com/phan/phan https://github.com/phpstan/phpstan https://github.com/gisostallenberg/php-to-7-aid https://github.com/swisnl/php7-upgrade-tools https://github.com/wimg/PHPCompatibility1 point
-
Make sure to "open" the new parent page before moving stuff there. It needs to be highlighted to receive a page as child no matter if there are already children or not.1 point