Moving the OG to SEO thing.

admin/bando/Components.svelte

@@ -27,7 +27,7 @@
   import Markdown from "$/client/components/Markdown.svelte";
   import MarkdownDemo from "./demos/Markdown.svelte";
   import Modal from "./demos/Modal.svelte";
-  import OGPreview from "./demos/OGPreview.svelte";
+  import SEOTricks from "./demos/SEOTricks.svelte";
   import Pagination from "./demos/Pagination.svelte";
   import PlaceHolder from "./demos/PlaceHolder.svelte";
   import Progress from "./demos/Progress.svelte";
@@ -79,7 +79,7 @@
       {title: "Login", active: false, icon: "log-in", component: Login},
       {title: "Markdown", active: false, icon: "file", component: MarkdownDemo},
       {title: "Modal", active: false, icon: "maximize", component: Modal},
-      {title: "OGPreview", active: false, icon: "external-link", component: OGPreview},
+      {title: "SEOTricks", active: false, icon: "external-link", component: SEOTricks},
       {title: "Pagination", active: false, icon: "skip-forward", component: Pagination},
       {title: "PlaceHolder", active: false, icon: "image", component: PlaceHolder},
       {title: "Progress", active: false, icon: "thermometer", component: Progress},

admin/bando/demos/SEOTricks.svelte

@@ -1,12 +1,12 @@
 <script>
-  import OGPreview from "$/client/components/OGPreview.svelte";
+  import SEOTricks from "$/client/components/SEOTricks.svelte";
   import { base_host } from "$/client/config.js";
 
   let og = {
     "title": "LJSTHW OG Card Test", // title of the article
     "description": "A simple test of the OG style of sharing cards.", // description for inside preview
     "image": `${ base_host }/images/zed.png`, // image to display, 5mb/1200/627 max
-    "url": `${ base_host }/client/#/bando/demos/OGPreview`, // URL to article
+    "url": `${ base_host }/client/#/bando/demos/SEOTricks`, // URL to article
     "type": "website", // not mentioned on linked in but needed
   }
 
@@ -21,7 +21,7 @@
   }
 </script>
 
-<OGPreview og={ og } twitter={ twitter} />
+<SEOTricks og={ og } twitter={ twitter} />
 
 <style>
   card {

admin/bando/demos/SEOTricks.svelte.md

@@ -15,13 +15,13 @@ Svelte:Head Sort-of-Bug
 
 One thing to keep in mind is if you place these `<meta>` tags directly in a page then they'll get duplicated on each page visit.  This is because Svelte is updating the DOM for the page, but seems to not consider the `<svelte:head>` as idempotent as other elements in the DOM.  The fix is to move all uses of `<svelte:head>` into a component so Svelte properly updates them on page changes.
 
-The code for `OGPreview.svelte` does this, which means you *do not* put it into a `<svelte:head>`.  Instead you do this:
+The code for `SEOTricks.svelte` does this, which means you *do not* put it into a `<svelte:head>`.  Instead you do this:
 
 <pre><code data-language="javascript">
-&lt;OGPreview og={ og } twitter={ twitter} />
+&lt;SEOTricks og={ og } twitter={ twitter} />
 </code></pre>
 
-Then `OGPreview` does everything for you.  If you run into this bug in your own development use the `client/components/HeaderOnce.svelte` component like this:
+Then `SEOTricks` does everything for you.  If you run into this bug in your own development use the `client/components/HeaderOnce.svelte` component like this:
 
 ```
 <HeaderOnce>