Leaderboard

A new project went live this week. We've been working hard the last couple month to redesign and relaunch the new SEV-Online site. It's now live at http://www.sev-online.ch (The non www. version is still the old site due to complications on company that handles the DNS.) The biggest challenge was to transport the old site from webEdition to ProcessWire. There was a lot of content that had to be taken care of. There was put a lot of work into importing articles and documents and also make sure most of the links and function still work, so some mapping had to be done using ID's of documents from the old system. This was especially tricky as the old system had a separate structure for the 3 languages in the old system, and is now handled with multilanguage feature of ProcessWire where each page contains the 3 languages. Nonetheless it was a pleasure to work with PW and it took everything I've thrown at it Although there were hard times were some bugs was found during the process, especially with multilanguage features. But the good thing is they're fixed. The site maintainers are very pleased to work with PW. Some general infos: The site is in 3 languages. Using built in ML, LanguageSupportPageNames. There's a register/login for members to see additional sections on the site. Members are synced from a CRM they already have. There's ~43K members that can create a account using their Member Nr and birthdate. Once they're registered they can change profil data that will then get back to the CRM. There's a calendar for events and courses that also visitor/members can send in new ones. There's a simple online shop using apeisa excellent shop module. We use Fredi for frontend editing. So almost all content can be directly edited via browsing the site. There's a simple widget system using page references, so they can build homepage and sidebar elements as they wish. There's many forms on site, that are all built using PW Form API (Inputfields), along with using jQuery Validation for better user experience. The navigation is quite large (number of entries) so I cached the markup generated by MarkupSimpleNavigation and use client side JS to highlight entries. Some modules used on this project: - LanguageSupport modules - PW Comments - Markup RSS - Hanna Code - MarkupSimpleNavigation - AdminTemplateColumns - EmailObfuscation (EMO) - FormSaveReminder - PageEditSoftLock - Fredi - CustomPageList - ModulesManager - Shop Module (apeisa) - Schedule Pages - Template Decorator - Template Notes - Video Embed Textformatter - MarkupCache Some custom site specific modules created along the way - Custom LinkAbstractor - Lots of custom hooks for doing things on save, indexing, page name and ocntent manipulations - Some custom Textformatters for LinksLists etc - Some custom Admin pages for managing member mutations etc.

