rethink.fm

Photo credit: Puk Patrick on Unsplash Collaboration – Teaming up to tackle larger projects In this episode, I’m chatting with Cathi Bosco and Joe Dooley about a large project we did together. We talk about our roles and how we worked together. One of the challenges we tackled was incorporating a flexible animated icon system using SVGs — and what was involved in building that. Listen to Episode 22 Cathi Bosco Creative Director, Digital Consultant, Web Designer, Artist, Illustrator, Children’s Book Author, trail runner, dog lover & free thinker… My specialty is creating beautiful and cohesive web presence packages for clients that can convert audiences and present content elegantly (think modern and clean presentation). Our sites are built on The Genesis Framework and they function exceptionally well for a wide range of programs, communities, organizations, and companies. If you have an unusual challenge – we are all ears… tell us about your project and ideas! We don’t take on each and every proposal that comes along, but if we feel we can add value to your plans or programs, we’ll gladly get you a quote and get to work for you. I also think CSS transitions and CSS + SVG animations are very effective slightly below the surface. Designed to feed the human reward system. Always leaving the end user ‘in control’ of the navigation but royally rewarded aesthetically. This is for upper-end projects and can also help to differentiate sites from low-end, non-custom work… when done well. We all love this stuff… transitions and animations that are so subtle they beautifully and intriguingly enhance end-user experiences. Along with collaboration, they are key to forward momentum for Genesis developers and designers Joe Dooley Joe Dooley often describes himself as largely driven by analytics and a keen passion for SEO. His Tampa SEO company implements cutting edge practices to boost website conversion and meet his client’s marketing goals. Working as a front-end web developer and leading Developing Designs allows Joe to nurture the business aspirations of his clients as he works with them to advance their marketing platforms in exciting directions leading to success. Sponsor – IHateTomatoes.net This episode is sponsored by IHateTomatoes.net – Front-End Development Courses Don’t let the name confuse you. This is the comprehensive resource that we used to build our SVG animations for the project mentioned in this episode. Petr Tichy is passionate about front-end development and offers three free introductory courses — React 101, Greensock 101 and ScrollMagic 101 — and when you are ready to take your front-end dev skills to the next level, he has affordable online workshops in React, web animations. High quality video tutorials that show you step by step how to accomplish some very amazing things. Master front-end development and take your React, GreenSock and ScrollMagic knowledge to the next level. Check out IHateTomatoes.net today. Where to find us: Website: C and D Studios Website: Developing Designs Website: Jackie D’Elia Design Twitter: Cathi Bosco Twitter: Joe Dooley Twitter: Jackie D’Elia Tools and Resources discussed: Greensock ScrollMagic IHateTomatoes.net Panetheon WP Engine Pagely SVGMO

Photo credit: MILKOVÍ on Unsplash eCommerce – Helping folks sell online In this episode, I’m chatting with Bob Dunn of bobwp.com. Bob is a master at producing content and building an audience. We’re talking about eCommerce, and what’s involved in selling products online. And the conversation doesn’t stop there. Bob shares his experience with podcasting, page builders, managing affiliates, sponsors and more. So if you are thinking about starting an online business, this episode covers a lot of ground. Bob Dunn With a background in marketing Bob and his wife Judy grew a marketing company into what today is a content marketing machine centered around eCommerce. “In 2007 I began to dabble in WordPress and by 2008, I knew it was the perfect solution for me and my clients. We dove back into eCommerce a bit more by starting a membership site in 2008 as well, a time before membership sites really were catching on. And obviously, with the technology nowhere at where it is today, it took us a good 9 months to develop the site.” Today, Bob produces several podcasts and writes a ton of useful content for his growing audience. The rest is history, as they say. In a nutshell, it’s all about eCommerce with a frosting of WordPress. Listen to Episode 21 Where to find Bob: Website: bobwp.com Twitter: @bobwp Tools and Resources discussed: WooCommerce Easy Digitial Downloads Blubrry Libsyn AffiliateWP BeaverBuilder CoSchedule ThirstyAffiliates Shareasale

Photo credit: Frank Mckenna on Unsplash Learning Management Systems In this episode, I am chatting with Kim Shivler about Learning Management Systems, what are they and how easy it is to create a membership site of online courses. If you are thinking about selling courses or have clients that want to, this episode is for you. Kim Shivler Speaker, Teacher, Strategist – Kim Shivler, M.Ed. has worked as a writer, instructor, developer and serial entrepreneur for over 20 years. Her business experience includes computer network and database administration, technical training and writing, project management, web development, and work as an aesthetician and spa owner. She also worked for large corporations including Tivoli, an IBM company, where she was part of the worldwide technical sales and marketing team. Kim learned HTML in 1995 building help files as a UNIX system administrator and opened her first web development company in 1996. Since then, Kim has worked as a business owner and employee in a variety of fields including a few years as part of an IBM worldwide team. Between 2008 and 2012, she worked with a variety of Content Management Systems and ran an online membership site for skin care professionals using Drupal. In 2012, Kim found WordPress and never looked back at any other CMS. She has been creating online courses in WordPress since 2013 and currently combines her background in education, years of business experience, and WordPress experience to teach others how to build online courses, their first WordPress site, and learning platforms. As a writer, Kim has worked in a variety of fields including software documentation and instruction, manuals for aesthetic and medical devices, and general health articles. She holds a Bachelor of Arts in English and Master of Education degree in secondary English education from the University of Florida. Listen to Episode 20 Sponsor – LearnDash This episode is sponsored by LearnDash – WordPress LMS… Made EASY! Check out LearnDash. Easily transform your WordPress site into a powerful learning management system using LearnDash. Sell e-learning courses, track user progress, deliver certificates, and much more! The #1 choice of Fortune 500 companies, major universities, training organizations, and entrepreneurs worldwide for creating (and selling) their online courses. Discover more at LearnDash.com Special Offer from Kim for Rethink.fm listeners Message from Kim: Ready to Learn More about Membership Sites and Online Courses? Thanks for listening to me on the Rethink.fm Podcast. Checkout these special offers for Rethink.fm listeners. Where to find Kim: Website: White Glove Web Training Website: How to Build An Online Course Twitter: @KimShivler Tools and Resources discussed: LearnDash – https://www.learndash.com/ Sensei – https://woocommerce.com/products/sensei/ WP-Courseware – https://flyplugins.com/wp-courseware/ LifterLMS – https://lifterlms.com/ MemberPress – https://www.memberpress.com/ Paid Memberships Pro – https://www.paidmembershipspro.com/

Why User Research Matters In this episode, I am chatting with Melissa Eggleston about UX, what it is and why it is a crucial component in creating a successful web project. I first met Melissa at WordCamp, Asheville in 2015 and had a chance to visit with her at the happiness bar and see her presentation Website Design with UX in Mind. Melissa Eggleston Melissa Eggleston is a User Experience Specialist and Content Strategist based in Raleigh / Durham, North Carolina. She helps businesses, non-profits, and universities find, attract, and help their target audiences. She often works for agencies and design/development teams. She’s able to see the big picture while also digging into the details. She’s worked on projects for both tiny tech startups and big organizations such as the Bill & Melinda Gates Foundation. Melissa’s is the co-author of The Zombie Business Cure – How to refocus your company’s identity for more authentic communication. Listen to Episode 19 Where to find Melissa: Website: Melissa Eggleston Twitter: @melissa_egg Tools and Resources discussed: Don’t Make Me Think by Steve Krug Just Enough Research by Erika Hall Hemingway Editor Jared Spool’s All You Can Learn Library Grammarly – Awesome – in Browser Grammar checker

Photo credit: Papaver rhoeas on Unsplash From Photography to Plugins In this episode, I am chatting with Robin Cornett about her journey into plugin development. Robin started as a photographer who built her own website. Since those early days, she has created some very useful plugins, and is a contributor to the Genesis Framework. Robin Cornett Robin’s journey into code started when a friend called her with a problem. Her company website was built with a custom CMS (content management system), and it was very difficult and costly for them to make any changes. She asked if Robin would be willing to help her figure out how to build a WordPress website. The rest is history. Today, Robin builds websites for nonprofits, bloggers, and small businesses. She is also a plugin developer and has written some very useful plugins both free and premium. Listen to Episode 18 Where to find Robin: Robin Cornett @robincornett on Twitter Tools and Resources discussed: Robin’s plugins Easy Digital Downloads Affiliate WP StudioPress – Genesis Join the Genesis Slack Channel Avoid These Common Mistakes Adding Images to WordPress Also of note, yes I can confirm, namespacing in PHP was introduced in 5.3.

