129 lines
5.4 KiB
Markdown
129 lines
5.4 KiB
Markdown
---
|
|
project: recipe-cards-seed-packets
|
|
type: session-notes
|
|
status: completed
|
|
path: Tech/Sessions
|
|
tags:
|
|
- wordpress
|
|
- wpcode
|
|
- elementor
|
|
- css
|
|
- php
|
|
- branding
|
|
- sunnies
|
|
created: 2026-04-14
|
|
updated: 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 |