Leaderboard

wrote an article http://www.okeowoaderemi.com/articles/posts/wordpress-to-processwire-a-guide-for-developers/

Fredi is friendly frontend editor for ProcessWire. Code and documentation: https://github.com/apeisa/Fredi Module page: http://modules.processwire.com/modules/fredi/

This is a very basic guide on how to optimize a ProcessWire page for speed. It doesn’t go into the depths of optimization and perfect render paths but will provide you with some proven ProcessWire methods for faster websites. The big problems that are easy to fix are what we aim for. You want quick improvements? Then read on… First let's have a look ath the following graph. Those are the areas, we want to improve. Source: http://httparchive.org/interesting.php?a=All&l=Oct%201%202014 Clean up your HTML Look at your HTML source code. Are there any unnecessary parts? Remove anything that might not be needed and try to keep your markup as clean as possible. Avoid using too many external JS libraries or other tools. It is okay to include jQuery from a CDN, because most visitors will already have cached the file. Too many of those external requests will slow down the page. If possible, try to avoid render-blocking Javascripts and move your script tags to the end of the page, right before the body. In most cases, your Javascript will enhance your content but doesn’t need to fire before the site is rendered. Always think if you need to include another library or the fourth webfont on your site. Minify Markup The next step to save some bytes is to remove all whitespaces from your markup. It doesn’t have to look nice, it has to be loaded fast. We perform this trick with our new super-weapon: The AllInOneMinify module for ProcessWire. Install it like every other module for ProcessWire. Once activated, go to the module settings and tick the checkbox for “Minify HTML” and look at your sites source code. It should be minified. AIOM can handle conditional browser comments. If your layout depends on whitespaces you could “force” them by putting an into the markup. Optimize the CSS Now we’re heading for the next larger part of a usual website. We will combine all CSS files and then remove anything not needed (whitespace,comments) from it. Before we start, make sure your CSS files only contain rules that you really use. Especially if you’re using a framework like Bootstrap, most of the selectors are never used. Remove them carefully. We need the AllIneOneMinify module from the previous step again. After installation, open the template file where your HTML header is generated. We will now replace all stylesheet tags with a single file. AIOM needs to know all CSS (or even LESS) files, relative to your template folder. It will then output a link to a single, compressed CSS file. You might have this in your HTML head: <link href="<? echo $config->urls->templates;?>/css/grid.css "rel="stylesheet" /> <link href="<? echo $config->urls->templates;?>/css/style.css“ rel="stylesheet" /> Replace all links to Stylesheets with the single tag like this: <link href=”<? echo AIOM::CSS(array(‘css/grid.css’,’css/style.css’)));?>” rel=”stylesheet”/> You pass an array with the file names to the AIOM method CSS. It will return a link to the file. AIOM takes care of image urls inside CSS. It will detect changes in the source file and only generate a new file if necessary. While developing, you might want to turn on the “Development” checkbox in the module settings. Make JavaScript tiny Do the same as you do to the CSS to your Javascript files. First, clean up the code. Then install AIOM and compress all JS files into a single file using the AIOM::JS method that works as the AIOM::CSS method. For best results, think about including scripts like jQuery from a CDN and put your scripts below the content, before you close the body tag. Also note that the order on how your throw your JS files into AIOM might be important, depending on the code inside. Get the right image size. ProcessWire comes with great image tools. Use them, to make images exactly the size you need them. You don’t have to serve that little thumbnail with over 3000px length just because the editor wasn’t able to reduce the size. Example: Your designer wants to have a slider image with a maximum size of 600x320 pixel. To output the image with that exact dimensions, use the API accordingly: $sliderImage->size(600,320)->url; An even better way would be to use adaptive images or the new srcset attribute combined with a JS fallback. Then your site only delivers the image size as needed. Hint: Play around with the image quality setting in the config.php. Maybe you don’t need images with a JPG quality of 90+. Compress the images further with minimize.pw To make images even smaller, we can use the minimize.pw service. This service will compress images nearly lossless by using more complicated tools to reduce the size of PNGs and JPEGs. By doing this, you remove bytes from the largest chunk of your website weight. minimize.pw is free for 2000 images. Just enter your E-Mailadress and receive a free key Then you have to install the ProcessImageMinimize module and enter they key. You can now activate the option to automatically compress every image uploaded. It is fail-safe and will compress images in the background. Please note, the automatic mode only works with images uploaded AFTER you have activated the module. You can manually select image fields with the ->mz() API method. Just include it before you output the image in your template file: $myImage->width(300,300)->mz()->url; We've closed the service. You could use something similar like Imgix ( https://www.imgix.com/ ). Activate GZip compression on your site Another method to speed up your site is to activate GZip compression. The server will then send all files compressed to the client. This works with nearly all browsers and the CPU power required is minimal. You can tell your server to do this, by adding those lines to your .htaccess file in your root directory. Please take care, that you do not overwrite the ProcessWire rules in the file! For best results add them on the top of the .htaccess file: <IfModule mod_deflate.c> AddOutputFilter DEFLATE js css AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html </IfModule> This was taken from another forum post. Tell the client to cache stuff To make repeating visits faster, we can tell the browser to cache special files for a longer period of time. Again, add this on top of your .htaccess file: <IfModule mod_expires.c> ExpiresActive On ExpiresDefault "access plus 1 seconds" ExpiresByType image/x-icon "access plus 1 year" ExpiresByType image/jpeg "access plus 1 year" ExpiresByType image/png "access plus 1 year" ExpiresByType image/gif "access plus 1 year" ExpiresByType text/css "access plus 1 month" ExpiresByType text/javascript "access plus 1 month" ExpiresByType application/octet-stream "access plus 1 month" ExpiresByType application/x-javascript "access plus 1 month" </IfModule> <IfModule mod_headers.c> <FilesMatch "\\.(ico|jpe?g|png|gif|swf|woff)$"> Header set Cache-Control "max-age=31536000, public" </FilesMatch> <FilesMatch "\\.(css)$"> Header set Cache-Control "max-age=2692000, public" </FilesMatch> <FilesMatch "\\.(js)$"> Header set Cache-Control "max-age=2692000, private" </FilesMatch> <FilesMatch "\.(js|css|xml|gz)$"> Header append Vary: Accept-Encoding </FilesMatch> Header unset ETag Header append Cache-Control "public" </IfModule> Remember, that this caching might be annoying while developing the site. Use the internal cache (or ProCache) Another trick to make the site faster is to use a caching system. This will “store” your rendered site so you don’t have to query the database that often. We can either do this with the internal cache of ProcessWire or use the commercial, official ProCache module. Using the build-in system, you go the the setting page of a template and open the “Cache” register. You can now set the Cache time and what happens if something changes. The settings depend on the content of the site. Mostly static content can be cached longer and you might not need to reset the cache every time. Dynamic sites will need shorter cache times. ProCache (buy here) is even faster because it will bypass PHP and the database. Files are served directly as HTML. Please note, that caching might make the site faster but it can create new problems. Use with care. Summary Keep your code as clean as possible. Remove anything unnecessary and then compress HTML,CSS and JS using the AIOM module. The largest part of your page weight are images. Keep them small by using the appropriate dimensions and consider services like minimize.pw. In the end, use intelligent caching and buy ProCache. Following this guide takes not more than an hour but can speed up your site and make your visitors happy. This was just a quick overview of techniques to optimize your page speed. There is plenty of stuff you can do but the steps above are a good first step. Maybe you can share your favorite methods (or links) to start the discussion.

Try 'itemMarkup' => "<li class='{class}'>{out}</li>"

Adrian has a starting point for you Alex

Something like this // in modules init() $this->addHookBefore('ProcessPageView::pageNotFound', $this, 'redirectToEnglish'); public function redirectToEnglish($event){ if($this->page instanceof Page && $this->page->is("template.name^=article_")){ $this->session->redirect($this->page->pageField->url); } }

Think you can hook before ProcessPageView::pageNotFound and render some other if wished.

I don't know if you read the documentation for "Allowed Content Rules", but there it states that [] are for attributes, {} for styles and () for classes. Therefore you need to use *[id] to allow id's. You can only allow/disallow specific contents for the style and class attribute. All the other attributes (including id) are either allowed in any form or not. Edit: Your version would allow for this: <a centre="something" gras="green" noir="dark" credit="given">I'm a link</a>

Ok, I have been with Dreamhost for many years. On Dreamhost you must create the database first. Go to Toolbox (On the upper left side) of the Dreamhost Panel and click "MySql Databases". Once you have created your database, then you can go through the PW install. Welcome to the ProcessWIre forums!

Finally used the selector option to remove all template-specific pages, in this case the categories from the portfolio: 'selector' => 'template!=portfolio-category' Thanks.

@Adrian, Thanks for the suggestions. I am trying to create some time this week to look at these and other pending issues RE my other modules....I know I have been saying this a lot lately but other things/distractions beyond my control keep cropping up.....

http://processwire.com/blog/posts/language-access-control-and-more-special-permissions/ I guess this thread can be marked as solved

just tested my method and works perfectly. you sure you did it right? glad i know this works now, gonna come in handy! 1.) Create new field, call it url_override 2.) Add to your template 3.) on the Page C page, type a # into the field 4.) in your treemenu options make sure you have this: 'item_tpl' => '<a href="{url_override|url}">{title}</a>',