Photo credit: Yanko Peyankov on Unsplash Workflow Wisdom In this episode, I am chatting with Nick Davis about his own workflow journey and why he started GenesisWP.guide. Nick Davis Nick’s been building websites for fun and profit since 1997, doing everything from working as one of the first online journalists at the BBC; managing the website of one of the UK’s largest airports; to running a large team of web developers and designers for a publishing company in Dubai. Since going out on his own and discovering WordPress in 2010, he’s worked as a WordPress developer and consultant helping business owners and agencies launch better websites for their businesses or clients, obsessing about making everything on their websites as easy to manage as possible. Listen to Episode 17 Where to find Nick: I Am Nick Davis @iamnickdavis on Twitter GenesisWP Guide Tools and Resources discussed: KnowtheCode.io Alain Schlesser – Reusable Code Series Transcript Jackie Hey everybody, this is Jackie D’Elia with episode 17 of Rethink.fm and I have my very special guest, Nick Davis. Hey, Nick. Nick Hey, how you doing? Jackie I’m doing well. Thanks for being on. Most of the folks that listen to this podcast that might be in the genesis community may know you from your GenesisWP.guide site and the newsletter you send out, but you’ve also been, you also have your hands in lots of other things. Can you give us an update on what it is that you do, where you live and what you’re about? Nick Sure. Yeah. Too many things, I’ve been trying to slim it down but yeah probably people from Genesis, know me from GenesisWP.guide. Mainly I do the newsletter once a week, This Week in Genesis, a very creative title. I think a lot of people know me through that, we’ve got a few 100 subscribers from that so it’s going pretty well. I’m a WordPress developer, I live in Italy. Before that I was in Dubai, before that was in UK. Done lots of different, I guess you could say maybe side businesses. I’ve been in WordPress development, I was co-founder of Lean Themes, we did a couple of I like to think really nice themes for Genesis. One of them got picked up by StudioPress Kickstart, which we’re still getting inquiries and stuff about which is great. Did ThemeVale for a while which is setting up themes with people, doing that as like a business as well. Sort of trying lots of things, seeing what works. Really right now I’m super focused on my consulting and I just try to find a bit of time every week for the GenesisWP guide. Jackie Okay. GenesisWP guide, when did you start that? You recently just said you had a 100th newsletter that came out, the 100th edition. When did that start? Nick It was just over two years. I haven’t quite managed every week, but yeah it’s been, I think it was March 2 years ago so a little while. Jackie I think that’s a really nice way of keeping the Genesis in touch with each other and seeing what’s going on. I’m just curious, how do you curate all of that? I know you have something on your site where people can go and just contribute, put a link in, what it’s about and why you think it would be useful. Do you use that was a way or do you have other methods of gathering information to put into your weekly newsletter? Nick Sure. I put a thing on the site and that definitely helps so if you haven’t been there and you’re in Genesis, this is my call to action for you now, go to GenesisPW.guide. You do have to register because I don’t want anonymous contributions, but you don’t even have to register for the newsletter, you can just post something. It goes literally straight up on the homepage, so don’t post anything bad, you’ll get banned. Stuff goes up on there and I really did it, yeah, to help me create a newsletter and also because it’s long term and it’s going to be super long term cause I’ve been thinking about it so, so, so long, I’d love to turn it more into … Have you ever seen a Product Hunt or Nomad List, those kind of listing sites I think that would be great. That’s just really where I’d like to get it to. Right now, my time is just about enough to do the newsletter each week, but I think, hey, that’s okay. Every week another few people subscribe and so if and when I ever branch out and do stuff, there’s a ready made audience of people to use it. To answer your question, people come, stuff comes through there. Some people do email me, some people tweet at me. Please don’t tweet at me, just post it on the site. It’s something horrible but I had someone the other day saying, “I can’t wait to see my XYZ in This Week in Genesis,” and I thought, that’s great but I’ll decide what goes in there, thanks. Mainly I look at a hashtag, I really to start with I looked in Facebook, I looked in Slack. I honestly don’t have the time at the moment. I do a big skim through, I’d probably look at, you know, Rockstar are going through that now and I can just look, see the people. These are good people, this is not such good quality stuff. I guess the one thing I suppose that’s worth clarifying if you’re listening is for me, although it’s perhaps not the best name but This Week in Genesis, but for me I want it to be the best stuff. I don’t want it to be everything because there are frankly people putting stuff out there and I understand people are learning but people putting stuff out there that’s great, keep learning, keep improving. I like to share it. It’s just my opinion and obviously it’s just what I think is good, but I’ve had a few guest contributors and stuff along the way. That’s really the mission of it is just to put a spotlight on people in the community doing good stuff. Jackie I like the way that you break it up too. You have different sections in there for things that you’re showcasing, for themes and plugins and podcasts, lots of different things that are happening in the community and just kind of putting that together. It’s easy to skim down there and take a look and see what’s going on. I like the way that you put where things came from, like where you found them from, like Twitter cards that are there and things like that. I think it’s a really nice format and it’s easy to read and it’s helpful to everybody. It lets you know what’s going on that you might not be aware of, because we’re all busy during the week. It’s very hard to stay on top of things, even just in the Genesis community, nevermind the WordPress community or just development and design in general. There’s an awful lot going on that I miss every week. Nick Well thank you. Jackie Onto your WordPress development business that you’ve got. What is it that you typically, what type of work do you typically do and what’s your role in that process? Nick The type of work I typically do at the moment is really around supporting either agencies or companies in WordPress already. That’s really, it’s almost become a bit of a specialism in a way, it’s just how it’s worked out. I do, most of my work right now is with a couple of agencies. One of them I have some semi retainer agreement with, another one they just send me so much stuff I might as well have a retainer agreement and then I also do some stuff for a big hosting company in WordPress, I help them out with some stuff as well. For me, that’s really nice, I love working with different clients but at the same time became a dad three and a half years ago, you know, life changes, my wife works. It’s great to just have, “Here is some more work, get on with it. Here’s some more work, get on with it,” rather than 10 calls about how the site map is going to be and this and this and this and sort of walking the client through WordPress and stuff like that. I’ve got ready to go projects at any time, just almost become my specialism is being the guy to help out other teams. Jackie At what point in a project are you typically called in? It sounds like maybe they do the design and the discovery and the design process and then they pass it off to you for the build process? Nick Yeah, very much. I do do front-end stuff as well but I’ve also been doing a lot of back-end stuff. One of the agencies, they do the design and they do the front-end development and then I pick it up at that point. I’m really just focused on Genesis and WordPress development then, which is really nice. I don’t mind doing front-end development, I used to do it all the time. I started doing Photoshop for Genesis like a lot of us did, like Bill Erickson did who many of us look as like a role model for that. I do front-end stuff all the time but I do a lot of stuff focused on the back-end now, which I really enjoy. Jackie What kind of workflow tools do you use for your build process? Nick Different kinds. I’m working with different people and they don’t all … One in particular I’m really dictating what the workflow is because they see me as a specialist, it’s just me. Others to a greater or lesser degree I’m working with different teams with existing workflows, people that are probably not a lot more than me as well. A real mix, but just to give you an overview, my editor, I use PHPStorm which is about a year ago probably thanks to Tonya Mork maybe finally pushed me over the edge because I joined KnowtheCode and she uses PHPStorm so I thought, “If she’s using it, I’m going to use it.” Sometimes personally I usually setup things in terms of tasks, things like that, Gulp, the other company I worked with that used Grant, that’s fine. It’s especially been quite good because it means I’ve picked up lots of different things whereas I suppose if you stay in your own thing and you don’t really experiment and one day you get a project that uses Gulp and you’ve never used it before, you’ve got to figure out and learn it. That said, I am very much, I don’t actually explore a lot of tools. I think a lot of it is frankly, and just wanting to give value on your podcast and useful answers, I frankly think a lot of it is a waste of time. I think people spend far, far, far too much time trying different tools. I have certainly seen in our community, and not to say that workflow is important, it’s obviously massively, massively, massively is but I think just use something when it’s ready to be used. I didn’t jump into Sass minute one, I didn’t jump into Gulp or Grunt minute one. I’m never stuck because of that and when I had to pick it up and learn it when it was a clear benefit, then I jumped in. I’m probably not the only person saying that in our community. I remember Bill Erickson and Jared Atchison saying pretty much the same on officehours.fm a couple of years ago. Obviously we’re further along since then, there’s more need for it I think now. Jackie I feel the same way. I was a little late to the party on Sass too, but definitely have found it to be very helpful for me. Are you using a starter theme when you build out a project or are sometimes you using maybe a Genesis StudioPress theme already or a third party theme? Nick Yeah, that’s a great question. Before the build tools and things like that, it was just Genesis sample theme, go. It’s smart of me to say it because I’ve got the perfect starter theme in my head but I never, every project I do I’m constantly … I learn something and I want to apply it to the starter theme but then I’m already on to the next project. Every project I do is kind of my starter theme because I’ve sort of built on the one. I do have a GitHub repo with a starter theme but it’s probably so far in a moment from where I’m at, the second I get more caught up with things I’m going to update it because I really want to pay it forward. I learned so much from so many other people that I want to do a starter theme. One opinion I have about that, it might sound contradictory, is I think you have to write your own starter theme. I think you can look at other peoples, and definitely while you’re getting started, I think you’ve got to completely own it. You’ve got to just own it. I was talking to a friend of mine about this the other day, he was helping me with some code and he had the perfect solution but I said, “I can’t just use this, I need to understand it first.” You get in such a big mess if you’re just taking code you don’t fully understand. You’ve got to write your own starter theme. Jackie One of the things I learned a lot about was, especially from Tonya and Know the Code, is just how to be modular with a lot of things. I got out of the habit of dumping everything in my functions PHP file and I got into the habit of doing includes and breaking things out that had specific purposes, so just a place where, a PHP file that on enqueues all your scripts, another PHP file that does this and does this and then keep those separate. I think it makes it easier to have a modular starter theme where you can turn things on and turn things off and I agree. I have struggled with the same thing you mentioned is I get a starter theme and then I get started on a project with it and then I have to start adapting things and making changes for that specific project and I’m thinking to myself, “This would be really good to roll this back into the starter theme,” but by then I’m behind on scheduling and the other things and I never get back to the starter theme to go and integrate that. I thought, wouldn’t it be great if that was a parent theme and I could just make my additions to that starter theme in the beginning and then use it with my current build. I haven’t quite solved that challenge as well, so my starter theme tends to lag where I’m currently at. Each client build I’m working on tends to be my latest version of the starter theme so I can sympathize with you on that. Nick Yeah, yeah. Two quick things on that is one you should go and read Alain Schlesser’s post on reusable code. I’ve been trying to get more and more into reusable code and I know what Tonya says about modularity, the way he really looks at it is really, really good. His examples on there, they’re actually all OOP so if you’re not running OOP it can be a bit whatever, but it still explains at such a general enough level that it’s still really, really useful. It’s just writing the code that’s just for the client and breaking out the reusable parts in a more organized way and once it clicks it’s just really, really beautiful moment. I think the second thing to think about based on that is that, you just do these leaps. As you say, you start doing everything with your theme in functions PHP and then you’re like, “I need to call a function, I have to plugin,” and then you think, “I probably need several plugins.” Beyond that, I think what you really need is packages or libraries or whatever you want to call them, you need bits of code, modules that can live inside a plugin, live inside a theme, do a certain thing. I’m doing one at the moment for Advanced Custom Fields because I do the same thing over and over and over and over and first of all, I thought, “Okay, I’ll do it as a plugin,” but it might go into theme sometimes, it might go in three plugins sometimes. It needs to be even more abstract from that. The start of it’s on my GitHub if anyone wants to check it out, it’s really super beta at the moment, it’ll definitely be improved. That’s been a big time saver for me recently because I ended up doing Advanced Custom Fields related things over and over and over and over. I think the final thing I would just say on that really quickly is Chris Coyier, you know, CSS Tricks, he was talking about CSS, he was considered one of the guys on CSS, but I always think of something he said on his blog which is basically, CSS, just try and do the best you can and he was really talking obviously about CSS can be quite maybe difficult and contradictory perhaps compared to something like PHP, but I think you can even apply that to any coding in general. If you have the right intention of not repeating yourself, of doing things in a modular way, don’t beat yourself up. You always want to go back and fix things. I had this, jus this month, I just couldn’t understand something, I spent like a week rewriting it. You get to a point where there has to be a clear benefit there, so I think just do the best you can, move on to the next project, do the best you can. The thing where you can get some of that time back maybe is when you come to the project and you need that say Advanced Custom Fields thing again is, you can take what you did before and say, okay, it’s embedded in this plugin theme, it shouldn’t be, but can I pull it out, can I make it a module, where’s the 80-20, where’s the 80 client and the 20 reusable and put it into the next project and this time around do it as the package and keep going and keep going. Then one day you might come back to that other site and you might be able to put the module in and pull out the other code if you need to but if it’s working fine just leave it, but just do the best you can. Don’t kill yourself. Jackie Yeah. I’m working right now on a series of posts that I’m writing and the first one was about just the SVG icon system that’s in the 2017 theme. My next step was, and I’ve already done it in one build that I’ve done, is just take that code and adapt that to use in my Genesis starter theme and have one SVG icon folder that has all my individual SVG icons in there and then just a Gulp process to SVGO and put all of that together into an SVG sprite. Then from there be able to use that anywhere in the theme, whether I’m doing social media icons or I’m doing design elements that are part of the theme design and have everything called from that one SVG file. That kind of eliminates my whole need for Font Awesome and lots of other things and then there’s all the style sheets that load with those and all the extra code that loads and it’s much leaner and cleaner. I really like the way that they did it in 2017 and I was thinking to myself as I looked at it, I was like, “Okay, how can I take all of this and adapt this to something that I can reuse everywhere with every theme I’m working on where I can just drop it in and say this is one thing?” I’ve written something very similar to theirs where they have an icons function PHP file that has all of that code in there and that you can just include into your project and now you have all of that available for you so you can code the SVGs to show up where you want or you can do like they did with the menu system and be able to assign it. I thought that was pretty slick actually the way that that worked was it reads the URL and then parses it out and says do we have a match and if we do then it switches the icon out for it. That’s much cleaner for an end user because if they want to build a social media menu all they have to do is go in and put in their links and put in the title and save the menu and there you go. They have all the SVG icons right there. That’s one good example I guess of trying to find that 80-20 where you can say, let me adapt all of that, let me see if I can package that so that I can easily move it from project to project where it’s not tentacles, where it’s all interconnected everywhere and it’s going to be difficult to pull it out. That’s my challenge. I think the next post I’m going to do in that series will just be how I migrated that over to Genesis and how it’s something that you can just drop into any Genesis theme and start using. Nick Yeah, yeah. That’s the kind of thinking you need. Jackie I like it, number one, it’s lightweight. You don’t have all of that weight from loading Font Awesome. I get to just load the icons that I want, so you basically pick what you want to put in your build and then it just generates the sprite for you. It can be very lean, it might have 20 or 30 icons in that maybe the whole file that’s in there. I do like that the file is only loaded once per page and it’s typically down at the bottom above the body tag, closing, and it’s there and then you just use it with the xlink:href to call it wherever you need it on the page. You’re not having all of these extra HTTP requests to load all of these images or icons everywhere. I think it’s a pretty slick system so I’m in favor of it. I like the simple social icons plugin. The only challenge with that one is it is not as user friendly for an end user to reorder things. You have to go in and do a filter and change the order of the array elements. That’s just not something somebody is going to be able to do on their own and the idea of being able to use it in a menu system where they can just drag and drop and reorder their menu items makes much more sense to me. Nick Yeah, yeah, absolutely. Jackie What else have you got your hands into? I did some reading on some things that you’ve done and you had, was it ThemeValet? Nick Yeah, that’s right. Jackie ThemeVale, you’ve Lean Themes. What was your reason for dabbling in a lot of these, I would call them more like passive income projects so that they’re not dollars for hours type activities? Nick Yeah. I think it was to try different things. Lean Themes, I bumped into a guy who’s a great designer, David Burkett, who used to live in Italy but he’s now in Barcelona so he’s having a nice time there. I just had a chance meeting with the guy and we stayed in touch, he had these amazing designs and I said, “I can put them in WordPress and there’s this great Genesis community and stuff,” and we just thought we’d give it a go and just see what happens. For us, I think it was really just strictly a side project. We probably never put the energy to take it to the next level, but that was fine, that was a hard decision. I was really proud of what we did do and when I got asked to do one of the themes on StudioPress for me I was very, very, very happy to have that on there. That was that. Jackie That was the Kickstarter Pro theme? Nick Yeah, Kickstart Pro theme, which is still on there. You can still grab it. If you’re a pro+ member or whatever you can download it and check it out. It’s something I’d probably like to do a version 12 at some point because I think at one stage it was quite popular, obviously time moves on and designs and tastes and things change but I still think it’s quite popular as a landing page. I think at the time we did it a lot of the Genesis are very sort of blog first, which is fine but we wanted to do more of like a landing page, I’ve got something to sell, I’ve got a product or a service and of course now there’s loads of themes like that on StudioPress. Jackie What about ThemeValet? What do you do with, that’s a service of setting up a theme for somebody? Nick Yeah. I was chatting to a friend of mine about how annoying it is to buy a theme and you install it and everyone expects it to look like the demo but it hardly ever does, most themes don’t do that out of the box. I know some themes have got one click import everything and it all looks great, so it was just to kind of test the premise of would people pay, would they find value in stuff, try some different price points, different service offerings, like tweaked it a lot. Definitely had some traction for a while. Right now I’m really not putting any effort into promoting it at all. I think it’s kind of run its course in terms of my energy I have at the moment, I’ve really, really tried in the last year to focus more on it. I don’t think it’s any coincidence that while none of these side projects have taken off, while I don’t have quote unquote passive income, the consulting side and the things I’m doing now have got to a much, much higher level. I’m working with sometimes people have to kind of pinch myself that I’m doing their stuff so I think there’s a lot to be said. It’s a balance, you have to find your focus but you still have to leave a little bit of room to experiment and try things. Jackie Are you finding that newer designs that are coming from agencies are creating more challenges on the development side? Just curious how things are evolving and changing and what opportunities that presents to try to solve things in a different way. Nick Yeah. I think it’s always a bit of an arms race. I remember … I sort of played around doing my first website back in, way back in like 97. That was just messing around, that wasn’t professionally, I sort of did my first popular website. It was actually for a charity but it was good enough I would’ve got paid for it if it wasn’t that in 2000. I remember a few years ago when it was an add on to have responsive design or a lot of people who was, you know, PSDs or WordPress 3000, 4000, all responsive like another 1000, of course now you can’t do that anymore, so people sort of, some developers grumbling but they have to do this and it used to be easier before. I think that still happens now with more and more Javascript and stuff getting involved, heavier animations and stuff I see, I see a lot of, I do a lot of things, connecting to different APIs and stuff now that perhaps clients didn’t expect before. At the same time, I think there’s new suites of tools, there’s always things to help you. There’s always, someone’s already written a framework or something like that. If you want there’s things like foundation for sites like front-end frameworks you can use as good bases now. Of course it’s always been normalized for just straightening out your CSS. There’s things, I think the biggest thing you can do is just level up, like, I personally try to do an hour a day before I get into client stuff and that’s really hard, believe me. If you’re anything like me, you just want to get going. You feel almost terrible for your clients but you’re not doing them a favor if you’re not learning. I try to do like an hour before I get started if I’m not too buried to learn stuff. Just doing that, you will far out learn any demands you get. I think the other thing I’d say, the other tip, again, wanting to give people value, practical things they can take away is, sometimes before, if I get in a bind and too stuck on work, I would maybe, just think, “This bit of Javascript, can it be outsourced, this bit of CSS, can it be outsourced?” Obviously someone who’s a good level and is not going to let you down, I see it as a less complicated thing, but it’s going to take me too long and it’s not worth it and I know I can outsource that part and it won’t cost me much because at that point it’s a commodity almost, right? One thing I’ve been doing about for the last six months or so is, I wasn’t quite having a mentor, I had to have a mentor, but I found someone. I won’t say their name because I don’t want them to get bombarded with people because I know this particular person is at capacity already but there’s lots of people in the community, go find someone. I found someone that I could, I almost call it up source. He earns far more money, you know, his per hour rate than me, he’s a super expert and if I am stuck on something, I know I can talk to him and he will bill me, which is good, I’m very happy about. One, it means I only ask him things carefully, and two, it means there’s another incentive to learn, to try and do an hour a day because you look at the bill at the end of the month and you think, “If I just learned that, if I knew that,” but I’m coming on leaps and bounds because of that because he’ll stop me going down a rabbit hole way, way, way early on. If I start doing down one, he’ll pull me back. I think you need that. Like I said, it’s not like a mentor because it’s not a structured thing, but if I hit a problem, that’s great. I think you need, find someone, it might be someone you don’t have to pay, but I’m almost more happy paying because then I know it’s a fair exchange. I don’t feel like I’m leaning on someone too hard. If you don’t have the money for that right now, because if you’re starting out and absolutely every dollar counts, you’ve got to hold it back, and of course things like Genesis Slack and stuff like that, I just think sometimes you just need an answer and you need to jump on the phone with an absolute pro, you know, what would they do. I think find someone like that, it’s a real investment. I can’t recommend it enough and for a fact I know I’ve spent 1000s of dollars with him and it’s absolute, and there’ll be some people thinking, “Whoa,” but it’s so, so, so worth it. Obviously join KnowtheCode, that’s just a no-brainer, it’s 2, $300, but I think even something beyond that. It’s no coincidence that since I’ve did that and particularly since I started working with this guy, my workload has gone up, I’m booked, I’ve never been booked so far in advance because I work faster, I work more efficient. You were talking about how can we combat greater demands, well if you work fast, if you have reusable code, you can handle it. You’ll get better faster than the demands come if you stick with it. Jackie Yeah. It also gives you an opportunity to collaborate more too and take on larger projects when you start to lean on folks that have specific expertise that you don’t and you then, like you’re doing, you reach out to somebody and they might help you with this project. It also starts to develop a relationship with that person and they might have a project where they want to pull you in on. I’ve had several recently where I’ve done some collaborative projects where things I was good at was a benefit but there was some other people in the project that were way better than me in certain areas and together we were able to do a larger project that none of us would’ve been able to do on our own. I think that’s another opportunity. Definitely improving your skills, I mean, when I started with KnowtheCode back … Gosh, I can’t even remember how long it was, but it definitely changed my whole focus about how I was building my sites and putting my code together and that has made me more efficient in what I’m doing today. I can spin up things a lot quicker. I can definitely adapt and change things easier where I’m not spending so much time reworking and rewriting things again. I agree with you on that, that’s one good way to go in and level up your skills. You should always be spending time on education every week at a minimum. I try to dedicate Fridays or a part of a Friday for making sure that I’m exploring something that I’m not comfortable with or familiar with yet and that helps, but whatever works for you. Whatever time you can carve out of your life to continuously learn every week is time well spent I think for sure. Especially if you want to improve and advance your career, make more money, have more free time, whatever it is, I think that really helps. Nick Yeah. I think that’s spot on. Particularly about working with other people as well because you can get stuck in that silo and way of doing something that might be, not only to leverage people with more specific skills, but you might also realize that you’ve been doing something horribly, horribly, horribly wrong. Not wrong wrong, but it could be done in a better way. This is a key thing actually I think for anyone listening, if you’re the person who takes the project and you’re always by far the only techy person on it, you have by far more knowledge than the client, that’s kind of great because it’s nice to feel that you have some knowledge and obviously appreciating the stuff but you need to … You won’t learn, you will learn but very, very, very slowly if you work with other people. Just find any way of doing it, if it’s contributing to open source projects or whatever. You’ll be so embarrassed and so uncomfortable, it’ll be so awkward and you’ll ask so many silly, silly questions, but you’ll get better. You’ll also see things, even people way above you that probably do and you go, “Have you ever thought about doing it like that,” and they might also because they haven’t considered that, but if you get, it’s really dangerous if you’re stuck in a silo and you’re just working with clients who are not technical, you’re not going to learn as fast. It really hit me around the start of this year, late next year, you need to learn these things now. You need to get going because other things are coming along. How long are you going to wait? Do you know WordPress inside out? Do you know Genesis inside out? Jackie Yeah. Actually even do you know Git and being able to work with a team and make commits and push changes and pull changes. You read about it but when you actually have to do it the first couple of times it’s scary. You’re like, “Okay, so I’m on a GitHub project with somebody and I’ve got to push a commit,” you’re so afraid you’re going to do something wrong and overwrite something. It’s great to get in that type of an environment, even if it’s just an open source environment and just start collaborating and working together and getting comfortable with that. I think that’s very helpful. For me, that was very helpful in just starting to use Git everyday in all of my workflows and everything that I’m doing where I’m making regular commits and I’m organizing my process of what it is I’m building out, what it is I’m doing and separating things. I think just getting in the habit of doing that can be very helpful in just your entire process. Also it can save you if you make a mistake or many times I think before I was comfortable doing that, I would want to experiment and maybe make a design change or a code change. I was so worried I wasn’t going to be able to put things back the way that they were when I was done and it was more trouble to make a whole copy of it all, but with branching and you start getting comfortable with doing that, you can realize, okay, I can go off on a branch and try some things, if I like it great, I can roll it in, and if I don’t, I can let it go and I haven’t lost anything. That’s really great for your creativity I think too, it’d give you a chance to experiment and learn. Nick Absolutely. Even if you’re not pushing and pulling with Git, I remember seeing, I think Mark Jaquith talk, it was for a WordPress series it was probably five or so years ago now, he said if you just take one thing away from this talk, just at least use version control locally, at least. Even if you’re not on branches and I agree branches are a fantastic way and really you should be using them, but even if you’re just committing on master branch, at least you’ve got that there- Jackie You can always roll it back. You can go back and check out a previous commit and undo what it is you’ve just done for sure. I think getting in the habit of that is working locally, I’ve met recently some folks that are still trying to work on servers, remote servers where their hosting plan is and don’t realize how slow that process can be so getting comfortable with working locally and pushing your changes up to a staging site for somebody to monitor say like a client, that can really your whole workflow and kind of speed things along. Then there’s lots of other things you can do along the way to even improve that. Little by little, the most important thing I think was just getting a handle on version control and understanding that. It’s actually very cool. Once you see it and you’re like, wow, this is great, I can just go back and check out one file that I need that I maybe did something to that I didn’t want to keep and it’s very easy and it just puts everything back to where you were. Nick Yeah. Yeah, yeah. That’s fantastic. Learning’s the key. I think I probably 10% of what I need to know right now, sitting here right now in June 2017 and that’s crazy but obviously I’m making a living from doing it but I think there’s just huge, huge, huge things I don’t know and every day there’s more things. I think you’ve got to be super aggressive about it. You absolutely have to find the time because you’ll try and find every excuse in the world not to do it if you’re busy or this and that, whatever, if you have to get up an hour early and do it. I’m not perfect, I go through times where I don’t do it, but you have to keep going. The other thing as well is because I think if you’re self-taught, it’s really, really dangerous that you miss something that could’ve really helped you. That’s what Tonya is really good, KnowtheCode, because I deliberately go back and watch, I look at it almost, an hour ago I look at it and think, “I definitely know it. I know this, I know this, I know this,” but there’s also a bit in the back of my brain that’s like, “Yeah, but what if,” and every time she gets me. There was a PHP string building one the other day, like basics, and like, it’s almost laughable that I would sort of watch that in a way, not to sound big headed, whatever, and I watched it all and there was two, three things I didn’t know and that’s definitely going to help me in the next few days for sure. I think watch it on a faster speed if you have to until it gets to the point where you don’t know- Jackie That’s funny. I think I’ve watched the namespacing one several times just to get comfortable with using namespacing, especially if you’re doing a plugin or something that you’re going to distribute where you really want to avoid collisions and problems and it’s not common for people in the WordPress space to use that if you’re typically doing prefixing, which is fine until there’s a prefix that’s the same as the one that you’re using and then you have a collision and a problem. Namespacing is a great, but it does take some time though to get to comfortable with using it and using things from other PHP files and getting comfortable with how to put all of that together. I’ve had to watch that one several times and several others on there as well. I agree, it’s a great resource too, it really is. Nick Yeah. Jackie We’re wrapping up for this episode and I just wanted to ask you one final question. Is there anything that you’ve been rethinking that has got you kind of moving in a different direction? Nick I think the biggest thing specific to coding stuff or WordPress is just packages, libraries, whatever you want to call them, is separate modules, separate code, just trying to use those, I think that’s really helped me a lot. I think one thing, maybe one thing on the technical side and one thing maybe on the other side would be right now I’m trying to do something where because the flip side of trying to make everything reusable is you can really go in a rabbit hole of making the perfect reusable code and you’re not being a good developer, a professional developer and you’re not shipping stuff. You’re saving time maybe in the future, but you’ve got to ship stuff now and it’s really easy to justify, “I haven’t shipped today because of this,” so now every single day unless I have something really, really major for one particular client, I am shipping one thing to that client Monday through Friday. Here’s one thing I pushed up today, here’s one … One they obviously feel more loved even though the reality is some days you’re really deep in one project and one in another but you get feedback faster which we forget, but it stops you going down the rabbit hole of trying to perfect everything. I’ve rethought I guess the conventional wisdom and I get that it is obviously a single thing and I am single tasking, I’m not doing three things at once, but it’s more efficient to just do a whole day on this and maybe a whole day on this. Maybe it is, but I think there’s opposite arguments as well. If you’re doing multiple projects at once, you do the whole day Monday, Tuesday, Wednesday, you try to pick up a project on Thursday, no matter how good your notes are or how well organized your code is, you’ve forgotten half of it, you’ve got to pick it up again. There is that trade off of, I’m switching tasks too much but there’s also if you’re just touching something every day, you know exactly where to cut, you pick it up in five minutes and you’re running again and you’re shipping stuff. That’s a great antidote for not doing perfect code, because if you have to ship something to a client everyday it won’t always be perfect but at least you’ll be providing value. I think that’s it for me. Jackie That is very good advice, ship daily. Nick Definitely. Jackie All right, Nick. Thank you very much for joining me on the podcast. If folks want to get ahold of you and reach out to you, how can they find you? Nick I’m on Twitter @IAmNickDavis, website is IAmNickDavis, D-A-V-I-S. GitHub, just Nick Davis. I actually managed to grab my first name, last name on there. Just what I said about don’t hit me up with things for Genesis on Twitter, excuse me, please feel free to say hi. Jackie All right, Nick. Thank you very much and have a great week. Everybody else have a great week, and I’ll see you on the next episode. Nick Cheers. My pleasure.

