pbs-projects/Tech/Sessions/recipe-cards-seed-packets.md

5.4 KiB

project type status path tags created updated
recipe-cards-seed-packets session-notes completed Tech/Sessions
wordpress
wpcode
elementor
css
php
branding
sunnies
2026-04-14 2026-04-14

Session notes: recipe cards → seed packets

Outcome

Replaced the deprecated [su_posts] shortcode (from the uninstalled Shortcodes Ultimate plugin) with a custom [pbs_recipes] shortcode. Evolved the output through three design iterations: plain list → clean card grid → fully themed seed packet cards. Added AJAX load more (9 recipes per batch) across all 7 category sections on the recipes page. Also decommissioned the old (pre-migration) Linode server with a targeted tar archive of the Docker project directory.

What shipped

  • Custom [pbs_recipes] shortcode registered via WPCode Lite PHP snippet (Auto Insert → Run Everywhere)
  • Pulls standard WP posts by category ID — matches the old su_posts tax_term="N" behavior
  • post_status => publish explicitly set so admins don't see drafts mixed in
  • Shared pbs_render_recipe_cards() function used by both the initial shortcode render and the AJAX load-more handler
  • AJAX endpoint via admin-ajax.php with nonce verification
  • Event-delegated JS (single listener on document) handles load-more across all 7 category sections at once
  • Seed packet visual design: cream/brown double-border frame, Lora serif body + Caveat script for packet title, "★ SOUTHERN HEIRLOOM ★" stamp, "Recipe Packet №161" (phi-adjacent math joke), "Harvested [date]" language
  • Hover overlay on image with "View Recipe →" CTA
  • Full keyboard/focus support via anchor-wrapped cards

Key decisions

Decision Rationale
Custom shortcode over reinstalling Shortcodes Ultimate Only one page
used it; avoids adding a whole plugin for one feature
cat param (standard WP category) instead of WPRM taxonomy Posts are
categorized in WP categories; WPRM cards are attached to posts, not
directly queried
CSS organized into GRID / CARD SHELL / FRAME / CONTENT / LOAD MORE
sections Future seed-packet-to-new-design swaps only touch FRAME block;
content and grid stay stable
Auto Insert → Run Everywhere (not "On Demand") add_shortcode()
registration is microseconds of work; "On Demand" would prevent
registration and break the shortcode
Skip WPRM meta (prep/cook time) for now Not critical for v1;
placeholder commented in PHP for later
Drop the per-recipe packet number, hardcode №161 Simpler than
stable-random or sequential numbering; phi joke works for all cards
Delete old Linode clone after targeted tar backup Linode Images capped
at 6 GB, server disk was 19 GB. Docker project directory at /opt/docker
captured via tar -czf, scp'd locally. Site has been stable for 2+ weeks
post-migration.

Learnings

  • WPCode Lite "Auto Insert" vs "Shortcode" insertion modes — for snippets that register a custom shortcode (not snippets that output content), use Auto Insert. The PHP needs to execute on page load so add_shortcode() runs; it doesn't mean the work runs on every page — the shortcode callback only fires when the shortcode appears in rendered content.
  • Linode Images hard cap is 6 GB per image. Servers with larger disks cannot use the Images feature for archival regardless of quota. Options for oversized servers: Linode Backup Service (not downloadable, tied to Linode lifecycle) or manual tar + scp.
  • Targeted Docker project backup is sufficient for WordPress migrations. The entire compose directory (compose file, bind-mounted volumes, configs) is ~2 GB vs. 19 GB full disk. OS, logs, apt packages all rebuildable.
  • Elementor HTML widget's CSS injection. The widget's built-in "Custom CSS" field is Pro-only, but `` blocks inside the widget's HTML work fine and keep CSS co-located with the markup it styles. Good trade-off vs. Appearance → Customize → Additional CSS (easy to lose track of).
  • tar: Removing leading '/' from member names is informational, not an error — tar strips absolute paths for safer extraction.
  • WP_Query with post_status omitted defaults to 'publish' for non-logged-in users, but includes drafts/private/future for admins. Explicitly setting 'post_status' => 'publish' locks it down regardless of viewer.

Open items

  • Live card polish: "Recipe Packet №161" and "Harvested [date]" rendering as underlined links (theme global link styles bleeding into anchor-wrapped card content); Caveat font not loading for packet title
  • Consider adding WPRM meta (prep time / cook time) to cards when ready — placeholder comment is in the PHP
  • Seed packet design could extend to the Sunflower Garden member area (LOE 1 Phase 3) — visual language already aligns
  • Business Wiki email backup from old server (deferred — not flagged as critical)

Tools / files touched

  • WordPress: WPCode Lite snippet (PHP), Elementor HTML widget on the recipes page
  • Shortcode name: [pbs_recipes cat="N"] with optional per_page, order, orderby args
  • Default per_page: 9
  • Fonts added: Lora (weights 500/600/700), Caveat (weights 600/700) via Google Fonts
  • Colors used: #FBF6EC (cream), #F3E9D2 (packet tan), #2E4D33 (deep green), #7A5A3F (burnt brown)
  • Removed: Shortcodes Ultimate (already uninstalled — confirmed only [su_posts] was in use)
  • Decommissioned: old Linode server (pre-migration clone), archived as tar of /opt/docker

...sent from Jenny & Travis