Move main observer element to action hook

404.php

@@ -18,8 +18,6 @@ get_header( null, array( 'no_index' => 1 ) );
 
 <main id="main" class="main singular the-404">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', '404' ); ?>
 
   <div class="main__wrapper">

ACTIONS.md

@@ -674,12 +674,13 @@ Fires before the content of the card grid is rendered in the `partials/_card-sto
 ---
 
 ### `do_action( 'fictioneer_main', $context )`
-Fires after opening the site’s `<main>` container, right after the `.main-observer` element.
+Fires after opening the site’s `<main>` container.
 
 **Parameters:**
-* $context (string|null) – Context of the action call. Unsafe.
+* $context (string|null) – Context of the action call, typically related to the template. Unsafe.
 
 **Hooked Actions:**
+* `fictioneer_main_observer()` – Renders the main observer element. Priority 1.
 * `fictioneer_page_background()` – Renders the page background. Priority 10.
 
 ---

author.php

@@ -93,8 +93,6 @@ get_header();
 
 <main id="main" class="main author-page singular">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'author' ); ?>
 
   <div class="main__wrapper">

category.php

@@ -16,8 +16,6 @@ get_header();
 
 <main id="main" class="main archive category-archive">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'category-archive' ); ?>
 
   <div class="main__wrapper">

chapters.php

@@ -93,8 +93,6 @@ get_header();
 
 <main id="main" class="main singular chapters">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'chapters' ); ?>
 
   <div class="main__wrapper">

collections.php

@@ -53,8 +53,6 @@ get_header();
 
 <main id="main" class="main singular collections">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'collections' ); ?>
 
   <div class="main__wrapper">

includes/functions/_helpers-templates.php

@@ -2049,7 +2049,20 @@ function fictioneer_get_story_changelog( $story_id ) {
 // =============================================================================
 
 /**
- * Render the page background element
+ * Renders the main observer element
+ *
+ * @since 5.20.0
+ *
+ * @param string|null $context  Optional. Context of the function call.
+ */
+
+function fictioneer_main_observer( $context = null ) {
+  echo '<div class="observer main-observer"></div>';
+}
+add_action( 'fictioneer_main', 'fictioneer_main_observer', 1 );
+
+/**
+ * Renders the page background element
  *
  * Note: The page background is a separate element, absolute positioned under the
  * actual content. This allows for quite some CSS shenanigans and can improve the

index.php

@@ -19,8 +19,6 @@ get_header();
 
 <main id="main" class="main index">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main' ); ?>
 
   <div class="main__wrapper"><?php

recommendations.php

@@ -53,8 +53,6 @@ get_header();
 
 <main id="main" class="main singular recommendations">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'recommendations' ); ?>
 
   <div class="main__wrapper">

search.php

@@ -69,8 +69,6 @@ get_header();
 
 <main id="main" class="main search-results">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'search' ); ?>
 
   <div class="main__wrapper">

single-fcn_chapter.php

@@ -32,8 +32,6 @@ get_header(
 
 <main id="main" class="main chapter">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'chapter' ); ?>
 
   <div class="main__wrapper">

single-fcn_collection.php

@@ -22,8 +22,6 @@ get_header( null, array( 'type' => 'fcn_collection' ) );
 
 <main id="main" class="main collection">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'collection' ); ?>
 
   <div class="main__wrapper">

single-fcn_recommendation.php

@@ -21,8 +21,6 @@ get_header( null, array( 'type' => 'fcn_recommendation' ) );
 
 <main id="main" class="main recommendation">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'recommendation' ); ?>
 
   <div class="main__wrapper">

single-fcn_story.php

@@ -29,8 +29,6 @@ get_header(
 
 <main id="main" class="main story <?php echo get_option( 'fictioneer_enable_checkmarks' ) ? '' : '_no-checkmarks'; ?>">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'story' ); ?>
 
   <div class="main__wrapper _no-padding-top">

single-post.php

@@ -18,8 +18,6 @@ get_header();
 
 <main id="main" class="main post">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'post' ); ?>
 
   <div class="main__wrapper">

singular-bookmarks.php

@@ -26,8 +26,6 @@ get_header( null, array( 'no_index' => 1 ) );
 
 <main id="main" class="main singular bookmarks-page">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-bookmarks' ); ?>
 
   <div class="main__wrapper">

singular-bookshelf-ajax.php

@@ -70,8 +70,6 @@ get_header( null, array( 'no_index' => 1 ) );
 
 <main id="main" class="main singular bookshelf">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-bookmarks-ajax' ); ?>
 
   <div class="main__wrapper">

singular-bookshelf.php

@@ -86,8 +86,6 @@ get_header( null, array( 'no_index' => 1 ) );
 
 <main id="main" class="main singular bookshelf">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-bookshelf' ); ?>
 
   <div class="main__wrapper">

singular-canvas-main.php

@@ -18,8 +18,6 @@ get_header();
 
 <main id="main" class="canvas">
 
-  <div class="observer main-observer"></div>
-
   <?php
     while ( have_posts() ) {
       the_post();

singular-canvas-page.php

@@ -18,8 +18,6 @@ get_header();
 
 <main id="main" class="main canvas">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-canas-page' ); ?>
 
   <div class="main__wrapper">

singular-canvas-site.php

@@ -18,8 +18,6 @@ get_header( null, array( 'blank' => 1 ) );
 
 <main id="main" class="canvas">
 
-  <div class="observer main-observer"></div>
-
   <?php
     while ( have_posts() ) {
       the_post();

singular-index-advanced.php

@@ -78,8 +78,6 @@ reset( $sorted_stories );
 
 <main id="main" class="main singular index">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-index-advanced' ); ?>
 
   <div class="main__wrapper">

singular-index.php

@@ -74,8 +74,6 @@ reset( $sorted_stories );
 
 <main id="main" class="main singular index">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-index' ); ?>
 
   <div class="main__wrapper">

singular-story.php

@@ -26,8 +26,6 @@ get_header();
 
 <main id="main" class="main singular">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-story' ); ?>
 
   <div class="main__wrapper <?php echo $render_story_header ? '_no-padding-top' : ''; ?>">

singular-taxonomies.php

@@ -59,8 +59,6 @@ get_header();
 
 <main id="main" class="main singular">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-taxonomies' ); ?>
 
   <div class="main__wrapper">

singular-titleless.php

@@ -19,8 +19,6 @@ get_header();
 
 <main id="main" class="main singular">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular-titleless' ); ?>
 
   <div class="main__wrapper">

singular.php

@@ -19,8 +19,6 @@ get_header();
 
 <main id="main" class="main singular">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'singular' ); ?>
 
   <div class="main__wrapper">

stories.php

@@ -100,8 +100,6 @@ get_header();
 
 <main id="main" class="main singular stories">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'stories' ); ?>
 
   <div class="main__wrapper">

tag.php

@@ -17,8 +17,6 @@ get_header();
 
 <main id="main" class="main archive tag-archive">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'tag-archive' ); ?>
 
   <div class="main__wrapper">

taxonomy-fcn_character.php

@@ -16,8 +16,6 @@ get_header();
 
 <main id="main" class="main archive character-archive">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'character-archive' ); ?>
 
   <div class="main__wrapper">

taxonomy-fcn_content_warning.php

@@ -16,8 +16,6 @@ get_header();
 
 <main id="main" class="main archive content-warning-archive">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'content-warning-archive' ); ?>
 
   <div class="main__wrapper">

taxonomy-fcn_fandom.php

@@ -16,8 +16,6 @@ get_header();
 
 <main id="main" class="main archive fandom-archive">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'fandom-archive' ); ?>
 
   <div class="main__wrapper">

taxonomy-fcn_genre.php

@@ -16,8 +16,6 @@ get_header();
 
 <main id="main" class="main archive genre-archive">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'genre-archive' ); ?>
 
   <div class="main__wrapper">

user-profile.php

@@ -62,8 +62,6 @@ get_header( null, array( 'type' => 'user-profile', 'no_index' => 1 ) );
 
 <main id="main" class="main singular profile">
 
-  <div class="observer main-observer"></div>
-
   <?php do_action( 'fictioneer_main', 'user-profile' ); ?>
 
   <div class="main__wrapper">