Agency Workflows and Tools In this episode, I am chatting with Lee Jackson of AngledCrown all about agency workflows. What’s life like running an agency across the pond? Tune in and find out. Lee Jackson Lee is the founder of Angled Crown, a digital agency in the UK. They primarily build WordPress site and plugins for design agencies. Lee is also the host of the WPInnovator Podcast – The podcast for designers, we talk agency life, strategy, marketing and WordPress. This episode of Rethink.fm is sponsored by: This episode of Rethink.fm is sponsored by Beaver Builder. If you are looking to reduce design and development time, Beaver Builder is your answer. It’s the only page builder I recommend and with over 375,000 WordPress websites built with Beaver Builder – you’ll be in great company. Stop reinventing the wheel. With dozens of gorgeous page templates, you’ll be able to spin up an amazing landing page in minutes. Looking for a template for your site’s inner pages? Don’t worry, they’ve got you covered there too. You can even save your own designs as templates and reuse them throughout your site, or export them to use on a different site. Build your website in minutes, not months! An now, take Beaver Builder even further. Bridge the Gap Between Pages and Your Theme. Beaver Themer lets you create layouts for archive pages, a template for an entire post type, 404 and search pages, and create parts like headers and footers. Beaver Builder, Awesome Software, Great Support, and a Helpful Community. Get all the details at WPBeaverBuilder.com Finally got some time to try this out. I bought a copy of Beaver Builder for a recent project. I created a gorgeous custom landing page in just a few hours. This is quickly becoming a favorite in my digital toolbox. —Jackie D’Elia Listen to Episode 16 Where to find Lee: Angled Crown @leejacksondev on Twitter LeeJacksonDev Facebook group Tools discussed: Ganttify Projecthuddle SVG Support Plugin

