Brian Coords - WP Dev
Brian Coords - WP Dev
  • 34
  • 84 444
Full Site Editing and Ollie with Mike McAlister
Mike tells me about his extensive journey in the WordPress ecosystem, from a designer to a product builder with OllieWP. We cover the importance of design in WordPress themes, the shift towards full site editing, the value of patterns and pattern libraries, responsive design controls, and more.
Chapters
00:00 Introduction to Mike McAlister and His Journey in WordPress
02:51 The Evolution of WordPress Themes and Design Philosophy
06:09 Full Site Editing and Its Impact on Theme Development
09:00 Understanding the Diverse User Base of WordPress
11:54 The Importance of Patterns in WordPress and Future Directions
15:13 Designing with Figma: The Process Behind Creating Patterns
18:03 The Future of Pattern Libraries and User Contributions
20:56 WordPress 2024: Priorities and Expectations
24:14 Responsive Design Controls and User Needs
27:04 Version Control and Workflow in Pattern Development
29:51 Upcoming Features and Enhancements for Oli WP
37:58 New Chapter
มุมมอง: 1 060

วีดีโอ

Add custom CSS and JavaScript to any WordPress block in Gutenberg
มุมมอง 1.4Kหลายเดือนก่อน
We're adding custom CSS and JavaScript files to WordPress core blocks. Modify any block.json with simple PHP to load your own custom CSS and JavaScript in Gutenberg. 🚨 Free Series: www.briancoords.com/7tools 👉 Full Code: github.com/bacoords/example-block-assets 00:00:00 Introduction 00:01:28 Registering custom JavaScript for a block 00:02:50 How to filter Block.json 00:06:44 Registering custom ...
Local WordPress with Herd, DBngin, and WP-CLI
มุมมอง 1.4Kหลายเดือนก่อน
Local WordPress development made easy with Laravel Herd and DBngin. We'll use wp-cli to download, install, and manage a local WordPress environment in just a few minutes. 🚨 Free Series: www.briancoords.com/7tools 👉 herd.laravel.com/ 👉 dbngin.com/ 👉 developer.wordpress.org/cli/commands/
Build a Custom AI Block in WordPress with OpenAI Integration
มุมมอง 6782 หลายเดือนก่อน
Let's create a custom WordPress Gutenberg block that connects to OpenAI’s API. Our block will feed the post content to OpenAI in order to generate social media posts. Along the way, we'll focus on challenges like integrating API calls, getting post data inside the editor, and securing API keys. 💻 Code: github.com/bacoords/example-ai-block 🚨 Free Series: www.briancoords.com/7-tools-for-modern-wo...
WordPress 6.6 is changing the game for Custom Fields
มุมมอง 10K5 หลายเดือนก่อน
WordPress is bringing Custom Fields to blocks. The Block Bindings API is going to change the way we code for postmeta, and WordPress 6.6 is our first glimpse. 👉 All the code: github.com/bacoords/example-block-variation/tree/6.6-bindings 🚨 Free Video Series: 7 Tools for Modern WordPress Development 🚨 👉 briancoords.com/7tools 00:00:00 Intro to Block Bindings 00:00:53 Custom Fields and CPTs in 6.6...
Registering Block Settings in PHP? Build in Public Ep 6
มุมมอง 1.2K5 หลายเดือนก่อน
Thoughts on adding custom fields to Gutenberg blocks- using PHP, no JavaScript or React. Should WordPress let us register custom fields on blocks? 👉 10ups Gutenberg Best Practices - gutenberg.10up.com/ 👉 CMB2 - wordpress.org/plugins/cmb2/ 👉 Block Settings Repo - github.com/bacoords/block-settings 🚨 Free Video Series: 7 Tools for Modern WordPress Development 🚨 👉 briancoords.com/7tools 00:00:00 I...
WordPress Playground Blueprints and 6.6 Beta
มุมมอง 6065 หลายเดือนก่อน
Let's dig into WordPress Playground and see how you can use it to do anything with WordPress, including beta test the next major release. 🚨 Free Video Series: 7 Tools for Modern WordPress Development 🚨 👉 briancoords.com/7tools 👉 Playground: playground.wordpress.net/ 👉 Playground Docs: wordpress.github.io/wordpress-playground/ 👉 Blueprints Gallery: github.com/WordPress/blueprints/blob/trunk/GALL...
Query Monitor - 7 Important Tools for Modern WordPress Development #1
มุมมอง 1.8K5 หลายเดือนก่อน
Get the full series: www.briancoords.com/7tools 00:00:00 Introduction 00:00:57 What is Query Monitor 00:02:48 Debugging PHP Errors 00:03:18 Dumping Variables 00:04:58 Timing and HTTP 00:06:19 Next Steps
Bricks vs Block Themes: My Followup to Bridge Builders
มุมมอง 3.1K6 หลายเดือนก่อน
Followup to the Bridge Builders livestream, going over the custom block theme and my (minimal) set up, and thoughts on the page builder TH-camr community's obsession with "dynamic data". 🚨 Free Video Series: 7 Tools for Modern WordPress Development 🚨 👉 briancoords.com/7tools 👉 Bridge Builders Episode: th-cam.com/video/al23k0Kv3H4/w-d-xo.html 👉 Example Site: fiji-of-herrings.wp.build/ 👉 Block St...
WordPress Studio Review
มุมมอง 3.7K7 หลายเดือนก่อน
WordPress.com released their new local development tool- and there's been a lot of misconceptions lets clear those up, talk about some of the underlying technology, and compare it to the elephant in the room: LocalWP. 🚨 Free Video Series: 7 Tools for Modern WordPress Development 🚨 👉 briancoords.com/7tools 👉 Subscribe for WordPress tips: www.briancoords.com 👉 Studio: developer.wordpress.com/stud...
Using Block Variations with the Block Bindings API
มุมมอง 2.2K8 หลายเดือนก่อน
Using Block Variations with the Block Bindings API
How the block editor handles CSS (Building in Public - Block Styles Manager Ep 5)
มุมมอง 5199 หลายเดือนก่อน
How the block editor handles CSS (Building in Public - Block Styles Manager Ep 5)
Using Core Data and Sharing Context across WordPress Blocks
มุมมอง 1.6K9 หลายเดือนก่อน
Using Core Data and Sharing Context across WordPress Blocks
Thoughts on Editor UI (Block Styles Manager - Build in Public Part 4)
มุมมอง 3829 หลายเดือนก่อน
Thoughts on Editor UI (Block Styles Manager - Build in Public Part 4)
Building a Block Styles Manager - Episode 3
มุมมอง 4619 หลายเดือนก่อน
Building a Block Styles Manager - Episode 3
WP REST API and Postman - Using Application Passwords in WordPress
มุมมอง 2.1K9 หลายเดือนก่อน
WP REST API and Postman - Using Application Passwords in WordPress
Block Styles Manager for WordPress - Ep 2 (Build in Public)
มุมมอง 50610 หลายเดือนก่อน
Block Styles Manager for WordPress - Ep 2 (Build in Public)
Building a Block Styles Manager - Ep 1 (Build in Public)
มุมมอง 1.1K10 หลายเดือนก่อน
Building a Block Styles Manager - Ep 1 (Build in Public)
How to Build Dynamic (PHP) Blocks in WordPress
มุมมอง 11K10 หลายเดือนก่อน
How to Build Dynamic (PHP) Blocks in WordPress
Building an example layout in Gutenberg (response video)
มุมมอง 4.3K10 หลายเดือนก่อน
Building an example layout in Gutenberg (response video)
Adding Custom Fields (attributes) to Core Gutenberg Blocks | WordPress
มุมมอง 6Kปีที่แล้ว
Adding Custom Fields (attributes) to Core Gutenberg Blocks | WordPress
Easy custom blocks using InnerBlocks in Gutenberg
มุมมอง 3.4Kปีที่แล้ว
Easy custom blocks using InnerBlocks in Gutenberg
Redesign Lists in WordPress with Register Block Style
มุมมอง 1.4Kปีที่แล้ว
Redesign Lists in WordPress with Register Block Style
Custom Responsive Settings in Gutenberg Blocks
มุมมอง 8Kปีที่แล้ว
Custom Responsive Settings in Gutenberg Blocks
ACF Blocks Post Carousel Tutorial
มุมมอง 4.7Kปีที่แล้ว
ACF Blocks Post Carousel Tutorial
Managing Images in your Custom Gutenberg Block
มุมมอง 1.9Kปีที่แล้ว
Managing Images in your Custom Gutenberg Block

