Add example for embedding Afform

docs/afform/overview.md

@@ -10,9 +10,30 @@ automatically appear on the dashboard or contact summary screen. Afforms can be
 other Afforms simply by including the directive for one Afform in the markup of another; Angular
 dependencies will be resolved automatically.
 
+### Embedding in Smarty Templates
+
+*Adding Afforms to traditional Smarty-based pages or forms can be a transitional step away from legacy screens*
+
+**PHP Code**
+```php
+Civi::service('angularjs.loader')
+  ->addModules('afformMyForm');
+
+$this->assign('myAfformVars', $optionalVars);
+```
+
+**Template Code**
+```
+<crm-angular-js modules="afformMyForm">
+  <form id="bootstrap-theme">
+    <afform-my-form options='{$myAfformVars|@json_encode}'></afform-my-form>
+  </form>
+</crm-angular-js>
+```
+
 ## Afform Types
 
 - **form**: A form which submits through the `Afform::submit` api, editable in the form-builder GUI.
 - **block**: A snippet meant to be incorporated into a larger form.
 - **system** (default): Non-editable forms.
-- **search**: An afform with an embedded [SearchKit Display](../searchkit/displays.md) and optional search filter fields.
\ No newline at end of file
+- **search**: An afform with an embedded [SearchKit Display](../searchkit/displays.md) and optional search filter fields.