All The Things In this episode, I am chatting with Morten Rand-Hendriksen. As someone who has taken most, if not all his courses on Lynda.com – all I can say is WOW – this is awesome. Let’s get started! Morten Rand-Hendriksen Instructor, educator, speaker at LinkedIn Learning, helping people master WordPress, the web, and online communication. Since joining forces with Lynda.com (now LinkedIn Learning) in 2010, Morten has 60+ published courses on WordPress, front-end web design and development, and web standards, reaching hundreds of thousands of viewers from all over the world. He also contributes to the web community as a public speaker, author, educator, web developer, and design philosopher. This episode of Rethink.fm is sponsored by: Delicious Brains – They make super awesome products for WordPress If you’re a developer who’s looking to speed up their workflows so you can work less but bill the same (effectively increasing your hourly rate), WP Migrate DB Pro is for you. Or, check out their blog at deliciousbrains.com. (Developers really like it) This is one of the plugins I renew every year. It speeds up development time. It’s keeps my local and remote database synced during development, keeps my media files synced and is built by a team that I trust. —Jackie D’Elia Rethink.fm listeners – Save 10% off today! (Limited time offer – Coupon expires June 30, 2017) Listen to Episode 15 Show Notes Morten’s Website @mor10 on Twitter Linkedin Articles Some topics we discussed: Twentyseventeen The Case for WordPress Telemetry WordPress Theme Customizer Creating Web Icons with SVG Essential Javascript Training Migrate DB Pro course on Lynda.com WP-Tonic Podcast A takeaway worth noting: What should WordPress developers be focusing on? You need to learn how to build things without WordPress. WordPress is a tool in your toolkit but it cannot be the tool you stand on when you do all your work. WordPress is literally a content management system that uses PHP, HTML, CSS and Javascript to create front-end content. —Morten Rand-Hendriksen All Morten’s Courses on Lynda.com Transcript Jackie The guys at Delicious Brains make super awesome stuff for WordPress developers. If you’ve ever experienced the pain of trying to copy your WordPress database from one install to another – dev to staging and back again, you’re going to seriously want to check out their WP Migrate DB Pro plugin. It not only makes migrating databases easier, but by saving you so many hours, it effectively increases your hourly rate. Definitely a must for any WordPress developer working on client sites. Check it out deliciousbrains.com. Open PDF transcript in a new window. Jackie Hey, everybody. It’s Jackie D’Elia with another episode of Rethink.fm. This is Episode 15. I have my very special guest, Morten Rand-Hendriksen who is a senior staff instructor at Linkedin Learning. Hey, Morten. Morten Hi. Jackie Thanks for joining me. Morten Good to be here. Jackie For those who don’t know you, and I can’t imagine there is a lot of people that listen to this show that don’t, is there anything else that you want to fill in about what you do? Morten Well, my main job is as an instructor at Linkedin Learning and Lynda.com, I also contribute to the WordPress Project in odd and unusual ways. I don’t really write a lot of code patches for WordPress but I ask a lot of questions about decisions that are being made. I propose things that should be done. I also contribute to the Community Project, like we’re working on something. I’m peripherally involved in a non-hard and heavy code sense in that project. Jackie Well, before we jump into that, I’ve just got a couple of questions for you. How did you get started teaching? Morten At random. Let’s see. This must have been 2009, 2008, something like that. I was working on a project, just some random client project. My wife was, at the time, doing what eventually became vlogging. She was one of the first people in Canada to make a TV show on YouTube where she went around interviewing people. She was a producer at a TV show. Then she would take all the people that she couldn’t get on the show and do separate things on YouTube instead. She got invited to this event for Microsoft. We were like, “Yeah, whatever. We’ll go to the Microsoft event.” Then at the event, they were handing out these little business cards with an activation code from new software that no one had tried before. It was an alpha, so it was very buggy. They said, “This is our new web design and development suite, it’s called Expression. We want you to try it.” Then I took one of the cards. I said, “Sure. I’m starting a new project right now, so I’ll try. I’ll just build the project on this new platform so I can really beta test it for me.” I started doing that and immediately ran into some pretty significant problems because it was an alpha application, so hardly worked at all. I was like, “I should really document what I’m doing here so that they know what I’m doing.” I made a blog that was called, at the time, just Blog.PinkAndYellow.com because Pink and Yellow is my company. I started just blogging about this Expression Web and Expression Design application. I was literally like, “I try to do this, everything explodes.” The funny part was it was you color pick inside the application. Instead of color picking what’s on the screen, it would color pick based on the screen settings for your computers, it was these random colors. It was very odd. I was documenting all these things and just putting it in blog posts everyday. Then after a while, I started getting a lot of comments back. The comments were very odd because they were super specific. They were like, “So when you experience the screen picking issue, exactly what are you doing? Where are you screen picking, inside the application or outside the application?” I’m like, “That’s a really specific question from some random person to ask.” I went in and looked at the IP address and then I noticed that almost all the comments on my blog had IP addresses in Redmond which is where the Microsoft headquarters is. I answered back to one of them and I’m like, “Well, maybe you should just call me instead of us having this ridiculous conversation on my blog.” They called me and then I went down there to just show them what I was doing. That got me … Because of that, I became a official beta tester for Expression Web which was their front end publishing platform. From that, I started writing articles for them about Expression Web in addition to my blog. Then Pearson Publishing contacted the Microsoft team and said, “Hey, we want someone to write a book.” Then they pointed Pearson at me, so then I wrote a book. Then I wrote another book, and then another book. We released four or five editions of that book. Then finally, I made a video tutorial for Pearson under the Inform It Labels. If you go to Amazon and search for my name, you’ll find all four books. The crazy thing is you can still buy these books even though the software doesn’t exist anymore. I keep getting royalties for it and I’m like, “You really shouldn’t sell this. This is not something …” I don’t think it’s even Pearson, I think Amazon acquired a bunch of these books. They just sit at a warehouse. They will just keep selling them until they’re gone. It literally started with a blog. It’s funny, if you go to my blog at Mor10.com and you go to the first blog post, that’s a blog post about me testing out Microsoft Expression Web. You can actually read the whole thing, see all these comments back and forth, and see when I realize, “Oh, these are people from the team.” I think I even left a comment at some point going like, “Oh, you’re the actual development team for this software? Maybe we should have a chat.” It’s somewhere in my blog. You can still see it. It was, like I said, totally random. It all stemmed from my blog. Once I started actually writing proper documentation that wasn’t just me ranting about what I was doing in the blog but thinking very carefully about why am I doing these things, how does this actually work, I’ve just realized that this is actually way more interesting to me than building things is understanding why they are done a certain way and then figuring out how to explain it to other people. Then from that, I went out to do a course. They asked me to do a course on Expression Web. When they asked me, I already knew that Microsoft was going to shelve it. I’m like, “Yeah. We shouldn’t invest any money in this. Just trust me on this. This is not worth your investment. I can’t say why but it will not be worth your investment so we should do something else.” Then they randomly were like, “Well, you seem to know a lot about WordPress. We have a WordPress course that’s outdated. Maybe you should do this because not a lot of people watch these WordPress courses so it’s not a big risk for us to let you do that as a first course.” Then I recorded the WordPress essential training course. It was released in the second week of October 2010 I think. Then I got a call three weeks later that said that’s the first course to ever earn back its full advance within three weeks or within the first month of release. Since then, it’s always been one of the top two or top three courses on Lynda.com. Jackie Okay. Well, as somebody who has watched probably almost every course you’ve made on Lynda … Morten That sounds awful. Jackie At some point or another. I really have. I really have. Everybody who listens to me or have seen on other podcasts knows I’m a big fan. Just in Lynda courses in general, I mean, I’ve even shared with you, we were chatting. Ben Long is a photographer. He has got some great courses on Lynda.com. I was hooked on those when I was learning photography. That’s always been my go-to source for learning. You did the course for WordPress. I’ve noticed you’ve done a huge mix of other types of courses that are outside of WordPress. I’m just curious, what’s your mix of courses that you’re currently working on? How do you decide what courses will be coming out in the future? Morten I’m not actually a WordPress developer. I’m a front-end developer that happens to use WordPress a lot because it makes sense to people I build websites for. Because of that, my proficiency for WordPress is extremely high just because I’ve done so much work with it. I’ve been with WordPress for so long that I know how it used to work, why it’s working the way it does now. I can see where it’s going. My passion, my core passion isn’t specifically WordPress, it’s just general communication through the web. You have an idea. You want to somehow convey that idea to other people in a way that they can access and understand whatever method they want to and then they should be able to communicate back to you and using web technologies to facilitate that communication. That’s what I’m interested in. A lot of that is just front-end development. Some of it is communication theory and user experience design. My field of focus is all of that. It’s not just WordPress. For the last few years, I’ve focused quite heavily on WordPress just to build out our library. Now, I think this year, my split is probably something like 60-40. I do 40% WordPress and 60% other things. I’m doing some big things on Java Script. I’m doing some emerging technologies. There is a bunch of other things happening. I’m shifting focus very much to either the leading edge or just past leading edge mark-ups, ES6, Javascript, HTML, see where things are going, how to use things now before they become the next standard, things like that. Jackie Yeah. One of your courses was on SVG Icons and switching them out with Font Awesome. It wasn’t a WordPress course. At the end of the course, you had a little movie or two that said, “Here is how you can integrate this into WordPress,” which I thought was a great way to present that because on one end, you have an understanding of the topic outside of WordPress because I think it’s really important to understand basic HTML, CSS, and Javascript on its own and be able to do something with it. Understanding how all of that worked and how you put it together to swap it out. You did a build process in there. I think you were using SVG. You were injecting SVGs in there. Morten Yeah. The course covers four or five different methods for doing the same thing. Jackie Yeah. I’ll put a link in the show notes for it. I thought it was a great course. I like those courses that go outside the WordPress bubble and get you honed in on your skills on that level. Then you can look at it. I’ll jump to another question that I did want to ask you is on the 2017 theme, I’ve dug in and started looking at some of the code in there. Typically develop using Genesis, so some of the things didn’t apply in the same way. There were some really nice bits of code in there that I really liked. You had done a course using social icons for a menu system instead of maybe using a plugin widget or something. I’m just curious what you thought about 2017 theme as a whole. I know you had one course where you actually pulled out some code out of there for navigation menu that you were swapping out from underscores. I’m just curious what your thoughts are on that. Morten The icon system that was built for 2017, so the system that uses SVG Icons not just for the social menu but for anywhere you want to use SVG Icons is a stroke of genius. It’s developed by Sami Keijonen from Finland. It is extremely robust and very easy to use. The tricky part is there is four or five different pieces that need to be stuck together for everything to work. You need to know there is a bunch of PHP in two different files, then there is some Java Script that needs to be hooked in and a bunch of CSS. When all these pieces stick together, the actual addition of any kind of icon within your theme becomes very easy. It’s built so that you can create custom fallbacks for each individual item. You can say, “This icon needs a PNG fallback, so I’m going to provide a PNG fallback. And this icon, if it doesn’t display, it doesn’t matter, so I’m not going to make a fallback for it. This icon needs a text fallback so I’m going to create a text fallback for it.” It’s a really well-wired system which solves one of the main concerns that a lot of people have around icons which is what happens if people have old browsers because SVG isn’t fully supported, which is a whole other topic which is really odd. There are people in our community that are doing great work, that goes well beyond just WordPress because the solution that Sami created can be ported into anything else. As long as it runs PHP, you can use that same solution. You can also rewire the solution to use other languages if you want to. If you were making some front end Java Script, single page application thing, you could actually use the majority of his code and just convert it into Javascript and still use it. For me, that component of 2017 is really well-built and probably the best example of how to use existing technologies to push modern technologies forward. There are some other things in the 2017 theme that I don’t agree with like the inclusion of a video header, which is probably the, pardon my French, but one of the worst things we’re doing on the web right now. If you go into the track tickets and you go into the chats and everything, you’ll see me very very aggressively trying to convince them not to do it because it’s bad practice. It’s honestly something we shouldn’t do. The argument that was made against it made for adding video headers in was everyone is doing it already. A lot of themes are doing it so we want to show people how to do it. My constant argument against it was simply, “I don’t care if people are doing something that is bad. It’s still bad. But this is still something we shouldn’t do.” There are a myriad of reasons why you shouldn’t have a video header, most importantly, just performance. My concern is when we do things in WordPress we set a best practice standard. WordPress is big enough that when we make a decision like for instance, switch two SVG Icons, number of switching SVG Icons on 27% of the web. Then all of a sudden, that becomes a thing. When WordPress shifts responsive images, that basically … You can watch the graph of websites using ICG mark-up. It was pretty flat. Then WordPress shifts it and then it eventually had this super sharp line that went up because all of a sudden, it’s being used all the time. Then the browser manufacturers go, “We need to handle this stuff right away.” Right? When we then jam video headers into WordPress, we’re basically telling people, “Video headers is a good thing to do.” It’s not. It will never be. It’s a bad … It’s blingy. It looks fancy but it goes against accessibility principles. It goes against UX principles. It goes against performance. It’s just a bad idea overall. The good thing is the original implementation of it was scrapped for something that’s far lighter. YouTube backing was introduced to ensure that people can use an external video service to serve up the videos instead of just hosting them on your self-hosted site — which would be terrible and very foolish to do. Still, it shouldn’t be there. Now, it’s there. Now, it’s built into core so now everyone can do it. It’s an open source project. You can’t win all battles. Jackie Yeah. You don’t have to use a video. Morten No, of course not. I don’t think a lot of people are, but I don’t think, on principle, we need to make more careful decisions about what we’re doing because it sets examples for people. When things like that get built into core, now it’s a feature that people will use. It will never be removed from core. Video backgrounds, which is what this is about, are purely visual elements that have no communicative value or purpose other than making things look good, right? That means if you’re adding a video background into anything on the web, you’re doing it purely to make your content look fancier. Then you have to make a decision, is this something that’s important enough for the experience that I should force it one everyone who visits or should this be something that only loads if the visitor actively engages with it? You’ll see a lot of news websites for instance now. When they embed a YouTube video into their page, you see a screenshot of the YouTube video with a play button. Then you click on the play button and then it loads. Then you get the video container from YouTube. Then you have to click play again. People go, “Why are they doing that?” Well, the reason is if you put a video container from YouTube on your page, you’re downloading the video onto that page the second it loads. They know that so they’re like, “No. We’re not going to impose on you the download from YouTube because you don’t need to buffer the first 30 seconds of that video unless you’re going to watch it. So we’re going to put a wall in front of it and say you need to interact with that wall to be able to open the video even if it increases the number of clicks necessary.” A video background is the opposite of that. You’re introducing a video component which is a heavy download and a heavy bandwidth component into the experience even though it has no communicative value. If you’re going to do that, you would have to then say, “What is the bandwidth connection of the person who is visiting currently on?” Which we can’t do because there is no system for it yet. You’d have to ask, “Is the person able to choose whether or not to load this video?” They can’t. Are we going to defer the loading of the video until every other piece of content on the page is loaded so that it doesn’t slow things down? Well, that defeats the purpose of a video header because it needs to be there up the top. There are all these strategic and technical questions that come into play that need to be addressed properly. The team that we’re building 2017 took all these things into consideration and implemented it in a responsible way, that’s fine. The problem is when we establish a standard like this, hand it over to other people who will not ask all these questions, will just do this without considering the implications of it. Unlike the team that we’re working on, 2017, someone might upload a 50-megabyte video, right, and make it play in the background or make it take over the whole page or force it to play with audio. There is a bunch of problematic things. Jackie That even happens with background images. Morten Yup. Jackie People are publishing content, start uploading images and don’t pay attention to the size of them. But before we go onto that, let me just jump back and I wanted to ask you, you had written an article about the need for telemetry in WordPress and understanding who is using WordPress and how they’re using it. We had a conversation not too long ago about that. Some really valid points you made were that most of the people that are making decisions about what we’re going to do next and what we’re going to add to WordPress aren’t necessarily the people that are using WordPress every day. Why you read that article and what do you think this means for WordPress going forward? Morten Telemetry projects or proposal stems from just observing ongoing conversations around features and WordPress core, which is every time a new feature is proposed or someone proposes removing a feature or something has changed, there is this conversation around, “Well, are people actually using this or are people to use it? How are they going to use it? Who is going to use it? Is this going to be something that everyone uses or just a few people use?” It’s a weird conversation because there is a lot of theory going on. People are proposing or not even theory, there is a lot of hypothesizing going on where people are just throwing out ideas and saying, “Well, I think that most people would use it like that,” or “In my experience, this is how people use it.” There is no concrete data to refer to. Then some user testing is done but the user testing is typically done internally in the active WordPress contributor community. User testing is announced on the Make Blogs which are only accessed by people who really care about WordPress core development. The people that things are being tested on skewer heavily towards advanced users who are involved in the process of building WordPress itself. As a result, we don’t really know much about the people who use WordPress every day for things like publishing content because we’re not reaching out to them. We don’t have any way of talking to them. They don’t have any simple way of providing feedback back. There is no button inside WordPress that says, “Provide Feedback,” right? You see that in a lot of applications. You have a little fly out, your click button and then you go to user voice or whatever. There is no such thing in WordPress. There is no easy way of providing feedback back to WordPress unless you know how the system works. It all came to a head during the conversation about whether or not to remove the underline button in the WYSIWYG editor. There was a proposal to simplify the WYSIWYG editor so all the buttons that are up in the kitchen sink at the top of your editor, which I am 182,000% for because the structure of the WYSIWYG editor made no sense. For instance, the drop down that gives you hierarchical content order was underneath the kitchen sink so you have to know how to click the button and then know how to use it. That should really be the first item. The WYSIWYG toolbar got scrambled. I mean, moved things around and reorganized. In that process, questions were asked about each individual button which is justifiable to say, “What is this? What does it do? Should it be there? What should we do instead?” In some cases, we looked at a button and said, “Well, this button follows HTML standards so that should be there. This button injects some garbage CSS into the page itself. That should go, right?” Then there were conversations about what are these buttons doing? We got to this underline button. The argument that came up was underline is too similar to link underline. Therefore, it’s confusing for user experience. To which I responded, “That’s a developer problem? That’s a problem of the theme developer not accounting for underline being different from the link underline?” While that is the case, it is not because of the underline functionality itself. It’s because of theme developers not accounting for this or not providing best practices. The solution, if that is the issue, the solution is probably to create some packaged style that comes with WordPress that distinctly differentiates it from the regular link underlines. Then theme developers can overwrite that style with their own class. Right? That would be the way to solve a problem. That’s not really on its own, a reason to remove the button. The response to that was, “Well, no one uses the button.” At which point, I and other people asked, “Based on what data are you saying this?” Then they’re like, “Well, no one used it. I’ve never seen it used.” I kept asking, “Where is the data to support this claim?” Then eventually, you come to this 80-20 rule. Well, 80% of the users need to use this before it’s valid. Otherwise, we shouldn’t have it in core, which ties back to the WordPress philosophy which is it wasn’t designed for 80% of the user base. The 80-20 rule is a lie because we don’t have data on 80% of the users. We don’t even have data on 1% of the users. We can’t use that as a rule. Yet every single major decision that has been made in WordPress ties to the 80-20 rule and is used by everyone all the time. That’s when I said, “Well, if we’re going to do this, we need data. What we should do is collect anonymized telemetry about how WordPress is being used. Anonymized telemetry literally means track how many times people click on a certain button or whether or not people click on a button at all or how many themes are being installed and how many plugins are installed but not activated, just things like that. Then build a system that truly anonymizes the information. The information that’s sent from your site doesn’t have any information about your IP address or anything else. It just has the core data about clicking. Then it goes into a system that further anonymizes it so that there is no way for anyone to see that behavior and then tie it to you. It would also include things like preventing the system from collecting actual keyboard input so you can’t store what people are actually writing. You can just see that they are writing something. I made a huge proposal about how this could be done to fully anonymize it, how to make it opt in rather than opt out, how to secure it so that if people don’t want it, they can jut uninstall the entire feature and then it won’t be sitting inside WordPress core. It will actually be removed from the platform entirely, and how to handle the data when it comes in on the back end. Who should have access to it? Who can decide what to collect? The whole menagerie, just full coverage everywhere because I really think we need data. It’s irresponsible to not have this data at this point because when we make changes to WordPress, we’re making changes for millions of people, millions, probably 10s or 20 or 30 million people will be directly impacted by any change we make. We can’t make those changes without knowing how those people are using the tools. The proposal was made and got shut down by Matt Mullenweg because his argument was it doesn’t fit in under the current three focus areas which are the editor, REST API, and Customizer, I think. Jackie Okay. But those three things, wouldn’t it be really beneficial to find out who is using those and how they’re using them? Morten Of course. Of course. That argument is nonsense. I’d tell that to his face, that is truly not a valid argument against this at all. In fact, that is an argument for telemetry. I think what he meant was we already have limited resources. Those resources are allocated to working on these three things. If we do this, it will take up too much time, which is really unfortunate but that’s the nature of open source is a telemetry project is not as sexy as creating a better WYSIWYG editor. It’s harder to get people involved in building it. It’s much harder to get people involved in building it if there is no sign off from people higher up that will say, “We want to include this.” Until we get sign off from someone higher up that says, “This needs to be done now,” it simply will never happen. That means WordPress development moving forward will distance itself further and further from the real user because the WordPress user base continues to increase. The increase in user base in WordPress is not an increase in people heavily involved in WordPress core development. It’s an increase in people who use WordPress and will never interface with the WordPress community at large. They will never go to a Word Camp. They’ll never go to WordPress.org for anything other than to download WordPress. They might never go there at all. They will have no interface with the community. We have zero information about them. They are an entirely black box to us. Unless we have telemetry, that data will never be available. It’s something that needs to be done. I don’t have the time or skills to actually build it. I have talked to a bunch of people who are very interested in building it, but at the same time, are weary of starting the project without sign off from someone higher up because this is a huge project that requires … It can’t be shipped in bits and pieces. It has to be done right off. It could easily be something you spend a year on and then it just gets shelved in which case, you’ve just wasted your time, right. It’s really tricky and at the same time, extremely important. Come June in Paris, I’m going to make this a conversation topic with a lot of people to make sure that at least people have considered it in a more careful way and not just written it off as this is something that sounds like it’s too much work. Jackie One of the questions I wanted to ask you is about the Customizer. We chatted about it. I see there is a push going to where you could edit your content in the Customizer, right. You’re doing publishing functions versus configuration functions. I’m just curious. Why aren’t they separating those things out and configuring the site or configuring how the site is going to work a completely separate thing than publishing content? I think if you want a WYSIWYG editor for publishing content, that’s one separate thing. I don’t understand why we’re mixing it all together. I’m just wondering, where do you see all that going? Morten What do you think? Why do you think that’s happening? Jackie My reason would be is they want to compete with easy WYSIWYG editors. Morten Sure. Ignore that part. Why do you think they want to put it into the Customizer instead of somewhere else? Jackie Those people that are building out the Customizer want to add all of those components there. I just think that even just splitting it off, I would love to see it when you open up WordPress, you have three buttons, publishing. It’s configuration. It’s administration. If you’re just a content producer, you have one button to click on, you’re in. You don’t load all of this other code that isn’t even really being used while you’re publishing. You don’t need all of that other stuff loaded up in the dashboard. I’m just wondering, I mean if the goal is to compete with Square Space and other platforms that their goal is to make it easier for people to publish content as well, this seems like this is more of an obstacle than it is making things easier. Morten Yeah. I can only speculate here. I’ve observed a lot of these conversations but I can’t speak on behalf of anyone else. I can only speak on behalf of myself of course. One of the reasons why this is being tied to the Customizer is simply because the Customizer is already a place where you are making changes to settings and database. You’ve already solved all the issues around authentication and everything. When you open My Customizer, you’re basically opening a virtual space where you can see your website and make changes to it without anyone else doing. You’re running this instance of WordPress inside your browser essentially, right. It’s all powered by Javascript. It’s super complicated, the way it works. Whenever I see it, you should just go, “Open the Customizer. Then open your developer tools.” Just look at the HTML mark-up that the Customizer produces for that pane. It’s nuts because there are so many things going on. It’s all being manipulated by a Javascript on the fly. It’s a very fancy piece of technology that’s running there. I think that the reason why a front-end editing, which is basically what we’re talking about, the idea that you can go into a post or page and edit content is being injected into the Customizer is simply because that is already a path that’s open. I know that what people want is true front-end editing, meaning you open the front page of your site, you go to a post or page. You can just start editing the content right there on the page. There are solutions in existence already that can do that. I’ve built some very simple demos of how to do it. One of them is making its way into Linkedin Library right now. There are ways of doing this. A lot of the ways of doing this are actually tied to the REST API. The Customizer existed way before the REST API. There is still a reluctance to use the REST API for a lot of things, for various reasons. I believe that much of the reason for trying to push all this editing stuff into the Customizer is simply that it’s an existing modality people are familiar with or the developers are familiar with. They don’t have to build something new. That said, I am firmly in agreement with you that there is a separation of concerns here that needs to be established, which is the Customizer is for customization of the application. That would be the customization of the look and feel of WordPress on the front end. Whereas content creation and editing is a separate thing altogether. That conversation I’ve been part of. Generally, people just choose to make the umbrella that is customization broader and say that customization includes customizing the content itself. To be fair, there are actual very clear crossovers there. For instance, let’s say you’re setting up a new site. You just downloaded WordPress. You set it up. You installed it. You’re going to start customizing your theme. Then you go, “Well, I want to have these four pages.” Then you go into the Customizer. You start building out your menu. Then you realize, “I don’t have the pages.” You have to go to the back in the WordPress and create the pages. Then go back to the Customizer. With 2017 and 4.7, a feature was introduced that allows you to create a new page directly from the Customizer so that you can add it into a menu. Then you can go onto the back end and edit it. The next step of that would obviously be you create the page and then you edit the page. Right now, that editing happens in the Customizer pull out menus. Then it updates on the page. Then that confines it to the Customizer space, which justifies the argument that this is still in the Customizer. Once you move that functionality over into the preview, so you’re not editing the content on the page itself, not in a little panel, the separation of concerns becomes very obvious. At that point, you’re like, “That specific editing functionality should exist on the front end.” Now, you could, in my opinion, do both. You could do it so that you can create content and manage content from the Customizer. That should be an extension of the front end editing capability. You build front end editing first. Then you migrate front end editing into the Customizer to allow people to continue it in the Customizer rather than forcing people to boot up the Customizer to do the front end editing. That is a philosophical conversation that has to do with literal design philosophy, “What is customization? What does customization encompass? Is content editing part of customization? Is content creation part of customization? Where is the line between customization and just actual content editing? Who should have access to it? Who should not have access to it?” There is a bunch of very interesting conversations around that. Right? Jackie Well, that goes back to just having the data so that you understand how people are currently using things. I would really like to know how many people when they are editing a page or using the visual editor versus the text editor. I have no idea. I know the use the text editor because I like writing HTML but I’m assuming all of my clients would never be in there. But I don’t know. Morten To that, there is this very interesting thing that was happening. You know about the Gutenberg Project, right? This project to redesign the content editor and WordPress to make it block-based. What they’re doing is something that looks very similar to what Linkedin Post has whereas you start with an editing page. Any time you hit enter, you get a new element and then there is a little plus sign. You click on a plus sign, you can open a thing that you can define, “This is a paragraph or a heading or quote or image or whatever.” It’s contextual so that you have the different types of content at the level you are working on them instead of in a toolbar at the top. Right? It’s an interesting user experience idea. It has pros and cons. I’m not going to get deep into that. What’s important is part of the conversation that happened around the Gutenberg Editor was this conversation around what happens when you hit the return key on your keyboard as you’re writing content. This was one of those places where I go, “If there was ever a reason if there was ever a proof of why telemetry is necessary, this would be a good example of that proof,” which was a conversation around what happens when you hit the return key. Where the majority of respondents said, “A Return key creates a line break.” Everyone who has worked with a content editor is just like, “Under no circumstances are you ever allowed to make the content editor in WordPress have returned a line break.” That goes against all standard conventions for content editing. That is only the case in a text editor. The text editor is the only place where hitting the return key just returns you to the next line in all content editors. Microsoft Work or Word Perfect or Office 365 or God knows what, everything, a Return key creates a new paragraph. Shift return creates a line break. This is the standard. Then you got a ton of push back. People who said, “No, it’s not.” Then we have to actively prove it, literally go into Word and tape ourselves hitting enter just to see how paragraphs are created when they hit enter here. This is not new. This is not something people are making up. This is an industry standard. Then they were like, “What industry? I don’t think so. People can learn.” It’s like, no, no, no. You cannot design WordPress like this. If you ship a content editor in WordPress where enter is a line break, the ramifications will be so disastrous, right, because people would literally just go, “Oh, WordPress is broken now.” Then they would just abandon the platform. It’s such an arbitrary decision. It just proves that the distance between a lot of the people who contribute to WordPress and the people who actually use WordPress on a day-to-day basis is so long and so vast that there is a complete disconnect about how things work, right. Then when you realize, “Oh my god, these conversations are happening.” Then you wonder, “What other unsaid things are being assumed about how people are using content editors?” The crazy part is the people who were very adamant about return returning a line break had every reason to be. They’re not crazy people. They’re not stupid. They’re not misinformed. They have every intention of doing the best thing possible for the people who use the application. They simply work in an environment that doesn’t have the return key creating a new paragraph because they don’t create content. If they do create content, they write it in Markdown where that isn’t the case. Their experience of how WordPress works is fundamentally different from that of other people and because they have no data to cross-correlate their experience, they just don’t know that it’s … When I say don’t know, people go, “Well, that’s ignorance.” It’s not. The world is too complicated. There are too many different people. There are too many different ways of doing things that a single person can’t have full knowledge of everything. You have to actively seek out other people that don’t fit into your particular bubble and then figure out how they do things and then take their disclosure of behavior as a true statement about the world as they see it rather than some misunderstanding of how things work. Then see how, “Okay, so I know that I do things a certain way. I know other people do things a completely different way. How can we solve the issue for both of them or is one way more prevalent than the other? Should we then make fallbacks for the other one?” That’s where telemetry comes in. This is why telemetry is so important because if we had telemetry, you would very quickly see that the frequency of people hitting return twice to create … It would be astronomically high, right. You would have billions of double clicks on return. Whereas in reality, you don’t because the only place people would do that was if they were trying to make double lines and then it would just collapse on itself and they would stop doing that. Jackie All right. Well, I’ve got one more question I wanted to ask you for sure that I wanted to get into this episode, which is, “What do you think developers who currently work in WordPress need to be focused on in the future? What do they need to be learning now?” I know that’s a broad topic depending on what it is that they do. If you’re a developer, you work with clients, you build websites or you’re creating plug-ins that you want to sell. What do you need to be focused on? What’s on your radar? Morten Okay. Give you the super general answer first because I get this question all the time about … Two variations of it. As a WordPress developer, what should I learn? The other one is, what describes a good WordPress developer? The answer to both of those questions is the same. You need to learn how to build things without WordPress. WordPress is a tool in your toolkit but it cannot be the tool you stand on when you do all your work. WordPress is literally a content management system that uses PHP, HTML, CSS and Javascript to create front-end content. Technically speaking, WordPress works no differently from any other content management system. Your job as a content developer, designer, whatever you are, is to facilitate the communication between your client, WordPress and the person who visits the client’s website. WordPress itself is a box you use as an interface between humans and a database. Your main job is to handle the stuff that happens on the client end. How the data that gets put into the database then gets returned out to the end user, that is where all the work is happening. Now that we have the REST API, you no longer have the bounds of WordPress and what WordPress can do to deal with. Right? The limits that WordPress itself imposed on us as WordPress developers have effectively been removed. What I mean by that is if you wanted to do something crazy in WordPress, let’s say you wanted to mix content from the WordPress database with content from some other source, you’d have to go into your theme or make a plugin that would hook into the theme. Then you would have to make some sort of PHP functionality that would then take the contents like it was returned from WordPress and the WordPress query. Then you would have to intermix it with content from a different source. Then sort out how that mixing should occur and then display in an HTML document that’s shipped from the server to the browser. Once you have the REST API, WordPress is just one of those data sources. With the REST API, you don’t have to think in terms of a WordPress theme or WordPress plugins or anything else. You think, “I have an application that I built,” in whatever language you choose. It can be PHP or ASP.net or RUBY or NODE or God knows what. You build that application. The application sends requests to the WordPress REST API and gets that in return. Then you can take that data and co-mingle it with whatever other data you get from any other source. Smash it together, display it in any way you want. The REST API throws out WordPress essentially. WordPress becomes a tool that you just reference for data. The reason why we don’t want to use it is for the backend because it’s easy. It has a good user interface for people who are managing the content itself. They don’t have to worry about anything. You can configure the REST API to give you the data you want, in the order you want, in the structure you want. Then you just display it however you want. What I’m doing at Linkedin Learning right now is building a new path for people because up until this point, we’ve been building WordPress content that focuses on WordPress development within WordPress proper. How WordPress itself works, how you extend WordPress with plugins and themes, how you build your own themes and plugins to get it to work the way you want to and how you do things further with it. Now, I’m building another path that says, “Let’s treat WordPress as a REST source.” Understand how the REST API works meaning how you get the information you want from WordPress through the REST API and how you capture information and format that data. Once you have the REST API information, you then step up to the next step which is to send authenticator request into WordPress for the REST API meaning you can alter the contents of the database from outside WordPress. You can build a standalone application that lives outside WordPress and then you can say edit the title or edit the content or add a new user or do whatever you want. That data then gets sent through the REST API back into WordPress in a secure way so that it’s still only available to the people with the right authentication level and the right user role. But it’s not happening inside WordPress admin anymore. Once you have those two pieces, you don’t need to work with WordPress at all. WordPress just becomes a source for your JSON data and it can do whatever you want. That opens up this whole new world of development that the WordPress community has basically been shielded from which is now you can build standalone applications that live either on the web or on mobile devices or pretty much anywhere else you want. You’re not confined by how the WordPress loop works or how the WordPress meta data works or anything. You could literally use the data in any way you want and mix it in any way you want and display it in any way you want and make whatever requests you think are rational to the REST API. Once you have a good handle on the REST API, you can just learn whatever you want. That means you need to then migrate away from building WordPress themes and plugins into how do I build phone applications or watch applications or audio only applications or whatever it is, or Internet of things. It just opens the world to all these other opportunities. You very quickly realize that once WordPress is a REST API, the things you can do with it are no different from what you can do with any other REST source. The majority of data sources on the web are REST based. All the things you now learn are applicable to anything else, right. Twitter has a REST API. Amazon has a REST API. Google has a REST API. Everything has a REST API. All that data is now on par with any WordPress site in the world. Where do people want to go? That’s where you want to go. You need to learn the REST API not as an extension of WordPress but as a portal into a standard REST API. Then you need to learn how to use REST data sources to build resilient web applications. Throw the whole WordPress … Think of it as two different things. WordPress is the source so you learn how to work with that thing. Then you learn front-end different around REST API which is something else that is not connected to WordPress. Then WordPress happens to be one of your sources of information. Jackie You’re going to have some courses I’m sure that are going to help people understand how to do that, right? I know you already have one that I watched already there which was you were using postmen to pull data through the REST API and create a little standalone application. It was pretty basic but you could see that you could easily bring this data in into something completely separate outside of WordPress. Morten Yeah. I’m working on a course series now that are three courses so far. They’re three courses in development. You have the original course which is the one you talk about, that’s just called WordPress REST API that just looks at how does the WordPress REST API actually work. How do you extend it? How do you get data from it? How do you do something with that data? Now, you say it’s very basic. This is the funny part. The REST API is basic. That’s the thing. Because once you make a request, you just get a JSON object. The second you understand what a JSON object is, I can give you a simple demo as like, “Here is how you display the title, the featured image, and the content.” Right? Then if you want to display something else, the process is exactly the same. There is no difference. There is nothing complicated here. It’s not like you need to have extra knowledge to understand how to get categories. It’s just in the JSON data. The REST API is very well-built so for every single piece … Every returned item within an object that has further information, so it links to something, the link to that REST route is provided inside the REST response. If you say, “Give me a post.” In the post, there is an attachment, so an image. Then there is a REST URL route to that attachment post so you can go to the attachment post and get that data and return it back in. Once you understand the communication from WordPress to your application, you can do whatever you want. Then you understand how to add in new endpoints. No, sorry. New routes, and also how to augment the data that comes out of existing routes to make its structure the way you want. Then you can get WordPress to basically cough up anything you desire. Then you can extend it into your custom post types and custom fields of whatever you want. The next course that is currently in editing and will come out soon is on authentication where I cover different methods for authenticating requests into the REST API. Both cookie authentication that happens inside the REST API itself, sorry, inside the context of WordPress. You’re basically piggy backing off the authentication methods into WordPress and how to use OAF too and a bunch of other authentication methods to send requests from outside WordPress in. That’s coming out. Then the third part of that course is a larger course that looks at how to build a standalone app that does something that WordPress does not do. Basically, you build the thing on its own that uses the REST API to both send and receive data in an authenticated way to do something totally different that falls outside the scope of anything that you would think of doing with WordPress and simply uses WordPress as a good interface that is secure because you just use WordPress because it’s a secure database. It’s a secure management system. You build something that sits next to WordPress that does a bunch of stuff. From there, what I hope is that people realize once you understand these pieces and you see how it all sticks together, all these other courses in our library and all this other information on the web in general about how to build pretty much anything you want, become applicable to WordPress because we’re no longer using WordPress. We’re just using the data from WordPress. You don’t really need to know anything about how WordPress works to get that to work. Having said all that, what I’m seeing in the community now, which is not surprising and makes total sense is a lot of the people that are working with the REST API are still thinking about WordPress inside the context of WordPress. Sorry, they’re thinking about the REST API inside the context of WordPress. They look at how to build REST-based themes which are really cool because you can build these super snappy themes that load content almost immediately, that just have new ways of interacting with them that are very very fancy, right. You’re still confined by how WordPress works. The consequence of that is you often see themes that require you to have specific permalink structures to work or themes that will try to use the permalink that’s returned from WordPress. That would be the human readable permalink that’s set in permalink settings. Use that to figure out what type of content this is and then provide the correct template based on that, right. That comes from thinking about the REST API as if it’s an extension of how WordPress already works. If instead of doing that, you say, “Forget about all that WordPress stuff. The REST API itself returns to you all this information.” When you request a post, one of the elements, one of the properties inside the object for that post is the permalink generated by WordPress. Another property inside that post is the type of content you got returned. Another property is the link to the REST route, right. You can use that information if you treat the return from the REST API as an actual proper data point. You can create the same functionality without having to do any kind of weird stuff with forcing WordPress to behave a certain way or trying to use rejects to decipher what the URL is or anything like that. It all sits there but you have to think about it as this is the primary source of information. It’s not WordPress. It’s not how the theme works. The primary source of information is the JSON object itself. Then everything changes. Then you’re like, “I need to learn proper Javascript because I can build all new things with it.” Not Javascript in the context of WordPress, just Javascript. I need to learn how to build apps for other applications. I need to maybe extend into other languages that I previously didn’t touch because there are things that you can do in other language that you can’t do with PHP. It just opens the door to all these other things. I can see how if we do this right in our community, we can evolve our community away from just thinking about WordPress as this little box or an island separate from the rest of the world and extend it into just a tool on the web that’s extremely powerful that we use as a data source. Jackie That is awesome. I can’t wait to see the rest of the courses that you’re going to put out because the first one just had me just going, “Wow. Look at this. You can do some really cool things.” I agree, it opens up all the possibilities. It changes the way we publish content completely, right. It’s the way you view published content. You have options now. A client just doesn’t have to have a website. They could have an application that pulls data and shows it in a completely different way from their website. They could still have the website but they could still have lots of other functionality or combine data, like you said, in lots of different ways. That opens up the whole world for everybody. People who are considering themselves WordPress developers might want to be rethinking their approach to that and saying they are a developer that’s using WordPress. They’re using the REST API. They’re using a lot of these other tools to create and distribute content, help people do that. I think that’s the message. Morten If someone is coming into WordPress now, so if you’re listening to this and you’re just starting out and you’re getting into WordPress development, I would strongly encourage you to invest your time in learning how to use REST APIs, not in the context of WordPress. Just focus first on REST APIs in general because this is not new technology. I went to conferences in 2009 that were focused squarely on RESTful APIs. Learning REST APIs in general and how you build things with REST APIs and then coming to WordPress and treating WordPress as the source of REST APIs, you’ll have a huge advantage over old geezers who have been working with WordPress in the confines of PHPs this entire time because if you come at it from the outside in, you’ll see exactly what you can do and how far you can go. You won’t be limited by the way that WordPress used to be. You won’t be limited by how WordPress themes work or how WordPress plugins work. You’re starting out by saying, “I can do anything I want. Now, I want WordPress to give me that data.” That’s my recommendation if you’re starting out. Start with REST APIs and work your way back into WordPress rather than start with WordPress and work your way out. Now, that means you’re going to go into a much more advanced field than what WordPress is because REST APIs are much more complex than WordPress on its own. But that’s what our industry is now. You can’t go into the web design industry or the web development industry treating it as an easy thing to do. It is not. It’s extremely complicated. You need to learn all these things that have nothing to do with what you want. You need to dive into performance. You need to dive into house servers, render images. You need to know all these things that go well beyond development into content strategy and how teams work together and how content is produced and edited and parsed online and how you link into different types of content and then pull that content out. Then change it and then just hand it over to other applications. Think about WordPress just as a tool in your toolkit, just like anything else and you’ll go far with this. Jackie Morten, thank you very much for being on this podcast. This has been just awesome. You had a lot of great information that you shared. If folks want to reach out to you, follow you, talk with you, engage with you, how do they reach you? Morten I’m on Twitter @Mor10 because that’s my name. That’s M-O-R-1-0. Mor10, right? Jackie Yeah. Morten I’m also on Linkedin, of course. You can find me on Linkedin if you just hit me up. Go on. Make a connect request and then type in, “I heard you on Jackie’s podcast.” Then I’ll be like, “Sure. I’ll make a connection with you.” It’s just you get all these requests that are like, “Be part of my professional network,” I’m like, “Who are you? I don’t know who you are.” It’s because I have a really hard time remembering people’s faces and text. So … Jackie Okay. Here is everybody’s chance. If you want to connect with Morten on Linkedin, mention Rethink.fm in there and you’re going to get connected. Morten Exactly. I’ll connect with you. I publish a ton of content on Linkedin Post, which is just the publishing platform on Linkedin. It’s just like Medium except it’s on Linkedin instead. I write content infrequently on my own blog at Mor10.com so some of my more opinionated angry stuff goes there. You should also go to that blog and read the original post because it’s hilarious to read it now. You’ll be like, “What the hell is Expression Web and why don’t have it?” You realize it’s like Shareware and no one can use it. I also write stuff for the … What’s it’s called? The Linkedin Learning blog, which is more general, about learning and the industry. I’m speaking about CSS Grids in the context of WordPress at Word Camp Europe in June. If you happen to be traveling to Europe in June … Jackie Go listen to you talk about that. Morten Well, I discovered today that my talks are the same time as Andrew Nacin’s talk. So there is going to be five people at my talk which means you’ll have ample opportunity to ask questions afterwards. It’ll be on WordPress TV so you can watch it there because that’s one of my big focus areas this year is newer types of the CSS and other technologies. I have a large course on CSS Grid coming out to augment the existing course we have on CSS Grid that was released last year. I’m doing a course on SVG that goes down into hyper detail like, “What does a box look like in SVG code? How can you manipulate this using Javascript and CSS?” Jackie You know I’m going to be all over that because I love SVGs. Morten I’m going into things like element queries which don’t even work yet because I think that’s going to be a big thing. I’m trying to poke at new technologies that are coming around. Right now, CSS Grid isn’t even future technology. It’s truly something that runs in your browser currently right now. When you start thinking in CSS Grid the way that you make layouts on the web and what you can do with layouts changes completely. I want the WordPress community to adopt this right now because there is so many opportunities for doing things in a much more structured way and much simpler way. That’s why I have this talk at Word Camp Europe. There is an article that I’m writing that’s going to come along with it that will be published at an undisclosed location in the near future which is huge. I really want anyone listening here to just throw away everything you know about web layouts and just invest all your time in CSS Grid. I’ll show you how to do it so everyone can actually get it done. Jackie Awesome. Speaking of CSS Grid, Episode 14, which is the episode that aired right before yours did, Rachel Andrew was my guest. We talked just exclusively … Morten Yes. Jackie About CSS Grid. Anybody who is interested in that can go listen to that episode and definitely follow you for more information as it rolls out. Morten Yeah. Just to be absolutely clear, I defer all information about CSS Grid to Rachel Andrew. She is the one that knows how this stuff works. She is the one that’s been pushing this from day one. If you need to know how CSS Grid works, that’s where you go. You go to Grid by Example or you go to the MDN Network and see how all these articles are sprinting about it. They’re fantastic. Then come to me and I’ll show you how to think about WordPress themes in this context and how to think about just general layouts. I won’t cover every single piece. I’ll just tie it together in your practical ways so you can actually use it today. Jackie That’s going to be very helpful because her videos that she has got on Grid by Example show you how it works. Then you need to take that next step to figure out, “Okay. How am I going to get this into WordPress? How can I take advantage of it in WordPress? How can I do that?” I think that will be some great followup with you. Maybe you can come back on Rethink and talk with us about that. Morten Absolutely. Jackie All right. All right, everybody, well, thank you. I know we ran over on this episode but it was just way cool to have you, Morten. I’m just totally … Morten That’s what happens. Jackie In awe. Thank you again for joining me on the show. I hope everybody else has a great week. I’ll see you on the next episode. Morten Bye.