ความคิดเห็น

  • @jeanettesozpix
    @jeanettesozpix 7 วันที่ผ่านมา

    This past week I was comparing PODS and ACF (SCF) for creating our own directory (instead of a directory plugin). I had decided to go with PODS until I came across this. I'm wondering how Create Content Model will compare?

    • @BrianCoords
      @BrianCoords 12 ชั่วโมงที่ผ่านมา

      I'm pretty sure Automattic is not going to actively develop CCM any further. PODS is a fantastic choice

  • @TC-wr4jx
    @TC-wr4jx 7 วันที่ผ่านมา

    Blessings to you! These are excellent tools. 💖

  • @RogerWilliamsFTW
    @RogerWilliamsFTW 7 วันที่ผ่านมา

    Great conversation about WordPress and making sites. Now I’m all excited to build more sites. Thanks guys! Looking forward to the next one.

  • @coding4tacos
    @coding4tacos 11 วันที่ผ่านมา

    Really enjoyed listening to this!

  • @alwaysopendesign
    @alwaysopendesign 11 วันที่ผ่านมา

    Great conversation. Appreciate Mike's approach a lot.

  • @webstrategen2391
    @webstrategen2391 11 วันที่ผ่านมา

    What a refreshing conversation about the future of WordPress, thanks

  • @deothemes
    @deothemes 12 วันที่ผ่านมา

    I went in the wrong direction at some point deciding to make mega-themes with tons of functionality. Now I'm struggling with the updates and support since everything breaks all the time :)

  • @DecimusBurton
    @DecimusBurton 12 วันที่ผ่านมา

    Great first video on where WP is heading.... Huge fan of Ollie! Moved all my sites from Astra Pro to Ollie, And signed up for Ollie Pro too. Ollie just works. And it looks great. Looking forward to the next collection.

    • @mikemcalister3781
      @mikemcalister3781 12 วันที่ผ่านมา

      Thanks for watching, Peter! You're a true Ollie PRO user!

  • @alphawebtips2950
    @alphawebtips2950 12 วันที่ผ่านมา

    I'm a fan of FSE. Looking forward to have commercial theme.

  • @GodCenteredTheology
    @GodCenteredTheology 12 วันที่ผ่านมา

    Great video! I am a huge fan of FSE and Ollie!

    • @BrianCoords
      @BrianCoords 12 วันที่ผ่านมา

      Me too! Thanks for watching

  • @Wolf_with_Mustache
    @Wolf_with_Mustache หลายเดือนก่อน

    OMG, Query Monitor probably just saved me hours of debugging, tail chasing and a chunk of my sanity. Thanks for explaining and promoting this great plugin!

    • @BrianCoords
      @BrianCoords 18 วันที่ผ่านมา

      Yes! That's great to hear.

  • @cristif92
    @cristif92 หลายเดือนก่อน

    how do you still handle the database required for testing, and database for content with both feature1 and feature 2 ? Name the tools and the know-how 😁

    • @BrianCoords
      @BrianCoords 18 วันที่ผ่านมา

      I'm a fan of using WP-CLI to quickly pull databases down from production, very easy to use WP-CLI to import, jump between multiple databases, etc

  • @igorDevIt
    @igorDevIt หลายเดือนก่อน

    Awesome! Thanks! )

  • @masterng56
    @masterng56 หลายเดือนก่อน

    how do I add my css to a block theme for the entire site?

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      The same way you would with a classic theme - wp_enqueue_style will load the css file across the entire site. I still use this for some global stuff, like the header/footer, where I know it'll be used across the entire site.

  • @Steve-Ariss
    @Steve-Ariss หลายเดือนก่อน

    Oh this is handy! Thanks Brian! Also - Been liking the new focus zooms in your videos - what are you using for screen recording now?

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      That's from screen.studio/. - it has a lot of cool features (like the zoom) but I'm not really enjoying the editing experience so you'll probably see more experimentation happening.

  • @elliottrichmondwp
    @elliottrichmondwp หลายเดือนก่อน

    Nice! I've been thinking about this alot recently, you mind if I use your example in my next YT video?

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Go ahead!

  • @yasershahian3134
    @yasershahian3134 หลายเดือนก่อน

    Awesome

  • @jamiewp
    @jamiewp หลายเดือนก่อน

    Great video, and looking great 👍

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Thanks I've been hitting the gym, eliminating carbs... oh wait you mean the camera/lighting updates.

    • @jamiewp
      @jamiewp หลายเดือนก่อน

      @@BrianCoords what lights?

  • @markjszymanski
    @markjszymanski หลายเดือนก่อน

    Looking crisp 🔥🔥🔥🔥

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Trying to get that lighting/camera just a little better each time. Tired of people asking me why I'm not as good as Mark J Szymanski.

  • @perezcarreno
    @perezcarreno หลายเดือนก่อน

    This is a great tip! Thanks, Brian!

  • @joninsley8
    @joninsley8 หลายเดือนก่อน

    Wow, I didn't know about the logging feature. I've only been using it for years to check for errors and slow queries

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Same here- I was using it for years before I actually learned about logging. Now I use it all the time.

  • @seiuwatches
    @seiuwatches หลายเดือนก่อน

    love the new camera, looks better quality

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Thanks for noticing. I have some lighting tweaks in the works and will hopefully test those on the next video.

  • @MoxetKhanPK
    @MoxetKhanPK หลายเดือนก่อน

    Great video, what benifits we get if we skip tools like Local or Xamp etc

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Copying my reply above: Less bloat, more performant, more actively developed, easier to switch between WP and non-WP projects, and I guess a chance to level up your developer skills.

  • @AntonioOrtizOrtega
    @AntonioOrtizOrtega หลายเดือนก่อน

    Thans for sharing!. I'm using Laragon which is superfast, all-in-one tool and you have a https site in WordPress up and running in a few clicks.

  • @wpeasy
    @wpeasy หลายเดือนก่อน

    What are the benefits of this over Flywheel Local or the similar tool from WordPress?

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Less bloat, more performant, more actively developed, easier to switch between WP and non-WP projects, and I guess a chance to level up your developer skills.

  • @WPMinute
    @WPMinute หลายเดือนก่อน

    Get off the stage, Brian!

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Hey it's my biggest fan!

  • @Earthcrosser
    @Earthcrosser หลายเดือนก่อน

    Thanks Brian. I'm on Windows and I'm stuck on 3:53 because I'm not sure where 'wp' is. :( Crap. I have to install wp-cli. Lol. Thank you for mentioning that. >:( UPDATE: Was able to set up wp-cli. Manually set up a path. However, DBngin did not create a path to mysql as 'wp db create' does not recognize mysql. I tried to manually find mysql.exe and set a path to it. wp-cli still cannot find it. I GIVE UP. LOL.

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Yeah one issue I had is that I have a lot of these tools already running and I don't fully remember how I set some of them up.... When I run wp --info I see that it's calling the MySQL binary that I guess I installed at some point with Homebrew. Interesting.

  • @Steve-Ariss
    @Steve-Ariss หลายเดือนก่อน

    Have you tried DDEV? You don't get that nice GUI but I think you can get up and running faster and you end up with a really flexible dev environment

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      No but I've heard a lot of good things about it! Honestly each project ends up needing it's own environment depending on the tools, where it's hosted, etc.

  • @omerta3393
    @omerta3393 หลายเดือนก่อน

    No Linux support for this apps :(

    • @bicho44
      @bicho44 หลายเดือนก่อน

      You can use, various version of Valet, is similar but no UI, i recommend Valet++

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      😬

    • @khandakershahi
      @khandakershahi หลายเดือนก่อน

      Yes, I was excited than found no Linux support.

    • @yasershahian3134
      @yasershahian3134 หลายเดือนก่อน

      @@khandakershahi for now DDEV is working fine on linux, has phpmyadmin, wp-cli, local ssl and domain, ...

  • @kristijanpirkovic9594
    @kristijanpirkovic9594 หลายเดือนก่อน

    Brian, what makes Herd better than a tool like LocalWP?

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      I like that it's just leaner and faster. It's more actively developed. It's also great if you're doing more than just WordPress development, you don't have to switch environments. But there'll be a few WP hosting-specific features in LocalWP that you might miss.

  • @farhan-app
    @farhan-app หลายเดือนก่อน

    This is awesome! Thank you for sharing Brian - subscribed!

    • @farhan-app
      @farhan-app หลายเดือนก่อน

      Hey Brian - just wondering if it's easy to export a site using something like WPVivid from this local environment?

  • @webshoreeu
    @webshoreeu หลายเดือนก่อน

    Herd is great! Using the Windows version since it was released on a daily basis and as a replacement for Local by Flywheel. Adding DBngin and TablePlus makes it an awesome development toolkit!

  • @imraan_alam
    @imraan_alam หลายเดือนก่อน

    They have windows support. I use it everyday.

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Thanks for pointing that out!

  • @AaronTweeton
    @AaronTweeton หลายเดือนก่อน

    Thanks for sharing! It’s great to see that Herd could be used for both Laravel and WordPress development.

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      PHP FTW

  • @elliottrichmondwp
    @elliottrichmondwp หลายเดือนก่อน

    Interesting, I haven’t used Herd, but I do use Valet, which, as you probably know, is more command-line driven. The only difference is that you have an app with a UI with Herd, I guess. It would be interesting to see if Valet is actually being used under the hood. I also use WP-CLI and a generic script to fire all commands with prompts for database names, usernames, emails, and passwords, etc. Nice video and insight-always interesting to see other devs’ workflows. 👍

  • @rafidiul-albani4590
    @rafidiul-albani4590 หลายเดือนก่อน

    Thank you for the instructions. A very good method for me as a beginner to learn how to use the command line.

  • @tobisalami
    @tobisalami หลายเดือนก่อน

    Oops. Not on windows. Okay. Thanks for the video though. You're doing great

    • @elvisblancogonzalez
      @elvisblancogonzalez หลายเดือนก่อน

      They do have a Windows version. Just click the "Looking for Windows?" button

    • @tobisalami
      @tobisalami หลายเดือนก่อน

      @@elvisblancogonzalez Ah! Yes! That's true. Thanks!

    • @BrianCoords
      @BrianCoords หลายเดือนก่อน

      Thanks for correcting this!

  • @NikkiWinwood
    @NikkiWinwood 2 หลายเดือนก่อน

    Thank you for this content. I will be studying all of your videos!

  • @PaweBystrzan
    @PaweBystrzan 2 หลายเดือนก่อน

    After a year I think it would be nice to have option to make a pattern - just like you made a custom block, but pattern, save custom css inside pattern and one click option to convert pattern to block. Sometimes in the past I used CBB plugin (Content Blocks Builder) - it has some nice workflow to create blocks from blocks, patterns etc, but unfortunately not in core way. Hope WP core team will move in this area. As always - great video tutorial, Best, Paul

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      Yep I agree - easily bundling extra CSS/styles with patterns would be huge.

  • @TheBeeOBee
    @TheBeeOBee 2 หลายเดือนก่อน

    Good demo. Learned a lot. But is promoting ai usage ethical? Washington Post just reported that a 100 word ai email uses a bottle of water to produce. Elon Musk operated illegal gas generators to power his ai plant. Microsoft is reopening the 3 mile island nuclear plant to power ai. People are just playing around with this burning up the planet. A bottle of water for a 100 word email!

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      Definitely a consideration. I do think chip performance, specialized AIs, and renewable energy will continually improve but I agree we're in the smoggy industrial revolution phase of AI.

  • @PaweBystrzan
    @PaweBystrzan 2 หลายเดือนก่อน

    Few things I would do different: 01. Sticky header - if you use css i recommend to calc() as the frontend admin bar. This variable below handles different heights for mobile and desktop: header.wp-block-template-part { position: sticky; top: calc(0px + var(--wp-admin--admin-bar--height, 0px)); z-index: 9; } 02. Header alignement: menu is not centered, but it's easy to fix.button and logo should be in group with same fixed width. 03. If first heading is H1 - it's better to make soft enter to prevent double H1 on page ( [shift] + [enter] ). For making inline color I would register inline color, but without adding PHP / JS with just CSS I would use bold or cursive inline style and style it by CSS in Site Editor Custom CSS section. As always - it was pleasure to watch. Best, Paul

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      Yes! These are all great notes! 100%

  • @realVvD
    @realVvD 2 หลายเดือนก่อน

    This is actually a very nice and followable tutorial on gutenberg block development. Thx!

  • @Xenio2007
    @Xenio2007 2 หลายเดือนก่อน

    I'll love a tutorial how to develop a Synced Pattern Overrides in php to distribuite with a theme. Synced Pattern Overrides looks very powerful.

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      At this point it’s not really possible to have synced patterns in a theme- they only live in the database. But hopefully it’s on the roadmap.

  • @AnnaMariaEriksson
    @AnnaMariaEriksson 2 หลายเดือนก่อน

    I really hope native CPT's will come to core. I was hoping it would happen with WordPress 6.7, but I guess we're gonna have to wait longer for that to happen... Great video!

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      Yep - CPTs will require some code or a plugin for the foreseeable future.

  • @chickenorshrimp533
    @chickenorshrimp533 2 หลายเดือนก่อน

    I appreciate that you're going from start to finish with a practical example - explaining each step & the reasoning behind it. Please keep up the great work!

  • @chadreilly
    @chadreilly 2 หลายเดือนก่อน

    Can you build a tabs block/pattern with core?

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      Any thing that requires interactive JavaScript (like tabs) won't be in core - meaning you'd need to find a plugin or build a custom block.

  • @chadreilly
    @chadreilly 2 หลายเดือนก่อน

    This is very helpful. In the speed builds, with all the switching back and forth between players, you can't see as well what's being done. I would have liked to see how you built that header, even if it went overtime. Maybe do a, "here's my build official" vs "here's me doing some extra interesting things I didn't have time for."

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      I agree- I can never follow what anyone is doing, I just like hearing people explain and talk. I'm glad this was helpful and I definitely have it on my agenda to do some longer/fuller builds and show some more complicated layouts.

  • @CourtneyR_dev
    @CourtneyR_dev 2 หลายเดือนก่อน

    00:04 Creating a custom block in Gutenberg for WordPress with OpenAI integration 01:55 Creating a custom AI block in WordPress using OpenAI 05:57 Building a custom AI block in WordPress 07:55 Creating a generate tweet function and importing button component 12:01 Create a custom REST API endpoint for security 14:04 Implementing permissions for API endpoint access 17:51 Generate a tweet using OpenAI API for social media management 19:33 Ensure response is clean and contains necessary information 23:03 Using WordPress function add_query_arg to pass parameters and generate tweet 25:02 Custom AI blocks in WordPress can return more data via API endpoints for testing and customization. 28:44 Integrate AI into custom block using PHP for secure server-level interactions 30:22 Integrate AI capabilities into WordPress with OpenAI Crafted by Merlin AI.

    • @BrianCoords
      @BrianCoords 2 หลายเดือนก่อน

      Well shoot I had chapters in Descript and totally forgot to paste them in. Thanks!