A strictly grounded technical manual and runtime showcase for the 9th Realm Gallery platform. Elevating custom tattooing into classical fine art with automated resident artist provisioning, standalone mobile PWA client pipelines, visiting guest residencies, global convention scheduling, and deep Forminator booking routing.
Real-time working testbenches demonstrating the custom PHP/JS engines built into the 9th Realm codebase.
Tests the [artist_cards] roster and the forminator_field_hidden_field_value injection hook. Switching artists updates individual brand colors, bio metadata, and live Forminator hidden field payloads.
Simulates the mobile /artist-portal/ app. Intercepts iPhone .heic camera uploads client-side with heic2any conversion before transmitting via POST /artist/gallery with SortableJS reordering.
Simulates the [ninth_realm_3d_skull] with cursor and mobile touch drag 3D perspective and the authentic @keyframes authenticRattle physics using assets/images/skull_cutout.png. Allows live toggling between the custom utility classes (.nr-polaroid, .nr-ornate-frame, .nr-glass-dark).
Registers the custom resident_artist post type along with a dedicated WordPress user role. Authors can upload media and manage their profile while restricting Media Library visibility exclusively to their own uploads via ajax_query_attachments_args.
register_post_type('resident_artist')
When an artist is published, maybe_create_artist_page searches for an "Artist Template" draft, duplicates all post meta (Colibri page builder layouts), injects the page into the primary nav under "Artists", and safely preserves "Guest Artists" as the last menu node.
wp_update_nav_menu_item()
Generates responsive multi-column artist profile cards automatically ordered by their actual WordPress navigation menu position. Embeds dynamic CSS custom properties for custom hover glows based on each artist's individual brand color.
[artist_cards columns="3" align="center"]
Context-aware multi-module shortcode that auto-detects the viewed artist by current page title or manual name="" attribute. Renders biographies, responsive lightbox galleries, social icons, or dedicated booking forms.
[artist_data field="gallery" columns="3"]
Standalone mobile web app served on /artist-portal/ backed by nr-sw.js. Features an offline network-first caching strategy, 1-year persistent authentication cookie, and tailored mobile-only management view.
add_rewrite_rule('^artist-portal/?$')
Solves WordPress's lack of native iPhone HEIC image support by bundling heic2any. Transparently converts high-efficiency mobile camera photos into standard JPEG files right in the user's browser before transmission to the server.
heic2any({ blob, toType: "image/jpeg" })
Touch-friendly drag-and-drop portfolio rearranging powered by SortableJS. Saves reordered attachment IDs instantly over REST endpoint /ninth-realm/v1/artist/gallery with dynamic homescreen app icons generated via nr-manifest.json.
POST /wp-json/ninth-realm/v1/artist/gallery
Dedicated residency management system for traveling international tattooers. Evaluates residency date ranges dynamically against server time to partition artists into "Current & Upcoming" and "Past" views without manual intervention.
[guest_artists status="all" show_past_button="false"]
Clicking any guest card activates a full-screen blurred modal populated with the artist's full biography, scheduled dates in Salem, direct Instagram/TikTok/email channels, and a high-resolution gallery grid with lightbox integration.
data-modal="{...}" & lightboxHtml
Provides admin controls for _guest_artist_image_position (Top, Center, Bottom) to prevent head cutoffs in portrait cards, and a manual _guest_artist_force_current boolean switch for unannounced or extended residencies.
update_post_meta($id, '_guest_artist_image_position')
Tracks the studio's global appearances at Hell City, New York Tattoo Convention, London, and beyond. Normalizes start/end dates across all global timezones into indexed UTC timestamps for lightning-fast server-side SQL ordering.
[nr_events type="upcoming" limit="-1"]
Client-side dropdown filters automatically generate when multiple countries, states, or cities are present. Computes real-time status: if an event is currently underway, displays an animated pulsing HAPPENING NOW alert badge.
Ninth_Realm_Events::get_event_status()
Ships with a dedicated standalone templates/single-nr_event.php template. Supports post-event updates through _nr_event_is_update, rich text recap commentary, and awards gallery showcases.
[nr_events type="updates"]
Merges artist uploads from the PWA portal with admin-curated photos into a randomized masonry feed. Features custom portal dropdown filtering leveraging the browser's native document.startViewTransition API for buttery animated layout changes.
[ninth_realm_global_gallery]
Injected native Vanilla JS lightbox with deep inset shadow borders, arrow navigation, keyboard controls (ESC, Left, Right), backdrop blur, and automatic DOM relocation to document.body to break out of page builder CSS stacking contexts.
document.body.appendChild(modal)
Renders a weekly featured artwork spotlight with artist branding and a custom consultation CTA button. Injects dynamic CSS globally into wp_head to create a full-bleed 100vw Ken-Burns-ready background behind page builder sections.
[ninth_realm_featured_piece]
Physics-driven 3D skull element powered by assets/images/skull_cutout.png and cta-skull.png. Leverages VanillaTilt on desktop and deviceorientation gyroscope tracking + touch-drag on mobile. Reacts to scroll position by scaling up and shifting from black-and-white to full color as it centers on screen.
[ninth_realm_3d_skull]
Hijacks Colibri's standard mobile hamburger and replaces it with an animated occult hexagram icon. Opening expands a mystical circular clip-path layer from the button's exact coordinates with staggered animated menu links.
clip-path: circle(150% at var(--btn-x) var(--btn-y))
Renders the eerie swinging pendulum skull beneath navigation utilizing assets/images/skull_cutout.png (873x1024 RGBA) with scroll-linked opacity fade (handleSkullFade) and menu dropdown hover suppression (.hide-skull). Powers [ninth_realm_back_to_top] in the lower-right stone monolith box and branded CSS classes: .nr-polaroid, .nr-ornate-frame, .nr-glass-dark, and .nr-flash-grid.
[ninth_realm_back_to_top]
Hooks forminator_field_hidden_field_value to detect booking forms rendered on artist pages. Automatically captures the viewed artist's name and forcefully injects it into Forminator hidden fields for targeted studio routing.
[artist_data field="booking_form" form_id="1"]
Populates any Forminator dropdown possessing the CSS class dynamic-artist-select with permanent residents and currently active guest artists. Pairs with bypass_dynamic_artist_select_validation to eliminate "option does not exist" server errors.
add_filter('forminator_cform_render_fields', ...)
Filters admin notification emails with forminator_custom_form_mail_admin_message to purge unneeded photo labels if none were submitted. Applies clean minimalist CSS overrides to remove default blue Forminator Select2 borders.
forminator_custom_form_mail_admin_message
Replaces standard WordPress admin clutter with a custom dark-mode dashboard (templates/admin-dashboard.php). Houses an AJAX artist onboarding wizard, guest roster manager, global photo organizer, and one-click cascading cleanup endpoints.
wp_ajax_ninth_realm_onboard_artist
Shortcode [ninth_realm_map] creates an inverted dark Leaflet map of Salem with a glowing skull marker. Shortcode [wcw_copyright] executes mathematical lunar epoch calculations to output the real-time moon phase emoji directly in PHP.
[ninth_realm_map lat="42.515328" lng="-70.893028"]
Comprehensive reference detailing every shortcode, accepted attributes, defaults, and exact codebase behaviors.
| Shortcode / Hook | Supported Attributes | Default Values | Technical Description & Codebase Output |
|---|---|---|---|
[artist_name] |
format |
format="full" |
Extracts current page title inline. Use format="first" for conversational copy (e.g. "Book with Gabe"). Bypasses execution during REST/AJAX saves to protect builder layouts. |
[artist_data] |
field, id, name, limit, columns, form_id, align |
field="bio", id="0", columns="3", form_id="1", align="center" |
Primary multi-module component. Fields: bio, gallery, socials, booking_form, title, profile_image, featured_piece. Auto-detects artist by page title. |
[artist_cards] |
columns, align |
columns="3", align="center" |
Renders resident artist portfolio grid. Deduplicates titles, queries nav menu position to preserve exact menu ordering, and applies dynamic primary brand color hover glow. |
[ninth_realm_global_gallery] |
None | N/A | Aggregates personal PWA uploads and admin gallery attachments. Shuffles order and injects View Transitions API filter dropdown with native vanilla lightbox. |
[guest_artists] |
status, show_past_button |
status="all", show_past_button="false" |
Displays traveling guest tattooer grid with filter pills. Calculates active vs past residency using start/end date metadata and renders full-screen bio/gallery modal. |
[nr_events] |
type, limit |
type="upcoming", limit="-1" |
Convention circuit display. Queries normalized UTC timestamps with multi-timezone support, cascading country/state/city dropdown filters, and live HAPPENING NOW alert badge. |
[ninth_realm_featured_piece] |
None | N/A | Highlights weekly featured artwork with artist branding and custom CTA. Pairs with ninth_realm_featured_piece_dynamic_css to generate full-bleed background in wp_head. |
[ninth_realm_map] |
lat, lng, zoom |
lat="42.515328", lng="-70.893028", zoom="17" |
Renders interactive dark Leaflet map centered on 172 Lafayette Street in Salem with custom glowing skull pin, CSS tile inversion, and Google Maps directions link. |
[ninth_realm_3d_skull] |
None | N/A | Interactive 3D call-to-action skull powered by assets/images/skull_cutout.png and cta-skull.png. Leverages VanillaTilt on desktop and deviceorientation + touch drag on mobile with scroll-linked grayscale and scaling dynamics. |
[ninth_realm_back_to_top] |
None | N/A | Dark stone monolith back-to-top box in lower right corner utilizing assets/images/skull_cutout.png, cracked stone texture overlay, violent rattle shake on hover/tap, and smooth window scrolling. |
[wcw_copyright] |
business_name |
business_name=bloginfo('name') |
Dynamic copyright footer. Employs lunar epoch math based on Jan 6, 2000 to dynamically render current astronomical moon phase emoji (🌑🌒🌓🌔🌕🌖🌗🌘). |
forminator_field_hidden_field_value |
$value, $saved_value, $field, $form_id |
Hook Filter | Intercepts Forminator hidden fields matching artist or artist_name and injects the resident artist currently rendered on screen. |
forminator_cform_render_fields |
$wrappers, $model_id |
Hook Filter | Locates select fields styled with dynamic-artist-select and dynamically populates options with all resident and active guest artists. |
save_post_resident_artist |
$post_id |
Hook Action | Auto-generates Page from "Artist Template", copies builder post meta, and appends the new page into the primary nav menu before "Guest Artists". |