In this episode, I’m chatting with Rachel Andrew – an authority on CSS Grid Layout, the new specification that is redefining how we approach layout for the web. We’ll cover what you need to know to get started with CSS Grid and how this will change the way you think about the web design grid. Meet Rachel Andrew Rachel Andrew is a front and back-end web developer, author and speaker. Her books include the recent Get Ready for CSS Grid Layout and she is a regular contributor to a number of publications both on and offline. Rachel is co-founder of the CMS Perch, a Google Developer Expert and an Invited Expert to the CSS Working Group. She writes about business and technology on her own site at rachelandrew.co.uk. Show Notes Rachel’s website:  https://rachelandrew.co.uk/ Grid by Example:  http://gridbyexample.com/ The CSS Layout Workshop:  https://thecssworkshop.com/ Twitter:  https://twitter.com/rachelandrew Codepen:  http://codepen.io/rachelandrew/ Perch CMS:  https://grabaperch.com/ Transcript Open PDF version of this transcript in new window JackieHey everybody. This is Jackie with another episode of Rethink.fm for you. Today, I have a very special guest, Rachel Andrew, who many of you may have heard is an expert in the new CSS Grid and is also a co-founder of Perch, which is a simple CMS application. Hi Rachel. RachelHi, good to be here. JackieThanks for joining me. If I’ve left anything out and for anybody who doesn’t know you, if you want to introduce yourself that would be awesome. RachelSure. Yes, I’m Rachel. I’ve been a web developer for, well, a very long time. I’ve been running my own business since 2001 as a developer and now, as mentioned, what we mainly do is Perch CMS. That’s our product. I’m an Invited Expert to the W3C CSS Working Group, so my interest in CSS and the open web goes back a long way. I’m just back from Tokyo where I was at the CSS Working Group meeting talking about all things CSS. That’s really what I do. It’s mainly Perch, and then quite a bit of speaking and writing about CSS. JackieStarting off with the CSS Grid, how did you get involved with that and what role have you played? RachelI just spotted it really. In fact, it all started, I was speaking at a conference and I can’t remember what about. There was workshops as part of the conference. Bert Bos, from the W3C, was doing a workshop in French, my French isn’t great, but he was doing a workshop in French and showing some kind of experimental layout stuff. One of those things was a forerunner to CSS Grid. I saw this and thought, this is something we want. Then I realized that actually there was a spec had come through from Microsoft, and there was this early version of the Grid spec was developed by a team at Microsoft. It was implemented into IE10. I got my hands on that and I started building things and saying, “Yeah. This is a really good thing. This is something we want.” Really it just started from there, that I was very keen to promote it and to write about it and to get people talking about it, to make sure that it was something that got implemented into other browsers and didn’t just end up being something that … Some sort of IE experiment. That’s really where it all came from is I was just very keen … I’m very aware of the fact that web developers have got quite a lot of power in terms of what ends up in browsers, if we talk and write about it and make some noise. I just wanted to start doing that, to champion this spec that I thought really was interesting and was going to solve a lot of problems. JackieCSS Grid had its beginnings with Internet Explorer? RachelThat’s right, yeah. JackieWow. That is very … It’s not something I would have thought given the history with Internet Explorer. RachelIt’s surprising. I mean the team now with Edge and really going quite a long way back, there’s been some great stuff coming out of Microsoft and coming out of that team. There are various things that we can only test in IE or Edge. It wasn’t just Grid. For a long time, they were the only people who had any kind of implementation of Grid layout in production browser. Yeah, you maybe surprised. There’s all sorts of stuff that shows up, and they do some great work over there. JackieWow, okay. How does CSS Flexbox relate to this? RachelRight. Flexbox is designed for a slightly different thing. The main difference is that Flexbox is for one dimensional layout. That means that you’re laying things out as a row or as a column, but not both at the same time although you can wrap flex items. If you’re working in rows, each row essentially becomes its own flex container, so space distribution. If you try and line things up, it’s only going to happen across that row. It’s not going to happen in columns as well, which is why if you’ve got an odd number of items on a row, they’re just going to stretch out right across the row. They’re not going to line up. Grid was designed to be two dimensional, which means that you can line things up in rows and columns and also do things like have negative space in your design, because you don’t have to fill every cell on the grid. Whereas Flexbox is just going to fill up all the area. JackieFor developers and designers that haven’t used either yet, and most likely many of them probably have not used CSS Grid yet but may have started experimenting with Flexbox, what design elements are best solved by each? For somebody who is thinking, okay, where would I want to use Flexbox in a design? Where would I want to take a look at using CSS Grid? RachelRight. With Flexbox, if you’ve got some things that you just want to, say, space out, navigation is a good example of that. You’ve got a navigation list and you just want there to be equal space between all of the items. You want to let the content control how big it is, and you want some nice bits of space between the items that’s all even, so it all looks nice and tidy. That’s a good Flexbox use case. With Grid, what you’re doing is you’re defining a grid and then you’re putting the items into that grid. In the case of your navigation, if you had a very long navigation point, what it would get put inside maybe a smaller grid track which might mean it wraps onto two lines, for example. Whereas Flexbox would let that one take as much space as it needed, and then just manage the space distribution. It’s the other way around. Grid works from the outside in. You define a grid, you put stuff into the grid. Whereas Flexbox, you’re working from the content out. You’re saying, “I’ve got some items here. I just want them to manage their space in between each other and stretch out,” or whatever. JackieOkay. You have a website that you created called GridbyExample.com. RachelYeah. JackieYou have some great videos on there, so if anybody’s interested in learning more about CSS Grid and how to implement it, those videos, I found them very helpful. I watched them last month, I think, that was the first time that I’ve actually started to look at it. RachelYeah. I think actually seeing this stuff, and I’ve also got a whole load of small worked examples that link to CodePens. You can go and fork those and have a play around. It’s a really big spec, but the actual, individual elements of it are quite simple. It’s really just starting with the small parts of the spec and playing around with it and seeing how it works, and then seeing what other things you need to know to solve the problems you’ve got. Yeah, working with small examples rather than trying to learn the whole thing at once is definitely the way to go. JackieHow does this fit in with frameworks like Bootstrap and Foundation and transitioning from using those for your grid to using something like CSS Grid as browser support fills all out? RachelI think the first thing really is that there’s a real mindset change between using a framework or, in fact, even using your own framework that you’ve developed, that maybe a float based kind of framework, and then using Grid. Everything that comes before Grid, you have to target the item itself. You have to say, “Right. This block is going to take up five columns,” in this grid that you’ve imagined. You don’t actually have a grid with previous layout methods. You’re faking that by adding rules to items in the design to say, “The grid is this big. A grid column is this big and you take up five of them. I’m going to give you a width that is the amount that five columns would be.” Whereas with Grid, you define a grid and you don’t have to define anything on the item at all or you might just say how many it’s going to span. You don’t put any widths on the item, because that’s managed by the grid track itself and the sizing applied to the grid. I think there’s quite a shift in thinking, to start with, to get away from thinking, I need to be targeting the item in my layout and saying, “How big are you?” When actually with Grid, you’re saying, “Well here’s a space. The item’s going to go in it and it’s going to be as big as that space.” JackieThat seems like it would make it much easier to work with responsive designs and getting things to adjust automatically without having to specifically go in and change widths. RachelYeah, exactly. Because you can do it all on the container, so if something … If a track is a certain size at your wider layout, well it can be much smaller at your narrow one without you having to go and fiddle around with the item itself. It certainly makes it a lot easier to redefine at different break points and to redefine parts of your design based on different break points. JackieHow do you think it might help with UX for design components? Is there any difference there? RachelI think, I mean it certainly works very nicely with a pattern based and a component based approach, because you can look at each of these things, each thing in your design might be a small grid essentially. You’ve got different design elements that fit nicely into a little grid. I mean we’ve been using Fractal as a pattern library for our own stuff. I mean that’s working with Flexbox at the moment mainly for the Perch UI. We find that these modern techniques are much easier to work in this component based way, because you don’t have to worry about the whole thing. You’re not having to try and manage this grid structure which doesn’t even exist, which is what you’re doing when you’re using float based layouts or whatever. I think there’s lots of ways in which this can work quite nicely with that kind of component based, pattern library based approach which is becoming very popular. JackieOne of the things I heard you mention on a recent podcast you were on, WP-Tonic, was just talking about how designers and developers can experiment with designs on their own sites specifically, and how things have changed over time with a lot of social media outlets and ways to publish content where we may not have an active playground that we use all the time for experimenting with design. I’m asking this because when I first watched a video about CSS Grid last year on a course I saw on lynda.com, I was thinking, okay well there’s really no browser support for this yet. It’s not something that I need to have on my radar right at the moment, because it’s not going to help me solve any of the current projects that I was working on. I really liked what you had talked about is having a playground to work that may not work in all scenarios, in that it’s perfectly fine to build something out as a playground test site and start experimenting with new ways to design things. It seems like CSS Grid is a perfect opportunity to break the mold and try new things and experiment with layouts. I think it’s really good to encourage people to do that. RachelYeah, absolutely. I think, at some point, the web got very grown up and professional and we’re just doing our jobs. Perhaps we lost a little bit of the playfulness that we certainly had in the early days because it was all new. There wasn’t really a right or a wrong way to do anything. We were just trying to do things and try and see what we could actually achieve with very, very limited technology. Now, we’ve got so many opportunities just within CSS. Even if you don’t even think about JavaScript and all the other things that you could be doing, just within CSS, we’ve got so much opportunity to do interesting things. It’s such a shame if everyone just replicates Bootstrap, you know? I think on your own site, on your own project, you get the chance to do that. I’ve been encouraging people to look at things like look at magazine design. Say, “Well can I reproduce this?” It’s not necessarily ideal for the web. It’s not necessarily something you’re going to put onto the next client project. It teaches you how to look at things in a different way and say, “Well can we actually build this with our new technology? Would we want to? How do we make it into a web design that has a bit of the feel of this magazine layout?” That’s all quite interesting. JackieI think that’s very helpful because it seems like most of the website designs are pretty basic in how we lay them out now. I mean typically you have a logo, you have a menu at the top. You have a hero image, you have some content blocks and a footer and that’s pretty much the layout that you’re going to go with. It doesn’t leave a lot of room for creativity other than maybe doing some animations and, like you said, things in JavaScript that can change your layout and how it works. I don’t think it goes far enough to really open it up and to start experimenting with new ways to do things on design. Some may work, some may not but it is really nice to encourage people to try new things and to have a place to do that. RachelYeah, because we have the opportunity to do so. There’s so much stuff that we could be using. It doesn’t need to be in huge waves, you know? You can add little bits of delight and interest of designs using, say, something like CSS Shapes, for example. Wrapping text around things that aren’t square. It’s something we’ve wanted for a very long time and now we’ve got it, and very few people are using it. Part of that is because it’s not supported in all browsers. You can use this stuff for little touches and let it fall back for the browsers. That’s okay. Yeah, it’s just playing with this stuff and just seeing what there is there. JackieThat’s a really good point about just embracing progressive enhancements and getting out of the mindset that it has to look the same in every browser. RachelYeah. JackieI think many of us struggle with okay, I need to find the common denominator that will work in all browsers for a design, and don’t really want to add any other elements in that may not work in some browsers. Typically many of us have struggled with supporting Internet Explorer layouts and even in Edge, with some CSS animations and things like that. I think thinking about it in a different way that yeah, it doesn’t have to look the same on every browser as long as it’s usable and it meets the needs of the person visiting the site. RachelYeah. Look at the actual browsers that you’re having to support and how many people are using them. Base this stuff around your own requirements and the sort of people that are coming to your site. Don’t just assume oh well, this isn’t going to work very well in IE9 or IE10. How many people are actually using that browser on your site? Could you be creating a far better experience for the 90% of people, and just allowing it to be slightly less designed for a smaller number. Every site’s going to be different. Certainly on your own stuff, you really should be able to play and not worry too much if the design looks pretty plain perhaps in older browsers. You need to have these places because if you don’t experiment, you don’t learn how to use these things. You don’t learn where the edges are. JackieThe current browser support for CSS Grid right now … And I think it was just February or March where the current versions of Chrome and Firefox and Safari supports CSS Grid? RachelThat’s right. It was March, yeah. All of those browsers got CSS Grid pretty much at the same time, within weeks of each other. That’s never really happened before. This shows how much browser vendors care about interoperability these days. They want us to have all of the stuff in all of the browsers and be able to use it. Obviously each browser has a business behind it. They have things which they believe are more important than another thing that fits into the where they’re going as a business. Generally, they do not want to leave us with something that’s broken in one browser over another particularly. They’d generally rather not implement something at all than give you something broken, because it’s easier to check if something isn’t supported than look for buggy support. Generally, there’s a lot of effort to make browsers interoperable and to make so if you can do something in one browser, it’s going to work in the same way in another. That’s something people do care about. JackieHow do standards evolve and then get adopted by browser manufacturers? How does that work? RachelIt happens in all different kinds of ways. Sometimes things come from a browser vendor themselves. For instance, Grid, it really started life in Microsoft. The first edits to that spec were from Microsoft. There’s still one spec editor who is from Microsoft, and then there’s someone who is an Invited Expert and then someone from Google and editors of that spec. A lot of stuff will come from a browser vendor themselves. Other people too, so the Shapes spec came from Adobe. Also then some stuff is just developed by the CSS Working Group because it solves problems, you know? We can see that developers are trying to do a certain thing, and so there needs to be a CSS spec that does that thing. It’ll actually just come out of the CSS Working Group itself. A lot of stuff actually starts life with either a browser vendor or there’s an awful lot of people using CSS who are essentially in the print world. An awful lot of books these days are printed using CSS. There are very specific user agents that basically create print and PDF documents out of CSS and HTML. Things come from those areas as well but yeah. Then it all ends up in the CSS Working Group and is worked on to try and make something that doesn’t just solve the specific problem that maybe the person who first thought up this spec was trying to solve, but solves some general problems. You can see that evolution, if you look at the Grid spec as went into IE and what we’ve got now, you can see this evolution and how the set of problems it was trying to solve has been extended and improved and considering lots of different areas before it’s been shipped. JackieOkay. One question I did want to ask you was adaptive versus responsive design and the ability to reorder content now seems to be much easier. Even in Flexbox as well, you have that ability to reorder content. How can that help somebody create some really interesting adaptive designs that change based on the device that it’s being viewed on? RachelRight. This ability to reorder stuff, we have that in Flexbox. We have it a lot in Grid. You can quite literally move anything around and put it into any area of the grid you want. You still really do need to take a great deal of care, because it’s very, very easy if you start reordering content to make something inaccessible particularly for, say, someone who is keyboard navigating. If you’re tabbing around, if you’ve moved an item that is in the DOM, at the top of the DOM and you move that down to the bottom, then what happens to their order as they try and move around the document? Both specs say that you shouldn’t reorder the visual display over the source. You need to take great care if you start reordering at different break points, because you can quite easily make it very difficult to use the site which is not what you want to do. JackieThat would be containers that maybe have elements in there that require some interactivity? RachelYes, yeah. JackieWith a user, right? If you just had a layout that just had images or just blog content to read, would that also affect your accessibility if you reordered that? If they were tabbing through? RachelNot necessarily. I think what you’ve got to do is take each of these cases as an individual thing and test it and say, “Well how does this behave?” I think there’s so many conversations to be had around that. Essentially browsers will follow the source order. It’s really, really important that you keep your source in a logical, sensible order rather than thinking, oh now I can use Grid just to move things around. Keep your source logical because that’s going to be the order that the browser follows for anyone who is tabbing around or is using if that’s being read out, for instance. Then that’s going to follow the source and not the visual display. You just need to be careful not to disconnect the two completely if it matters what order things are in. JackieOkay. What browser do you use for your development? What’s your favorite browser? RachelI use Firefox a lot for Grid work, because they’ve got a Grid inspector and no other browser has. I often use Firefox. I use Chrome a fair bit, but I’m fairly agnostic to be honest. I tend to switch around which one I’m using. As I say, I’m using Firefox a lot just because they ship the Grid inspector and it’s really good. If you’re playing around with Grid, just the dev tools in Firefox has, if you select a grid container, so the thing you’ve said display grid on, and you open your dev tools, there’s a little icon that looks like a little waffle. If you click the little waffle, you can see all your grid column tracks so you can actually see where the grid is on your page and on your element, which is really useful. That’s definitely … If you’re using Grid, I would certainly be using Firefox just for the case of having those dev tools. JackieAny tools you can recommend for cross-browser testing when you’re developing? RachelI think really it’s a case of getting your hands on as many browsers as you can. I mean that’s … So if you’re on a Mac, I’m sure a lot of people are on Macs, the biggest thing is not having access then to Internet Explorer and Edge. You can get those in VMs from the Microsoft site. You can download virtual machines that have all different versions of IE and things installed. If you don’t want to install a bunch of VMs, then BrowserStack is a good place. That’s like an online site you can have a subscription there and log in and test things in different browsers. For mobile, make sure you are actually testing on real devices, some real devices, not just emulators. How does this feel as much as what it looks like. I always say go out and get the cheapest, nastiest, smallest Android phone you can find, really low powered, and make sure you’re also testing in that as well as the nice iPhone you’ve got on your desk or whatever. An inexpensive, the cheap phone that a lot of people have is a world away from an iPhone or the latest Android device. JackieVery good advice. The next topic I wanted to ask you about was Perch. RachelMm-hmm (affirmative). JackieI don’t know very much about it and I’m curious. I heard you discuss it on the WP-Tonic podcast. RachelMm-hmm (affirmative). JackieI know you had a great conversation about open-source versus non and sustainable business models. I’m just wondering if you can just give us some background on Perch and who is an ideal customer for Perch and how you operate it. RachelYeah. Perch is the product we launched. I mean we launched Perch about eight years ago as a small CMS so really, at the time, as a kind of content editor. The initial idea behind Perch was that you should be able to have a site that you’ve built in HTML and CSS, you didn’t have a CMS, and then, of course, one day you’re meeting with a client. The client says, “Oh you know what? I’d really just like to be able to edit the text on the homepage there.” At the time, the only option you’d really have would be to rebuild your site into WordPress or something that would essentially mean you had to rebuild the whole thing, make a theme, take it away from being the site that was really just HTML pages. The original version of Perch was like a drop-in CMS, the idea being you could just install Perch, stick a Perch tag on that area on the homepage where you wanted to edit … Where the clients wanted to edit that little bit of content and that would be it. That was all you needed to do. You wouldn’t have to change the whole site into a theme or really take over the whole thing with a CMS. People still use Perch very much in that way, you know? People build sites, static sites, and then just make bits of them editable. There’s an awful lot more that we can do now, and we’ve got a second product called Perch Runway which is for your larger content based sites. We care a lot about the idea that all of your templates should be completely controllable by you. Essentially if you’re coming from a WordPress world, we’re all custom fields. There’s no concept of having a page that has to have a heading and a big area of text and so on. We’re essentially all custom fields, so you define a template with exactly the fields you want. They load that up and that appears in the admin and that’s what the client fills in with whatever kind of fields you want. That’s really the difference is that we’re very much based around the structured content idea. JackieHow does open-source versus non-open-source … What’s your view on that? I know WordPress is open-source, so Perch is not, right? You have to pay for a license for each install. RachelMm-hmm (affirmative). JackieHow does that work now for the clients that want to use … What’s their advantage to using Perch, say, versus WordPress? RachelThey have support included the license. They have support via us, the people who actually build it. If you have a Perch license, you can come and we will help you with your site which we do all day in the forum. You’ll see both Drew and myself answering people’s questions and help them out, so support’s a big thing. Having a very opinionated piece of software is useful to people. One of the things with open-source projects is they can become quite … Stretch off in various directions all over the place, because lots of people are contributing to them which can be great. Also it can mean that things move in directions you weren’t as keen on. People are very much, when they use Perch, buy into the way that we see the world, which is very much to do with the open web platform and standards and structured content and making the product very fast, you know? We will make decisions based on how fast that content’s going to render over developer convenience, for example. We make those decisions all the time. They are things we care about. I think people buy into that. The support’s a big thing. The support for end clients knowing that there is a company behind this, and a company that’s been around for eight years and is making money doing this. It’s not just going to disappear. That’s very important to a lot of end customers. JackieI saw you can download Perch and try it out locally and experiment with it, which is a great way to see if it would suit a need for either you or for a client that you might have where maybe WordPress wouldn’t be the best option for that. RachelYeah. I mean that’s it. We have lots of people who use Perch alongside WordPress, who use Perch alongside Drupal. Most people aren’t using a single solution because all projects are different. Unless you’ve really hung your hat on being a WordPress shop or we have people who are essentially Perch shops, they have hundreds of licenses because they just build Perch sites, but most people aren’t doing that. Most people are getting a project and saying, “Well what’s the best tool for this?” It may well be that you get some projects and you think, well actually Perch would be a great fit for that. That doesn’t mean that the next project’s going to be, oh well actually WordPress is good for this one. We have a lot of conversations with customers based on the fact they know these other solutions too, and they’ll say, “Oh. It seems like this feature would be really useful.” We can have discussions about why maybe we don’t do something that they like from something else. That’s all really interesting too but yeah. Most people are using multiple solutions based on different kinds of projects that they work on. JackieI know I’m going to download it and play with it in my local development environment, because I’m very curious to see what it is and how it works. RachelYeah. It’s going to be interesting to hear what you think. As I say, we have a certain way of looking at the world based on where we’ve come from and the sort of things that we think are important. Obviously that matches with some people and not with others, and that’s cool, you know? JackieI definitely think the speed component is something everybody should be aware of and mindful of when … A lot of themes in WordPress have an awful lot of bloat and create a lot of obstacles for getting the site to render quickly. RachelYeah. JackieThat is something to be mindful of. RachelYeah. I mean that’s something that we’ve … Because you have full control over your front end, we don’t do anything to the front end. We make sure that actually rendering the content into your site is super fast, but then you can do any optimizations you want on your front end code because we’re not going to touch it. That’s very much how we work, because we don’t have this idea of themes. It means people can really optimize their front end as much as they like. We always try and come up with ways. We were supporting things like responsive images very early and try and come up with ways that people can make their sites faster, because we care about it ourselves. JackieVery good. We’re almost out of time. I just wanted to circle back to CSS Grid and just talk about given the current browser support, which is just the very latest versions on there, how can a designer, a developer, right now start to incorporate CSS Grid into projects? How can they provide backwards compatibility? RachelOkay. Actually written into the spec is how Grid interacts with other layout methods. It interacts with them very well. What you can actually do is you can, say, have something which is laid out with floats, inline block, or just layout table and then also make it a grid. In an awful lot of cases, as soon as the thing becomes a grid item, all those other behaviors just stop applying. You can take advantage of the cascade and how CSS works to basically provide something for legacy browsers and then, immediately afterwards, provide something for things that support Grid, provide you the layout you really want, and that’ll just work. The things that don’t work, you need to look at feature queries which essentially is like Modernizr, if you’ve ever used it. It’s like using a media query except instead testing for the size of a screen, what you’re doing is you’re testing for support of a property. You can basically say @support, display grid and then inside that query, write your Grid code. Browsers that don’t know about Grid, they’ll ignore it and anything that goes along with it. Browsers that do will use it. CSS is bringing us ways to do this because it’s always going to happen that there are going to be things not implemented in browsers. Yeah, on my site, I’ve got a cheat sheet of all those ways of overwriting older methods and links to stuff about feature queries and so on. JackieI guess the first order of business for most of us is going to be to start experimenting with this on a playground site or our own personal site, and then working with these cascading @supports and seeing how these things render. That sounds like that’s a great way then to go and start incorporating some elements of that into client projects. RachelYeah. JackieIt doesn’t have to be an entire CSS Grid project. You can incorporate some of the CSS Grid pieces into a project that you’re working on. RachelI think what’s going to happen is you’re going to start, as you learn the spec and you learn how to use it, you’re going to start seeing stuff in designs you’re trying to implement and say, “That is a perfect case for CSS Grid.” At that point, you can say, “Well can we use this to get the ideal layout, and then what can we do as a fallback?” I think increasingly people are going to start seeing things that can only really be done if you use Grid and doing it, and then working out what the rest of the browsers see. What’s a perfectly acceptable layout, and then use Grid as the enhancement to get the real top of the line design. I think as people get used to having Grid, we’re going to see more designers that take advantage of things that you can only do if you use Grid. We’ll start seeing real use cases for that. JackieThen that wraps it up for us here. Thank you very much, Rachel, for joining me. If folks want to get a hold of you, visit your example website or contact you to follow up, how can they reach you? RachelActually I’ve got gridbyexample.com is all my CSS Grid stuff and my personal site, which links to everything, is rachelandrew.co.uk. I am @rachelandrew on Twitter and pretty much everywhere else. You’ll find me, if you follow me on Twitter, you’ll see all the stuff that I do. JackieThank you very much again for joining me. I’ll see y’all next time.