But maybe this could be an alternative: http://processwire.com/blog/posts/language-access-control-and-more-special-permissions/

It's not good to reinvent the wheel, but it's not bad to know how wheels are made. What you want to do is actually quite simple, and all you need is a loop inside the first loop. For only two levels, a very simplified version could look like this: echo "<ul>"; foreach($homepage->children as $item) { // loop through the children of root echo "<li><a href='$item->url'>$item->title</a>"; if ($item->numChildren(true)) { // check if this item has children echo "<ul>"; foreach($item->children as $sub_item) { // loop through the children of each item echo "<li><a href='$sub-item->url'>$sub_item->title</a></li>"; } echo "</ul>"; } echo "</li>"; } echo "</ul>"; For more levels, you could keep adding loops inside loops, but then, it would make more sense to make a recursive function (a function that calls itself while there still are children). One more thing. In your code you add the id for the current page like this: if($child->id == $page->rootParent->id) { // this $child page is currently being viewed (or one of it's children/descendents) // so we highlight it as the current page in the navigation echo "<li><a href='$child->url' id='current'>$child->title</a></li>"; } else { echo "<li><a href='$child->url'>$child->title</a></li>"; } You can avoid repeating code by doing this instead: if($child->id == $page->rootParent->id) { $current = ' class="current"'; } else { $current = ''; } echo "<li><a href='$child->url'{$current}'>$child->title</a></li>"; Or, more compact: $current = $child->id == $page->rootParent->id ? ' class="current"' : ''; echo "<li><a href='$child->url'{$current}'>$child->title</a></li>"; You can also replace $child->id == $page->rootParent->id by $item == $page for the current page and use rootParent to give the class to the parent item only

If you do not insist on doing it all by yourself, you could just use this usefull module for building menus.

Does anything from this post from Ryan help: https://processwire.com/talk/topic/4011-cannot-login-to-admin-area/?p=39870 In particular: disable the "session fingerprinting" option in your /site/config.php and change the default session name from 'wire' to whatever PHP's default is: $config->sessionName = session_name();

What version of ProcessWire are we talking about here? It sounds like 2.3 based on the file names mentioned, but want to double check. That seems pretty odd that PHP is writing sessions somewhere other than where specified. But ProcessWire uses PHP's native session features, so PHP is the one ultimately reading the session file rather than ProcessWire. Meaning, it's not possible for ProcessWire to read it from the wrong place, and I doubt PHP would read it from the wrong place. The only exception would be if you are using Database sessions, which is a module included with ProcessWire 2.3–did you install that by any chance? That would change the things that we need to look at. Also, just to rule out other possibilities, disable the "session fingerprinting" option in your /site/config.php and change the default session name from 'wire' to whatever PHP's default is: $config->sessionName = session_name();