In the Information Technology (IT) world there are many types of people working their craft. It's important to always remember that everyone is not a professional. It's a rat race and a highly competitive field. One of the life lessons you will ultimately learn is that getting good advice that you can trust is a very rare occurrence. I say all of that to make a point ---- Whenever you get advice (and I mean always good solid technical advice) on this ProcessWire forum, you are one lucky and fortunate individual. I've been involved in IT and Telecommunications as a career since 1977 and this is the first and only community where I know I can readily trust the advice. I have read these forums every day since 2012 and I learn something that can help me out every time. I currently have over 400 Evernote clips of ProcessWire forum solutions. It doesn't take you long (if you're smart) to realize that the ProcessWire Community and this forum are a foundation built on honesty, integrity and a will to help others. These knowledgeable professional web designers, programmers and developers could easily use the great code and never waste a moment explaining anything. The fact that they do provide solutions and explicit instructions should make you take a moment to reflect. I know I do on a regular basis. We all come here from somewhere else and I honestly believe that anyone coming here is relieved to have stumbled upon ProcessWire. It's a very open Community and Ryan listens to the wishes of everyone. We all should strive to be IT professionals and be known for the expert advice we give to our clients and others. That takes a dedication to learn or re-learn the right ways. Teppo is correct. If you ever want to be respected as a true professional (no matter the career) you must walk the hard path and always tell your clients the truth. I take ownership of each and every project I work on. I value my good name and would never let one of my clients jeopardize it doing something I know is technically wrong. Sometimes you have to remind your client (and also remember yourself) why they hired you. Good luck on convincing your client to do the right thing. It shouldn't be hard if you gather all the facts and present it to them in a professional manner.

How about settting up custom CSS classes in TinyMCE to select from in a more controlled way? It's more that the font and fontsize feature in TinyMCE is kinda left over and not recommended to use. http://www.tinymce.com/wiki.php/Configuration:style_formats What you think is just wrong from a best practice stand point of how to create and design content on the web. This is not Word or Indesign. Although there's even styles format in those that is similar to CSS, so you don't go and edit text formating manually for each text, but select a predefined format. If you consider that editing font size and color is a basic editing ability that needs to be, reconsider it please, as every web designer and developer will tell you different. It's like "just don't do it, ever". But still you can of course, cause of a old Wysiwyg editor that causes headaches all over the planet. We strive to have controlled output that is portable, and once you relaunched a website that had allowed content of inline styles and font's or whatever propietary code inside editor, you'll maybe understand even better. Further it's agains consistency of code and design on your website content. Just imagine the client gives hardcoded styles to all headlines, and afterwards you or her decides to make the headline bigger. So you'd have to go through all articles and edit them manually, versus CSS where you edit one value. Even if it's for only 5 pages, it's not worth it.

@pwired: that's one way to view it. From my point of view typography is an essential part of the design process and should be consistent across whole site, not something you (or the client) decides on a whim -- absolutely no offence intended, but from my experience that's what too much control eventually leads to. As a part of larger set of design decisions typography contributes towards the message that a particular site is designed to send to it's end-users. Classic example would be a "humorous" font used on otherwise very corporate-looking design. That's not just a sign of bad taste, it also sends a mixed message about the site and -- even more importantly -- the entity it represents, i.e. your client. Not only that, typography is also very important factor from usability point of view: Having the ability to change these things on the fly may feel good in that particular situation, but it contributes towards making the site messy and the experience end-users will have using it inconsistent and unpredictable, raising the bar of using the site among other issues. The client may or may not be expert when it comes to readability and other factors directly affected by typographic decisions. I'm personally not that interested whether a font looks good, but I am interested in whether it's readable. I do realise that this is something you can't always control. I just think that it's important to know what's being sacrificed when you're making choices like this. This is just one example of the kind of things you will sometimes have to explain to the client. If they still decide that this is important, then by all means go for it

I've been reading about Hack this morning and I must admit that I'm getting quite excited, to say the least. Just wanted to share this with you folks, in case that someone else might find this interesting too. Long story short: Hack is a new language based on PHP, used and developed by Facebook. It's compatible with existing PHP code apart from certain features, such as variable variables, that they had to remove to keep things consistent. There's a bunch of new features that Hack introduces (such as asynchronous functions, lambda expressions and collections, just to name a few), but it's primary addition is (optional) static typing and real-time type checking via local server sniffing file changes -- something that should come in handy especially when working with larger and more complex codebases. For the record, I don't particularly have issues with PHP as it is, but it seems to me that Hack introduces exactly the kind of features that I've been missing without sacrificing anything I couldn't live without.. not to mention that this is another good reason to finally try HHVM, which is now able run both Hack and PHP

They'll be covered by the license of ProcessWire itself, so go ahead and do as you like @ryan - can we make CKEditor the default editor for new installations in the next version of ProcessWire please? It's just that it's soooooooooooooo much nicer than TinyMCE

OT: for some reason a slight modification of this has stuck to my head; "expert is usually right, but the client always has the last word". As experts of our business it's our obligation to inform the client if something they're requesting doesn't make sense or if there's a better way to do it, but in the end it's the client who pays our bills and decides whether to trust our expertise

@renobird: Tom, to comment it out is nonsense. It just do the opposite: it save the original colors when resizing, whereas not using it it wash out (some) colors (makes them darker). A very helpful article with tests, examples and explanations is here: http://www.4p8.com/eric.brasseur/gamma.html This article also provides solutions for IMagick and Adobe Photoshop that have the same gamma error in resizing 8bit images! The advantage from Imagick and photoshop over GD-lib is their support for 16bit colordepth. Transfering images into 16bit colordepth do exactly a gamma linearization at first and after that a numbered colortransfer! One way to improve it is to use gamma correction!

There is already a thread going for this, but here you go: 1. Create TWO templates. Create a template called select-parent and a template called select-option - For this example neither need a template file, though they would need one if you wanted to display these actual pages. Edit select-parent and under family click on Allowed Template for Children and choose select-option. You don't have to do this part, but it does make for neater management. 2. Add to the template select-option two fields Title - well it will have that one anyway Value - this can be any field type. Note: If your title and value are going to be the same, then don't bother with a second field. 3. Go to pages and create your parent page. For this example we will just make this a child of the home page, but it can be anywhere within your tree structure. Click on home and create a new child page. Choose select-parent as the template and call it My Select and save. Optionally, under settings, check the Hidden box to hide this page from the front end. (It will be anyway as it has no template file) Save and close this page. 4. Click on your new My Select page and Create a child page. Make whatever children you need. If you restricted the allowed templates for children, it will automatically use the select-option template, if not, you will need to choose that template. 5. Go to fields and create a new field of the type Page. Create the field, naming it as you need and save. Under the Details tab choose: Single page (Page) or empty page (NullPage) when none selected Under the input tab change the parent of selectable pages to My Select. Scroll down and change input field type to select. Save And that is it. You can now include this page field in whatever template you need. You can add options as you require, but I would be careful about deleting them!

I'm not particularly interested or knowledgeable in image optimisation myself (as long as I can still tell what's in the image and it doesn't consume too much disk space and/or cause unnecessary slowdowns all is good) but this sounds awesome! GD vs. Imagick is clearly something that's been bugging some folks and we'll likely be seeing even more topics about that in the future. I sincerely hope that you guys find the time to take this further

@robert: I want to clarify here for following readers: This is definitely wrong! The artefacts has nothing to do with gamma correction. If you personally want to comment this out, please do so. But please do not give this advice to others, because you yourself have said: If you don't know what it is good for and on the other hand only guessing on something is not enough to give advice to other people that may also do not know for what it is good for. Gamma correction do exactly the opposite of what you say: it does not destroy colors - it saves the original colors. @all: Please read on in the other thread here: https://processwire.com/talk/topic/5889-image-quality-problem-on-resize/#entry57548 or just here: https://processwire.com/talk/topic/5889-image-quality-problem-on-resize/#entry57559

Also, even though the client is "always right", the reality is that they're actually not always right Unfortunately given them the ability to style fonts in an RTE field is usually a recipe for ending up with a site that looks like it's from the 90's. Sometimes you just have to be confident and tell them No!

This might be obvious since MariaDB should be totally compatible with mySQL, but just wanted to say that everything seems to be working fine with running pw with it after doing some selector tests.

that did only one insert: the last one. Do I need to specify each line like this: text1, text2, etc? Solved: I had to specify the header first, like: title text1 text2 text3 etc

Yeah, could have at least fitted it with a tow bar ....

@bwakad If you just think of a page with a title as just the title (and forget that we are calling it a page) then it does not seem so over the top. This may help: http://wiki.processwire.com/index.php/Page_Field

Pages are the preferred way to do this and 30 pages is absolutely not a problem. You'll run into usability issues with select field itself much sooner than any kind of problem related to number of pages behind the scenes..

As one of the maintainers of the site I can only agree with everyone here. Thanks Soma, it is really something to be proud of. And thanks to ryan as well for this great system. It is really easy to work with. It makes maintaining a multi language site very easy. I know, what I am talking of …

Only had a quick look but a really nice job Soma. One thing, and maybe this is just me, but the horizontal menu requires a click to show the dropdown items. That's fine, but i would expect it to close the open dropdown if i click it again, but it doesn't, it only re-opens the already open dropdown. You need to click outside for it to close. No big deal but to me this behavior was unexpected.

Awesome site Soma! We need this one in the sites directory.

I love Fireworks. It's a real shame adobe is letting it go. Tribaloid is developing EvolveUI an open source project as a responsive to adobe ending fireworks. It still has a way to go but here is a few links below for EvolveUI App: https://chrome.google.com/webstore/detail/evolveui/kggdkflbniidcjejdnmfpkncdplmfofh http://tribaloid.com/

Very nice website.

The hoster is http://nine.ch There's also template cache enable for parts of the website. And also it's optimized, the navigation is chached too.

You have a good point about the head and foot inc files. It looks like Ryan used the text from the default PW profile which does use that approach. His Foundation profile however actually uses a different approach using _main.php Take a look at: https://github.com/ryancramerdesign/FoundationSiteProfile/blob/master/templates/_main.php Notice that this file contains the entire structure needed for an html page. The content from the PW pages is echoed in various places in this template. For example: <div id="bodycopy" class="large-8 columns" role="content"> <?php echo renderBreadcrumbs($page->parents); echo $body; ?> </div><!--/#bodycopy--> PW lets you work exactly how you want, which can be confusing for some users at first, but you'll come to appreciate it.

Currently I'm not knowing IM, but I'm in!

Agreed horst - we need to make GD the best it can be. I do like the idea of a drop-in IM replacement though. There are so many settings that developers could tweak with IM. One thing that should be tried straight off is using: adaptiveResizeImage instead of ResizeImage, which is what I used in the module to start with. Anyway, as I said, no time right now, but perhaps if enough people are keen and think the benefits are worth the effort, perhaps we could collaborate on this?

@adrian: this is a very good starting point! An IM alternative may be good for all that can use it on their hosts. But for all users that cannot, we have to improve the usage of GD.

Hi @humanafterall. additionally to that what I have replied to @robert, it has nothing to do with linearization (gamma correction). The artefacts comes from sharpening the images. Attached is a test with sharpening set to 'none', the default 'soft' and the third image is a rezied version where I have added some noise to yout original image with photoshop. This is common usage: if you have technical gradients with pixel formats use the filter "add noise". How much and if monochrome or colored you may test, but that's the only way I know to avoid these artefacts. You can set / send options in your template like this: $img = $page->images->first(); $img->removeVariations(); $options = array( 'cropping' => true, 'sharpening' => 'none', ); $img = $img->size(768, 436, $options); EDIT: added more clearly that I have added noise to the original image and resized it in PW with GD-lib.

I am not sure on the whole GD vs Imagemagick quality issue. I know years ago IM was ahead, but not sure if that is still the case. From reading around it sounds like they each have their strengths and weaknesses. That said I have always used IM until I started using PW. For the sake of experimenting, I quickly threw this module together as a way to test IM within PW. It replaces the resize method, so it will work from the admin and also template calls like: $image->size(400,0) It doesn't do anything more than the resizing at the moment - it currently ignores all quality settings, cropping etc. I doesn't try to do any sharpening either, but it's a starting point that we can play with. I need to get back to real work, but thought one of you guys might be keen to play around with and tweak settings and see what you can come up with. Obviously you need imagemagick on your server and also the iMagick extension. ImagickResizer.module

Ok finding info like that about Tinymce is a coded jungle out there but I cracked it ! If you want to add to theme_advanced_buttons1 the following : |,fontselect,fontsizeselect then you have to add to valid_elements the following: ,font[face|size|color|style] to make it work.