Understanding the Query Loop Block

WordPress Hartford CT Meetup
May 22, 2024
[ Make Current ]

Watch Recording

Click below to watch our May 2024 meetup on YouTube, or visit
https://www.youtube.com/watch?v=PX8K6Nbf8ec

[ Make Current ]

Agenda

  • Speaker Introductions
  • What Is The Query Loop? (Ray & Peter)
  • How Was It Used Before The Block Editor? (Ray)
  • Using The Query Loop Block (Peter)
  • Creating A Dedicated Blog Page (Ray)
  • Alternatives (Ray & Peter)
  • Wrap-Up
[ Make Current ]

Ray Michno

Cute Yellow Wapuu WordPress Mascot
ray@ctwebgeek.com
  • Hartford WordPress Co-Organizer
  • 25+ years in IT
  • Developer/Software Architect
  • Pratt & Whitney, Aetna, UnitedHealthGroup
  • 7+ years using WordPress
  • Self-employed – CTWebGeek
  • Married, No Kids, Lives in Newington, CT
  • Geek
[ Make Current ]

Peter Ingersoll

peter@ingersollinteractive.com
  • Hartford WordPress Co-Organizer
  • 25+ working on the Web
  • Marketing, communications, design, tech guy
  • Hartford Courant, logistics, agency
  • 10 years using WordPress
  • Self-employed – Ingersoll Interactive
  • Married, two adult kids, lives in South Windsor, CT
  • WordPress Admin and DIY Advocate – IngersollWP.com
[ Make Current ]

Understanding the Query Loop Block

WordPress Query Loop
[ Make Current ]

What Is The Query Loop?

  • The Query Loop (aka “The Loop) is how WordPress retrieves and displays blog posts, pages, categories, tags and custom post types.
  • Posts, Pages, etc. are all saved in your WordPress database.
  • WordPress provides the framework for accessing this data.
  • The Query Loop Block is a new, more user-friendly method of working with “The Loop” by using the Block Editor.
[ Make Current ]

How Was It Used Before The Block Editor?

  • The Loop is PHP code used by WordPress to display posts, etc.
  • You needed to be comfortable working with PHP and WordPress template files.
  • Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop Template Tags.
  • A Template Tag is code that instructs WordPress to “do” or “get” something.
    ex. the_permalink() – displays the permalink for the current post
  • Any HTML or PHP code in the Loop will be processed on each post.
  • The Loop should be placed in the Theme’s index.php and in any other Templates used to display post information.
[ Make Current ]

Live Demo

Wapuu Dev
It’s Demo Time!

The Standing WordPress Reminder

Rubiks Wapuu
Your WordPress experience is defined by your theme, plugins, and custom code. WordPress environments can vary greatly!
Understanding concepts is more helpful than specifics.

Using The Query Loop Block

  • All the query loop goodness, none of the code
  • Powerful block used to display posts based on specified parameters
  • Can be used in many design and content variations
  • Can be placed on any page, including multiple loops on the same page
  • Use for blog post pages, portfolios, home page featured areas, category pages, etc.
  • Work in both block themes and classic themes
  • Not as scary as it sounds – experimentation is encouraged!
[ Make Current ]

Theme Blocks Used in Query Loops

  • Query Loop
  • Post Title
  • Post Featured Image
  • Post Excerpt
  • Post Date
  • Post Author
  • Categories
  • Tags
  • etc.
  • Plus most other blocks
[ Make Current ]

Live Demo

Wapuu Dev
It’s Demo Time!

Creating A Dedicated Blog Page

  • By default, most themes are set up to display your latest blog posts as your Home page.
  • This can be changed in “Settings” -> “Reading” in the WordPress Dashboard.
  • Creating a separate blog page gives you the ability to display a static Home page.
  • By default the separate blog page will usually use the “index.php” template for formatting.
  • But you can change this and style your blog page however you want.
  • You can also create pages to display custom post types, category pages, etc.
[ Make Current ]

Live Demo

Wapuu Dev
It’s Demo Time!

Alternatives and Extensions to The Query Loop Block

  • Other Core WordPress Blocks
  • Posts List – a variation of the Query Loop block that lets you display posts based on various query parameters and visual configurations
  • Calendar – displays your posts in a calendar format.
  • Latest Posts – displays your most recent posts
  • Archives – display a date archive of your posts
  • Block Plugins or Themes – ex. Kadence, GenerateBlocks, Blocksy
  • Advanced Query Loop Plugin, Query Loop Post Selector, etc.
[ Make Current ]

Wrap Up & Q&A

Wapuu with laptop and cat
[ Make Current ]