diff --git a/docs/outputs.md b/docs/outputs.md index 86093136..446fc9ef 100644 --- a/docs/outputs.md +++ b/docs/outputs.md @@ -3,9 +3,22 @@ One of the main motivations for ReadAlong-Studio was to provide a one-stop-shop for audio/text alignment. With that in mind, there are a variety of different output formats that can be created. Here are a few: -## Web Component +## Simple web deployment -The standard output from ReadAlong-Studio consists of 1) a ReadALong file (XML) and 2) an audio file, +The default output generated by the CLI's `readalongs align` command and the `www` folder included in the Web Bundle download format from the [Web App](../web-app) include everything you need to host your ReadAlong on your own server. + +Copy the whole folder with all its contents to your web server, and that should work as is on most web servers. The `index.html` provided will generate a page that shows only your readalong. + +The elements of the `index.html` can also be copied into a larger page with other contents, or multiple readalongs -- see [Web Component details](#web-component-details) below. + +## WordPress deployment + +Deploying to WordPress requires our [wordpress plugin](https://github.com/ReadAlongs/Studio-Web/tree/main/packages/web-component/wordpress-plugin) and the snippet generated by our Web or CLI app, which is included in the `readme.txt` file generated in each Web Bundle from the Web App, or in your output folder from the CLI. + +## Web Component details + +The standard output from ReadAlong-Studio consists of 1) a `.readalong` file in XML, 2) an audio file, +3) optional image assets, and 4) a sample index.html file bringing it all together, which you can mobilize to the web or hybrid mobile apps quickly and painlessly. This is done using the ReadAlong WebComponent. Web components are re-useable, custom-defined HTML elements that you can embed in any HTML, regardless of which @@ -25,12 +38,13 @@ Below is an example of a minimal implementation in a basic standalone html page. +