In this episode, I’m chatting with Gary Jones. I’m honored to have Gary on the show. He is your go-to person when you want things done right. He is a huge asset to the Genesis community and shares his knowledge in so many ways. If you spend any time on Github – you are sure to see his name as a contributor on so many open source projects. Let’s get started. Meet Gary Jones Gary Jones is a UK-based WordPress Engineer, code consultant and father of extremely premature twins. Driven by a passion for excellence, he creates elegant WordPress plugins and theme solutions for clients, and provides services, including code audits, for other web designers and developers. He’s worked on projects for SiteGround, Yoast, StudioPress, Web Savvy Marketing, Daniels Trading, Rolls-Royce and many smaller design and development agencies and individuals. Gary is a key contributor to the GENESIS FRAMEWORK and has contributed to all except one major branch of WordPress Core since 3.3. He has contributed to many open source projects in the COMMUNITY, and is a co-host on the UK GENESIS PODCAST. A former teacher in schools and prisons, Gary’s goal is to educate WordPress professionals on how they can improve their code. His motto is knowledge is power. Show Notes Gary’s site: Gamajo Tech Twitter: @garyj Podcast: UK Genesis Github: GaryJones Genesis Slack Channel: Request Invite A Few Valuable Links & Resources : WordPress Coding Standards WordPress Coding Standards for PHP_CodeSniffer PHPStorm Atom StudioPress and Genesis Framework Transcript Open PDF version of this transcript in new window Jackie Hey, everybody. It’s Jackie D’Elia with another episode of Rethink.fm for you and today I have Gary Jones who is a UK resident and a Genesis expert in our community. Hey, Gary. Gary Hi. How are you doing, Jackie? Jackie Very good. Thanks for joining me on the first episode for season 2, which is kind of awesome to have you here. Gary Thank you very much. Jackie For anyone who doesn’t know who you are in the Genesis community, would you tell us a little bit about yourself? Gary Absolutely. My name’s Gary Jones. I’m based in Basingstoke in the UK. I run a small virtual agency creating technical WordPress solutions for clients, including integrations with their business critical systems. I’m a contributor to the Genesis Framework and WordPress core and many plugins and open source projects. I’m cohost of the UK Genesis podcast, although we haven’t done many recordings recently, general translation editor for the British English locale in WordPress and organizer of WorkCamp London, father of five-year-old twins, and my background is teaching in schools and prisons. Jackie Wow. That was awesome. You just went right through the whole thing. That is great. Gary It helps being prepared ahead of time and actually writing my introduction down this time. Jackie Yeah. If you’re working in Genesis and you’re in GitHub at all, it’s hard not to see your name all around as a contributor for, like you said, numerous plugins, many open source projects. I see your name as a contributor on a lot of things. Gary Yeah. A lot of the things that I contribute to are effectually under other people’s names. It’s under their repo or their GitHub name. One of the things I like doing is helping others. Irrespective of the context that might be helping clients or, in this case, helping other developers. If I can contribute something to their plugin then I’ll go ahead and fork it and make the change and send it back to them. If it makes their plugin better and people recognize that there’s a slightly better plugin or slightly better package that has got their name on it, that’s fine by me. I’m actually fine with that. Jackie I have to say, whenever I see a plugin if I need something in the GitHub repo and I see your name associated with it, I usually think it’s okay to use because I kind of … Gary Probably, yes. Jackie I know you’re very thorough and you’ve got a really good background on one of the things we were chatting about before the shows is that you do some code audits and I’ve known that you’ve done that in the past for other developers, for businesses, for individuals. That would be my first question I think I want to ask you is how did you kind of formalize an approach to do code audits? How did you evolve into that? Gary I enjoy reading code. It’s as simple as that. My background is teaching, in education and helping others, so if I could combine sitting there reading code and analyzing and look to see where it can be done better with somebody whose efforts, maybe it’s for a free plugin, maybe it’s for some client work, maybe it’s for a premium product that they’re trying to sell. If I could look through the code, make suggestions and educate that will use it as a tool to educate them so they become a better developer with the benefit that they have a slightly better product at the end of it, then I enjoy doing that. I enjoy sitting down, sharing the screens for two hours and going through line by line, say “Have you thought about doing this? Have you thought about adding support for internationalization or making it more accessible or adding support for right to left scripts?” Or just reorganizing the code in such a way that it will reduce bugs and has a conflict driven approach that makes future edits even easier to do. Kind of easier maintenance. There’s lots of reasons for doing the code audit and it’s just something that I found that I enjoyed. Word of mouth was that people would send other people to me to do that. Then the formalization process was very simple. It was, kind of, an hourly rate to a fixed price for a couple of hours of going through the product line by line and then at the end of it the person who we’re doing the code audit for can take all those notes and implement whichever they agreed with in their own time. It’s not necessarily me just fixing up their code and them learning nothing. It really is effectively teaching them how to fish so that they can then know for next time, so when they do their second theme or an extension to their plugin, they’ve got that knowledge and everybody, WordPress users, WordPress ecosystem in general, is better off for it because they’re plugin is now more accessible. Every plugin they do is more accessible, for instance. It was one of my ways to contribute back and just brought a little bit of side income in as well. Jackie Awesome. How did you stay up to date with coding standards so that you know how to advise people about ways to do things and maybe refactoring and new ways to do things? How do you stay on top of all of that? Gary In terms of the formal code standards, there is the WordPress Coding Standards. There’s a document on the make.wordpress.org site that covers the actual coding standards. There’s also a set of sniffs, they call them, for PHP CodeSniffer and I’m involved in that as well. That’s kind of the formal side of things about whether you should have commas after every line in an array and whether associative arrays should be multi line or whether certain functions should be escaped or not escaped or recognized and highlighted and so on. There’s all of that sort of side of things. Beyond that, it’s just my own experience and just conveying that. If you’ve got a function call that accepts an array, instead of just dropping that array right into that function call. It just separates out the data from the logic, so that you perhaps, halfway through your development you can do something else with that array. You can extract it out into somewhere completely separate so that your function or your logic now will accept any array. So that when you come down to doing some unit testing, you can say, “well let’s throw in a duff array that’s got completely random data. Does our logic still work? Does it handle the edge cases and the errors and the exceptions and so on?” It’s just my experience in getting that across and saying, “if you do this, then this is the benefit you’ll get.” To your end users, they won’t notice any difference, but you’ll get some benefit from unit testing or by your editor being able to and therefore autosuggest how to auto complete some of the code. It’s just experience that I’ve learned over the last 18 years or so that’s conveying to them to make them better developers. Jackie Okay, what code editor are you using currently? Gary I use PHP Storm. For a long time I was … What did I start off with? I think it was just basic Notepad to start with. Then I moved on to Sublime Text, Sublime Text 2 and then number 3. I love that. I like the fact that you could add in individual plugins or extensions to the Sublime Text system and you could have your code linter in there. You could auto-arrange, auto-align different things. It’s fantastic. I still use Sublime Text for either very basic code editing or more likely for writing markdown documentation and so on. [inaudible 00:08:00] PHP Storm. I tried it once and it was too much. I couldn’t get to grips with it. There was too much going on. Didn’t like it. There’s a free course by a gentleman called Jeffrey Way that’s under the [inaudible 00:08:20] Podcast system things that he does. There’s a free course which I recommend completely and totally for anybody who is even considering moving to PHP Storm is to get PHP Storm. You can get the free evaluation edition to run through this course. Pretty much the first session is: Turn this off, that off, and the other off and really simplify down to just an editor. The actual power of PHP Storm … Yes, you can integrate your version control and command line and all your other tools. Actually some of it comes from the auto-complete which you still get even if everything else is turned off. Running through that, when I found out the second time, then I’ve stuck with it ever since. I know that I don’t use PHP Storm to its full potential. Every now and then I say, “well, is there a new feature?” Kind of re-map some of the key commands to Sublime Text so that I haven’t got to learn two different sets of keyboard shortcuts. Between the two of them, everything gets written. PHP Storm is good in so much as there’s an extension for it: EA Coding, I think it’s called. That will highlight potentially bad practices with the PHP. Even if I’ve just written the same code it will highlight, “oh, did you mean to do this? Did you mean to do that? Have you thought about this?” It will highlight potential errors that Sublime Text wouldn’t, and that I wouldn’t have necessarily caught manually. It actually helps me to write code in several different ways. Jackie Have you tried Atom? Gary No, I’ve not. I’ve seen it around a lot. I’ve seen lots of praise for it. I might have loaded the website, but not gotten any further than that with it. Jackie I’ve tried Atom as well as PHP Storm and I did go through the Laracast free courses, the videos on that and I found them very helpful in configuring and setting up Atom. I mean PHP Storm. I’ve also tried Atom because I’ve seen that used a lot now on Lynda courses and LinkedIn Learning courses that they’re teaching. A lot of the developers that are instructors on there are using Atom. Now Atom’s free, so that’s a great choice for somebody who’s looking for a free code editor and it does have the sniffer packages that you can install. I use that now in mine so that when I am writing code or when I save a specific PHP file, it automatically formats it and lets me know if there’s any coding errors in the file. Very similar to how PHP Storm works. That is another option for folks. PHP Storm does have a yearly cost to it, and Atom is another choice. I used Sublime Text as well earlier on and I found Sublime and Atom to be very similar. I think Atom is easier to install packages and manage that process than Sublime Text was. That’s another option for folks if you wanted to do that. For some developers that are just starting off or are not what they should be doing coding in the WordPress space, you said that there’s WordPress coding standards. I know there’s a PHP sniffer that you can install that will monitor whether or not you’re using the WordPress coding standards. Can you talk about that, and your involvement in it, and how would somebody go about implementing that? Gary Yep, so there’s a command line tool called PHP code sniffer. It’s by a company called Squizz Labs, so it’s an unusual name, but that makes it very easy to find. They support various different coding standards, the coding standards, PSR2, obviously WordPress, and so on. That’s just the tool which comes with a few sniffs and a few checks. The WordPress coding standards is a separate repository that is in PHP so as a tool for checking your PHP, it’s easy to see and understand how this tool is built. It will look through your files and it will break all the PHP code down into separate tokens. Could be a token of an open bracket followed by the word ‘echo’ would be a separate token. It’s all broken down. Then it looks at combinations. Is there a bracket followed by a croat? Perhaps you’ve got an array or something like that. Also, hang on a minute, the WordPress coding standard says you need to space in between there. For a lot of these individuals checks, all of these different sniffs, for WordPress coding standards. They’re trying to increase more is actually kind of automatic fixes as well. You could run this command line tool over your code and it’ll say, “okay, you’ve got a thousand errors.” It could then say, “well actually, I could fix 800 of these automatically.” So you run a slightly different tool and there you go, it’s fixed most of them. Give it a once over. Commit it to then go ahead and check out these 200 other errors. As well as individual white space errors or whether you’re using short syntax or long syntax for arrays, it will also check things for WordPress coding standards. It’ll check things like: are you escaping your output? It will say, “Well, you’ve got echo something.” It’ll say, “well hang on a minute, that’s not escaped. I was expecting escape HTML in that context.” Or you’re doing in an attribute you’re just doing ‘get permalink’. Well it will say, “hang on a minute, I’m expecting that to be escaped.” So there’s lots of things there that will be able to help with the escaping and the sanitization and potentially validation. It’s good coding practice. The WordPress coding standards are split into WordPress core, WordPress VIP which counts as being on the VIP with automatic, and WordPress Extra. The combination of core and extra means you not only get whatever is documented in that make.wordpress.org handbook, but the extra stuff is also things that we think you should be doing as best practices. You can configure all of these to say, “well I want these checks, but I don’t that checked.” Or “Want it to be a bit stricter or a bit more lenient.” So you can configure how these checks are done against your existing code base or how you want it for your new plugin or your new thing that you’re doing. It’s just very flexible, but at the same time there’s a de facto, default behavior that pretty much all developers in the WordPress space should be following. As I said, you can add in your own exceptions if there’s good reasons for that, but if you’ve got no existing code practices, coding standards for your company or at the company level. This is a very good way to make sure that the code you’re writing can be readable and understandable and fixable without any obvious noticeable difference in code style between you and somebody else. Jackie I think what you were talking about is maybe the PHP code beautifier and fixer? When I configured Atom, and I think it’s also in PHP Storm too. It can automatically do a lot of these fixes for you. I did notice in Genesis sometimes with the escaping there’s some Genesis functions that you might get a warning on and you might have to do some exceptions in your configuration file to say, “hey, it’s okay. This has been escaped, but you just don’t think it has.” You had some notes in a repo somewhere, I could have sworn I read that about. You had that same challenge. I was getting the same error and I was like, “Okay I don’t understand this part. How am I going to fix this?” And then I saw that actually there was a way to put some exceptions in there. Say, “no, this is okay. You can ignore that one.” Gary Yeah, the particular function is Genesis_attr for Genesis attributes. If you’re doing a Genesis theme chances are you want that as an exception in your config file. Jackie If you want to choose a base coding standard for WordPress, just the WordPress would be the one to choose if you were going to pick, right? You’d want to go with just WordPress? Gary For most things, because you’d have exceptions like that. You’re config file would be in your plugin or in your theme. I can basically say, yeah, choose WordPress probably exclude the VIP. That would give you the WordPress Core, and the WordPress Extra and the WordPress docs, it’s actually a separate rule set, but it all kind of falls under the same thing. Jackie So, you could actually configure like, three rule sets and then just exclude the VIP. Then you could also do some exceptions of your own in that file? I think it’s like a … Is it an XML file if I’m just …? Gary Yeah, PHPCS.xml. , and then probably if it’s a plugin or theme that you’re distributing you’d put .dist on the end. The advantage of that one is that, that is the conflict file that you distribute, but if somebody wants to override it locally they can have PHPCS.XML which you would put in your ‘get ignored’ so that anything you’ve got isn’t distributed as well. That would then just override the conflict file that you distributed, so you’d actually get the best of both worlds, distributed and local configuration. Jackie So, that’s a great starter if you are not using any coding standards, and you’re just writing PHP code in WordPress. It will work with all of these code editors you can just find the package that goes with the code editor that you’re using. You install it. You can immediately … You can either run it from the command line, you can have it go through all your PHP files at one time and make all of these corrections and give you a notification of all the problems and errors. I do it in mine. Every time I edit and save a file, it just automatically does the PHP CBF Beautify. So, it reorganizes the file so that it corrects for most of the things. Then anything that’s left is going to show up in the bottom of my window. It says, “hey I found six errors.” It underlines them and shows you where they are. Gary Yeah, and you can also tie into . . If you’re doing any kind of continuous integration, so if you’re using Travis or Scrutinizer or Bit Bucket Pipeline which is what I’ve been using a lot at the moment. You can set those up so that it will say, “hey pull down the WordPress coding standards, set it up, and run PHPCS against your repo and your newest. Then you’ll get a file that says, “hey this is being checked.” Instead of running it locally, you you can it on every commit as well. Jackie Oh, that’s very good. All right. So, we’ve kind of covered the things that I wanted to ask you about as far as coding standards and code editors and things like that. Just want to roll back to Genesis in general. I know you’re involved in the Genesis Slack channel. That’s where a lot of conversations go if you’re a Genesis developer and you haven’t found that, or you’re using Genesis. It’s a great resource to join the Slack channel. Do you still use Genesis on most of your projects that you do for client work? Gary Yep, absolutely, yeah. If there’s a theme involved we will push them to use Genesis even if it’s a custom child theme that we build from scratch or adapt an existing one or theme out there. Yes, it’ll always be Genesis. That’s just what I’m familiar with and what my team are familiar with. Jackie Why do you like Genesis, in general over maybe some other frameworks if you really want to call Genesis a framework or just a parent theme? I’m not really sure. You have a couple of options. Why did you choose Genesis and why do you continue to use it? Gary I originally stepped into Genesis, before that I was using a different parent/stroke framework, and I try to contribute back. The lead developer there just wasn’t interested at all. It was like, “okay, well yeah. Your theme is okay. I think things could be done better, but you’re not willing to accept.” I got introduced to Brian Gardner via email and he made the fatal mistake of saying, ” oh, if there’s anything you think could be improved, let me know.” For those who know my reputation, you’ll know that I’m not afraid to say, “yeah, there’s certain things you could do better.” So I sent him a big email saying, “yeah there’s certain things you could do better.” He was like, “wow, okay. We need to get you involved here somehow.” That’s how I stepped into it. From there just making contributions to the Genesis Core. There’s certain things and some areas like the breadcrumb stuff is stuff that I completely rewrote. It’s been adapted and updated and probably improved and fixed since then. There’s certain areas that I know that predominantly were my original contributions, and that’s great. Beyond that, for a few reasons, familiarity with the code. Its the ability to still be allowed to contribute even if I know that some of the contributions I make, not necessarily wind people up, but are trying to push Genesis in the direction that others might feel that it doesn’t need to go. My whole goal is to bring Genesis kicking and screaming into a modern development workflow that everybody can be proud of to use on the development of Genesis side of things. Beyond that, it’s then the community, there’s fantastic resources, as a tool itself, if I’m doing multiple websites then I’ve only got one code base to code against. If we’ve got clients who’ve got multiple websites they’ve only got one tool to learn, because obviously they don’t interact too much with the actual theme itself just the features that Genesis has got. Lots of plugins for it. Its a whole community in itself. A community of people, and tools and support and tutorials. I enjoy that community. I can contribute to it in different ways. I like the whole setup of everything there. I’ve got no plans to move away from it. Jackie Do you find it’s easier to customize or develop a child theme in Genesis versus in WordPress Core, just do a child theme there? I’m asking that because I watch a lot of videos for instruction, especially on Lynda. Many times I’ll see Morton Rand Hendricksen, he’ll do a video and he’s not using Genesis. He’s doing things like, just for a typical child theme in WordPress. To me it looks sometimes more complex. A little bit more difficult to work in there. The beauty that I think in Genesis is the hooks and the filters make it very easy to intervene, make your changes, and produce a result in a very logical fashion versus having to go in and edit a bunch of individual files. Then you gotta remember where all of those edits are. To me the beauty of the way the Genesis is structures is, even if I create a lot of partial PHP files for my … Break apart all of my code specific functions like all of my theme setup can go in one file. All of my widget setups can go in another file. My default for the themes can go in another one. Then I’ve got another PHP script for handling all of loading of all of the assets, whether they’re the JS or anything else. Your fonts, everything can be all in one place. The beauty of that is that those are more like configuration files to me. It just seems to much easier to understand to be able to adapt ad quickly change things versus having to go in and like edit your header.php file and your footer.php file. There’s lots of people who do it that way and love that way that that works. I just scratch my head a lot of times. I don’t understand why you would want to do it that way versus this nice configuration that’s already available to use. Gary No, I completely agree. The use of the action hooks and filters within Genesis means that if you can write a plugin, but you’ve never touched a theme before, well you can edit and customize a Genesis child theme. It’s exactly the same. If you understand there’s certain hook points and there’s a callback and there’s a priority for that and maybe some passed in, you understand all you need to know. Combine that with the conditional function so it’s home is “front page” or is front, is archive, is single and all those. You can configure everything you want and as you said, it allows much more flexibility in terms of splitting up the child theme into an array or several files worth of array configurations plus some logic that handle those so that they can be class files, plus then some views that has got your html with a php values, escapes and echoes into it. For me, in my mindset, that works far better than having templates or partial templates that are mixture of some logic and some data and the views side of things. Yeah, I can’t see the benefit of learning something new when actually I’m writing enough plugin themes that I understand the hooks and filters and can make use of it within a child theme as well. I realize it’s different to how many of the child themes work out there, but I love that level of abstractness. That works for me and I can build on top of that in a way that partial templates and some of the other features of 2017 and 2016 and the like don’t have. Jackie Well, we covered what we like about Genesis, so next question would be: What would you like to see changed and you briefly touched on the direction you’d like to see Genesis move into. What’s your vision for the future for that? What would you like to see? Gary Probably three things that I’d like generally addressed in no particular order. First would be, code standards. There’s aspects which we’re talking about the code standards that Genesis still has issues with. Genesis 2.5 will be much better than Genesis 2.4. there’s still room for improvement in there. Its not necessarily has it’s own coding standards so much as there’s aspects of it that just doesn’t follow the WordPress coding standards. When you run the WordPress coding standards sniffs against Genesis you might get hundreds of errors. If we could clear out most of those by adhering to the WordPress coding standards, I will show up with things like, “oh certain values aren’t escaped.” Or certain things you’re using, the post data or getdata without actually sanitizing it for instance. It will show up the more important, critical ones if we can get rid of the fluff coding standards reports that are coming in. Second one would be more config and class driven so that at the moment, much of Genesis is procedural code. There’s all functions in there. There’s a new thing within Genesis 2.5. I’m not sure if we can say about it yet, but basically its split up into a config and a couple of classes so that if, as, and when the config values, the data needs to change, that can be done without even touching the logic for that within the actual classes. That then leads nicely onto the third item which would be to have more unit tests. Yes, you can test functional code, but with classes, when you’re just dealing with that logic you can say, “right, if I give you a certain value into your class method, does it produce the right result that I’m looking for?” You can test all the different code branches, well if you give it duff data, do you get an exception, and so on. So by splitting that the procedural code out into that config and that class you allow it to be more unit testable. Genesis does have unit tests. Its not distributed so most people probably won’t know that they’re out there. There’s certainly a low percentage of code coverage at the moment of which we’re trying to do those kind of two, not the code status as much but do that second and that third item on the agenda so that we do get a high level of code coverage. We can be more confident that when we write some, re-write some code so that the procedural codes are just wrappers for the class-based code. We’ve got the unit test to say, “actually yeah, you’re still producing exactly the same behavior.” Or, “no, you’re meant to be returning an array, but now you’re returning an array of integers instead of strings” or whatever it might be. So, certainly that’s where I’m trying to push Genesis at the moment. It’s to just take little bits of pieces. Let’s take the Genesis update. At the moment, the Genesis updates … If you were to update from Genesis 1, probably not that far back, but say Genesis 1.0 the code would end up running through a series of functions that do version based updates and then one function that does a whole load of updates for particular versions all in one go. We could extract that into a series of class, so we could have Genesis 2.3 update, Genesis 2.2 update, Genesis 2.1 update and just kickstart the method in each of that so that we could then test that in unit tests, do integration tests for that individual update to say, “if we run this, does our database now show it’s got an extra value in it or not an extra value?” Or whatever the change to the database might be. We’d be able to test that far easier than what we’ve got at the moment which predominantly comes down to manual testing. The more we can move to unit tests and integration tests with Genesis the far happier and confident everyone will be about how things are working as they should be working. Jackie How about code base in Genesis? The XHTML code in there. Do you see any need to maybe remove that at some point? Or separate the versions where you leave the XHTML code and maybe just do security updates for it? At some point, let’s just say you’ve got HTML5 and then you have the next standard that comes out after that. How long do you think its feasible to leave all of that code in there to support all of these different versions? Gary I think predominantly that’s going to come down to a business decision. That’s well outside my remit. I don’t work for StudioPress or Copyblocker or Digital. So that’s for Brian and Nathan to decide ultimately. Much of the markups only for 2.4/2.5 goes through what we call the Genesis markup API. It’s not an API in the strict sense, but basically any time there’s markup to be output it goes through a particular function which accepts what the markup should be whether it’s in the HTML5 mode or the XHTML mode. That’s the way they’ve gone forward in that. I proposed a different scenario where as we try to move more things to views, which Genesis 2.5 will have a views folder and the actual markup in there where possible. I suggested, let’s have HTML5 views and XHTML views directory. Then basically on the earliest point you work out, are we supporting one mode or the other and just set the directory path to whichever one was relevant. That way then you get a whole load of files in a directory that basically aren’t being used. It’s not loading them. It’s not affecting performance and so on. Whereas at the moment it is a bit of a mixture. At some point in the future, they’ll say, “right, at version 3 or in 2018 or at some point that they feel is a good business decision. Yes, we’re now going to take it all out and simplify it all down so we just have it in the HTML5 markup in there. Jackie What have you been rethinking in your business and how you work this year versus last year or the year before. How is that affecting what you’re planning to do? Gary Over the last couple years I’ve been in an odd situation. I’ve got one long term client who just keeps giving more work and more work and more work and they are fantastic clients in every which way. That’s kind of led me to the odd situation where I’ve basically done no marketing. What I’m trying to push for this year is to effectively sort out my websites, sort out the positioning that I’ve got which is something that I’ve never really established. I’ve just been a generalist. To sort out the market in terms of what my reputation is with the Genesis community or with the WordPress community with the developer community shall we say. Which isn’t going to be advantageous or useful when I’m trying to market to business with large budget who need a partner to work with them on creating a new website or creating new features or whatever they might need. Part of that is working out my positioning and working out I can convey that within the content of my website. Just the whole brand, really. Which for a company who is going to be 9 years old is quite an unusual step. I’ve never had to dive into it as much as I’ve done so far. I’m trying to balance between the code, the individual projects that I’m coding at the moment, plus project management between the couple of main clients that I’ve got and my team. And sorting out this marketing so that I can move forward in the long term and get more leads in of the type of business that I’m after. Potentially then take on a bigger team to handle that work and grow the company that way. The rethinking is all about establishing the business and not taking the fact into account that I’m 8 years old already. How can I grow? Where do I want to grow? Which direction do I want to grow? Putting myself out there. Ultimately, I think it comes down to ‘monetizing my knowledge’ is the phrase that I keep saying to myself. I’ve spent hours and hours and hours learning about the code and establishing a reputation, good, bad, or otherwise within certain communities. It’s, “how can I turn that now into money in my pocket from the businesses who need that skillset, or who need that experience and that advice and that guidance?” It’s all about the business now. I’ve definitely changed phases in the last six months, I’d say, from …The thing that kick started it is my main client had their business arrangement was such that they were potentially being taken over and said, “well for quarter 1 of 2017 we might need to cut down on the amount of work that we can send your say. Just for three months, just so that our books look better. So that when we’re taken over, we can get a higher share price and higher dividend price and so on.” Because of that and obviously, not as heavily supporting the people in my team as such, but wanting to make sure there’s sufficient work to send their way and support me as well. I really need some extra leads. I can’t have all my eggs in one basket. We’re starting to get more leads in. Starting to diversify. To do that properly we need proper marketing and to really set the business on the right path to growing in a way that it really should be growing. Jackie Any plans to have some more episodes on the UK Genesis Podcast? I loved listening to it. I must listen to every episode that should you guys recorded. I miss it. Gary Yeah, yeah we did, I think up to 25 episodes. We did quite a few. We recorded them every two weeks or so. The reason why we stopped is that we effectively dried up of the people who I knew were willing to come on as UK based Genesis users/developers/designers/Genesis professionals. We got to a stage where we dried up and just that’s it for now. Now we’ve left it probably a year and a half, something like that. It’s been awhile since we’ve done one. Obviously we do know more people in the Genesis UK community so it’s just a case of finding some time. Joe and I have only recently finished the Wordcamp London. Having [inaudible 00:38:13] organized last year. I was the organizer last year and I was the organizer this year. So now that’s done, maybe there’s some more free time amongst all that project management and marketing and all the other bits and pieces. it would be great to do that. I think it provides value to those … The reason why we originally started it was that I was getting leads and Joe was getting leads saying, “right. I’ll use Genesis”, or “I want to use Genesis, but I want to develop for in the UK.” Timezone considerations and so on. It’s like, “well we know a few, but we don’t know that many. There must be a community out there.” So we set up the UK Genesis community, as it were. We wanted to have a directory of contact details so we could say, “hey go look at this. There’s a whole load over there. Go and make contact with each of these people who you think might be suitable.” Work on your business that way. Ultimately, we ended up just having the podcast which were hour long interviews with the individuals and just find out about their business, how they work, and again the tools they use. Then some quickfire questions which I think was really useful for showcasing them. Those 25 hours do act like a showcase that they could use or direct people towards. We even had Mike Little on there. We know he’s a Genesis user. He’s a co-founder of WordPress based in the UK. So as a Genesis user we very fortunately managed to get him on for an hour. I’d love to do it again. I do enjoy the podcast. It’s just finding the time and finding what value it can give to me. I contribute to lots of different things. There’s usually an ulterior motive of to why I’m contributing to a certain plugin. Its because, “oh, I’m using it myself and I need a bug fixed”. Or, “I’m using Genesis.”, or “I want Genesis improved.” Or same for WordPress Core. Its for the UK Genesis podcast, it’s “okay, what value is it giving to me and my business in terms of where I want to push it?” If that all matches up or if I can find the reason there to join it up then, yeah, absolutely we’ll start contacting some UK people and say, “right, let’s set a date. You come on and do a live show for an hour. Talk about yourself.” Which most people can usually do without too much practice beforehand. Let’s get you an hour on there. Jackie Is there anything else you wanted to share before we wrap up? Gary No, I think we’re good. For me, everything is rethinking at the moment for my business and moving forward. It’s good to be busy. There’s lots going on. I probably need to cut down on some things, but yeah. I think everyone just needs to keep going exactly what they’re doing. If they find it’s not working, change it in some way and move forwards. Jackie All right, well thank you Gary for joining me on the show. I hope everybody got a lot out of it. I know I did. If folks want to reach out to you and follow you or touch base with you, how can they reach you? Gary I’m on several different Slacks. The Genesis Slack and the WordPress Slack. I’m on there as GaryJ. I’m also on the UK WordPress Slack under the same name as well. Main website would be gamajo.com, so either look for gamajo or GaryJ or Gary Jones on most profile sites. Twitter as well is GaryJ. Jackie All right, well thank you again, Gary. Thanks to everybody else for listening and tune in to the next episode.