Update web/templates/search.html

web/templates/search.html

@@ -41,6 +41,37 @@
     </div>
   </div>
 
+    <!-- Test Help Dropdown -->
+  <div class="search-help">
+    <button class="help-toggle" type="button" onclick="this.nextElementSibling.classList.toggle('open')">
+      ❓ Instructions for Use
+    </button>
+    <div class="help-content">
+      <h3>How to Use Search Operators</h3>
+      <ul>
+        <li><strong>Simple keyword</strong> — type any word to find entries that contain it.<br>
+            <em>Example:</em> <code>faith</code></li>
+
+        <li><strong>Phrase search</strong> — put quotes around a phrase to match it exactly.<br>
+            <em>Example:</em> <code>"Jehovah is my shepherd"</code></li>
+
+        <li><strong>OR search</strong> — use <code>OR</code> (uppercase) to match any of several terms.<br>
+            <em>Example:</em> <code>love OR kindness</code></li>
+
+        <li><strong>Exclude terms</strong> — use a minus sign to remove results containing a word.<br>
+            <em>Example:</em> <code>hope -future</code></li>
+
+        <li><strong>Wildcard search</strong> — use <code>*</code> to replace part of a word.<br>
+            <em>Example:</em> <code>lov*</code> finds <code>love</code>, <code>loved</code>, <code>loving</code></li>
+
+        <li><strong>Scripture search</strong> — type a Bible book or abbreviation to find entries that reference it.<br>
+            <em>Example:</em> <code>John 3:16</code></li>
+      </ul>
+      <p><strong>Tip:</strong> You can combine these for powerful searches.<br>
+         <em>Example:</em> <code>"good shepherd" OR "faithful servant" -parable</code></p>
+    </div>
+  </div>
+
   <form method="get" class="search-form">
     <div class="search-row">
       <input type="text" name="q" value="{{ q }}" placeholder="Type to search…" class="search-input" autofocus>