diff --git a/README.md b/README.md index 86e5d992..c0a463d5 100644 --- a/README.md +++ b/README.md @@ -35,7 +35,7 @@ To start server use: ```bash # Use SOURCE_EDITOR_URL variable to point to speciffic dashboard url. By default, SOURCE_EDITOR_URL=https://editor.flotiq.com is used. bash .github/scripts/get-plugins-docs.sh # Pull dynamically generated plugin docs. -mkdocs serve # Start devlopment server +mkdocs serve # Start devlopment server. Use --dirtyreload option to speed up reloading, but be aware, that this might break navigation on the preview. ``` After that, the documentation should be available on http://localhost:4000. diff --git a/docs/API/dynamic-content-api.md b/docs/API/dynamic-content-api.md index a5901ea5..f8ec2611 100644 --- a/docs/API/dynamic-content-api.md +++ b/docs/API/dynamic-content-api.md @@ -19,7 +19,7 @@ Part of the Content API are the beautiful API docs, along with code samples to s There are 3 important parts of the API documentation that Flotiq provides for you: -![](images/dynamic-content-api-docs.png) +![](images/dynamic-content-api-docs-annotated.png){: .border} 1. Every time you create a Content Type Definition - your API is extended with endpoints that support this new Content Type. 2. The descriptions of these endpoints contain all the information regarding the structure and constraints of the Content Type you defined. @@ -45,6 +45,6 @@ We currently support the following SDKs: In a similar fashion - we also provide a downloadable Postman collection, which fully describes your entire Content API. -![](images/postman.jpeg) +![](images/postman.jpeg){: .border} Read more on how to configure Postman to work with Flotiq in [API access → Postman](../#postman) diff --git a/docs/API/generate-package.md b/docs/API/generate-package.md index d5628123..a7fa4d7d 100644 --- a/docs/API/generate-package.md +++ b/docs/API/generate-package.md @@ -7,7 +7,7 @@ description: Flotiq provides SDKs, or client libraries, to access your Content, On your Flotiq dashboard, you can find links to download client libraries (SDK packages) for several frameworks and languages. -![Available frameworks and languages](images/frameworkslogos.png) +![Available frameworks and languages](images/frameworkslogos.png){: .width25 .center .border} Currently supported generators are: diff --git a/docs/API/generate-package/sdk-nodejs.md b/docs/API/generate-package/sdk-nodejs.md index a98d22c0..d22ec405 100644 --- a/docs/API/generate-package/sdk-nodejs.md +++ b/docs/API/generate-package/sdk-nodejs.md @@ -7,7 +7,7 @@ description: Flotiq provides SDK NodeJS to access your Content. On your Flotiq dashboard, you can find link to download client library SDK NodeJS. -![Available frameworks and languages](../images/frameworkslogos-nodejs.png) +![Available frameworks and languages](../images/frameworkslogos-nodejs.png){: .width25 .center .border} These package is automatically generated every time you modify your Content Type definitions, just like your API documentation. diff --git a/docs/API/images/api-keys-menu.png b/docs/API/images/api-keys-menu.png new file mode 100644 index 00000000..3e0c2efa Binary files /dev/null and b/docs/API/images/api-keys-menu.png differ diff --git a/docs/API/images/api-keys.png b/docs/API/images/api-keys.png index b794b622..087d605d 100644 Binary files a/docs/API/images/api-keys.png and b/docs/API/images/api-keys.png differ diff --git a/docs/API/images/api-keys_1.png b/docs/API/images/api-keys_1.png index b830fa30..2fbcf37d 100644 Binary files a/docs/API/images/api-keys_1.png and b/docs/API/images/api-keys_1.png differ diff --git a/docs/API/images/api-keys_2.png b/docs/API/images/api-keys_2.png index e03456a5..e0701742 100644 Binary files a/docs/API/images/api-keys_2.png and b/docs/API/images/api-keys_2.png differ diff --git a/docs/API/images/api-keys_3.png b/docs/API/images/api-keys_3.png index 7f422107..6729c176 100644 Binary files a/docs/API/images/api-keys_3.png and b/docs/API/images/api-keys_3.png differ diff --git a/docs/API/images/api-keys_4.png b/docs/API/images/api-keys_4.png index 8bac61e1..938b6f17 100644 Binary files a/docs/API/images/api-keys_4.png and b/docs/API/images/api-keys_4.png differ diff --git a/docs/API/images/datasource/datasource-page-picker.png b/docs/API/images/datasource/datasource-page-picker.png deleted file mode 100644 index e1997e86..00000000 Binary files a/docs/API/images/datasource/datasource-page-picker.png and /dev/null differ diff --git a/docs/API/images/datasource/datasource-page-result.png b/docs/API/images/datasource/datasource-page-result.png deleted file mode 100644 index 2545aeb2..00000000 Binary files a/docs/API/images/datasource/datasource-page-result.png and /dev/null differ diff --git a/docs/API/images/datasource/datasource-page-usage.png b/docs/API/images/datasource/datasource-page-usage.png deleted file mode 100644 index a71a7732..00000000 Binary files a/docs/API/images/datasource/datasource-page-usage.png and /dev/null differ diff --git a/docs/API/images/datasource/datasource-page.png b/docs/API/images/datasource/datasource-page.png deleted file mode 100644 index 6b38f6dc..00000000 Binary files a/docs/API/images/datasource/datasource-page.png and /dev/null differ diff --git a/docs/API/images/dynamic-content-api-docs-annotated.png b/docs/API/images/dynamic-content-api-docs-annotated.png new file mode 100644 index 00000000..0f073e35 Binary files /dev/null and b/docs/API/images/dynamic-content-api-docs-annotated.png differ diff --git a/docs/API/images/dynamic-content-api-docs.png b/docs/API/images/dynamic-content-api-docs.png index 61a0a360..d32cf834 100644 Binary files a/docs/API/images/dynamic-content-api-docs.png and b/docs/API/images/dynamic-content-api-docs.png differ diff --git a/docs/API/images/edit-content-type-definitions.png b/docs/API/images/edit-content-type-definitions.png deleted file mode 100644 index 0b408130..00000000 Binary files a/docs/API/images/edit-content-type-definitions.png and /dev/null differ diff --git a/docs/API/images/example-response.png b/docs/API/images/example-response.png deleted file mode 100644 index 398fc681..00000000 Binary files a/docs/API/images/example-response.png and /dev/null differ diff --git a/docs/API/images/flotiq.png b/docs/API/images/flotiq.png deleted file mode 100644 index 7463823b..00000000 Binary files a/docs/API/images/flotiq.png and /dev/null differ diff --git a/docs/API/images/frameworkslogos-nodejs.png b/docs/API/images/frameworkslogos-nodejs.png index db0deed5..a23baa90 100644 Binary files a/docs/API/images/frameworkslogos-nodejs.png and b/docs/API/images/frameworkslogos-nodejs.png differ diff --git a/docs/API/images/frameworkslogos.png b/docs/API/images/frameworkslogos.png index 8b331e8b..801aede0 100644 Binary files a/docs/API/images/frameworkslogos.png and b/docs/API/images/frameworkslogos.png differ diff --git a/docs/API/images/personalizacja.jpg b/docs/API/images/personalizacja.jpg deleted file mode 100644 index 522d56a6..00000000 Binary files a/docs/API/images/personalizacja.jpg and /dev/null differ diff --git a/docs/API/images/personalizacja2.jpg b/docs/API/images/personalizacja2.jpg deleted file mode 100644 index e161caf6..00000000 Binary files a/docs/API/images/personalizacja2.jpg and /dev/null differ diff --git a/docs/API/images/personalizacja3.jpg b/docs/API/images/personalizacja3.jpg deleted file mode 100644 index 8120a529..00000000 Binary files a/docs/API/images/personalizacja3.jpg and /dev/null differ diff --git a/docs/API/images/small_logo.png b/docs/API/images/small_logo.png deleted file mode 100644 index 41149687..00000000 Binary files a/docs/API/images/small_logo.png and /dev/null differ diff --git a/docs/API/images/user-profile.png b/docs/API/images/user-profile.png deleted file mode 100644 index e2184bb4..00000000 Binary files a/docs/API/images/user-profile.png and /dev/null differ diff --git a/docs/API/index.md b/docs/API/index.md index 5e012be4..114099de 100644 --- a/docs/API/index.md +++ b/docs/API/index.md @@ -3,9 +3,9 @@ All API endpoints that are published in Flotiq are currently using an API-key authorization method. -There are two types of API keys - [Application Keys](#application-api-keys) and [User Defined Keys](#user-defined-api-keys). Both types of keys can be retrieved from the API Keys page in the Flotiq Panel (click on your avatar to open the menu): +There are two types of API keys - [Application Keys](#application-api-keys) and [User Defined Keys](#user-defined-api-keys). Both types of keys can be retrieved from the API Keys page in the Flotiq Panel: -![](images/user-profile.png){: .center .border} +![](images/api-keys-menu.png){: .center .width25 .border} All keys restrict access to not only CRUD of the Content Objects, but also to their hydration and search; the same restrictions apply to GraphQL endpoint. diff --git a/docs/API/workflow/content-publishing-workflow.md b/docs/API/workflow/content-publishing-workflow.md index 557b9075..ca0c16b7 100644 --- a/docs/API/workflow/content-publishing-workflow.md +++ b/docs/API/workflow/content-publishing-workflow.md @@ -44,7 +44,7 @@ Custom workflows can be defined in Flotiq, for example a simple editorial workfl with the following possible transitions -![](./images/publishing-workflow.svg) +![](./images/publishing-workflow.svg){: .center} can be used to help teams curate content, manage publication and archiving of content. diff --git a/docs/Deep-Dives/Building-a-blog-in-3-minutes.md b/docs/Deep-Dives/Building-a-blog-in-3-minutes.md index 13ec4d71..b8ce45fe 100644 --- a/docs/Deep-Dives/Building-a-blog-in-3-minutes.md +++ b/docs/Deep-Dives/Building-a-blog-in-3-minutes.md @@ -14,7 +14,7 @@ First off - you will need to define how your content will be structured in Floti We labeled the new Content Type `Blog Post` and gave it an API name `blogpost`. Once you do that - you'll have to add the properties that will be defined for each of the entries. The `Add property` button will open a form, where you will define the characteristics of each of the fields (like if it's required, what kind of a field it is, etc.): -![](images/building-a-blog-in-3-minutes/3-minute-blog-content-type-title-field.png){: .center .width75 } +![](../panel/images/AddContentTypeDefinitionsTitle.png) Here are the details of the fields we added for this tutorial: @@ -29,13 +29,13 @@ Here are the details of the fields we added for this tutorial: and this is how the Content Type Editor should look like in the end: -![](images/building-a-blog-in-3-minutes/3-minute-blog-content-type-all-fields.png){: .center .width75 } +![](../panel/images/AddContentTypeDefinitions.png) If you're happy with the result - click the `Save` button and navigate to `Content` → `Blog Posts` in the side menu. !!! hint At this point you can also verify the result of your work in the [Dynamic Content API](../API/dynamic-content-api.md) - head to you API docs and see how the API has automatically expanded to support your new Content Type: - ![](images/building-a-blog-in-3-minutes/3-minute-blog-content-api.png) + ![](../API/images/dynamic-content-api-docs.png) Three important things to note here: @@ -52,7 +52,7 @@ If you're happy with the result - click the `Save` button and navigate to `Conte It's now time to write your first post! The first time you go to the `Blog Posts` item in the `Content` menu you will be prompted with a screen encouraging to create your first Content Object, go ahead and click the `Add new Blog Post object` button. You will see an empty form that is automatically generated based on the Content Type Definition you provided in the previous step. Fill it in, however you like! -![](images/building-a-blog-in-3-minutes/3-minute-blog-first-post.png){: .center .width75 } +![](../panel/images/AddBlogPost.png){: .border } That's it. Now make sure you have your [read-only API key](../API/index.md) in your clipboard! diff --git a/docs/Deep-Dives/images/add-ctd-1.png b/docs/Deep-Dives/images/add-ctd-1.png deleted file mode 100644 index 4c61c236..00000000 Binary files a/docs/Deep-Dives/images/add-ctd-1.png and /dev/null differ diff --git a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-api.png b/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-api.png deleted file mode 100644 index bf15fc5d..00000000 Binary files a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-api.png and /dev/null differ diff --git a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-type-all-fields.png b/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-type-all-fields.png deleted file mode 100644 index 5c39a6ad..00000000 Binary files a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-type-all-fields.png and /dev/null differ diff --git a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-type-title-field.png b/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-type-title-field.png deleted file mode 100644 index da74c9aa..00000000 Binary files a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-content-type-title-field.png and /dev/null differ diff --git a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-first-post.png b/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-first-post.png deleted file mode 100644 index 74b2fead..00000000 Binary files a/docs/Deep-Dives/images/building-a-blog-in-3-minutes/3-minute-blog-first-post.png and /dev/null differ diff --git a/docs/Deep-Dives/images/cloudflare-workers-add-script.png b/docs/Deep-Dives/images/cloudflare-workers-add-script.png deleted file mode 100644 index b1a6d1ec..00000000 Binary files a/docs/Deep-Dives/images/cloudflare-workers-add-script.png and /dev/null differ diff --git a/docs/Deep-Dives/images/cloudflare-workers-launch-editor.png b/docs/Deep-Dives/images/cloudflare-workers-launch-editor.png deleted file mode 100644 index 8030ba98..00000000 Binary files a/docs/Deep-Dives/images/cloudflare-workers-launch-editor.png and /dev/null differ diff --git a/docs/Deep-Dives/images/create-definition-recipe.png b/docs/Deep-Dives/images/create-definition-recipe.png deleted file mode 100644 index c6dd07bf..00000000 Binary files a/docs/Deep-Dives/images/create-definition-recipe.png and /dev/null differ diff --git a/docs/Deep-Dives/images/flotiq-blog.png b/docs/Deep-Dives/images/flotiq-blog.png deleted file mode 100644 index 91076cdf..00000000 Binary files a/docs/Deep-Dives/images/flotiq-blog.png and /dev/null differ diff --git a/docs/Deep-Dives/images/jamstack-recipes-complex-data-structures/add-definition-type-recipe.png b/docs/Deep-Dives/images/jamstack-recipes-complex-data-structures/add-definition-type-recipe.png deleted file mode 100644 index 495eca22..00000000 Binary files a/docs/Deep-Dives/images/jamstack-recipes-complex-data-structures/add-definition-type-recipe.png and /dev/null differ diff --git a/docs/Deep-Dives/images/jamstack-recipes-complex-data-structures/recipe-object-scrambled-eggs.png b/docs/Deep-Dives/images/jamstack-recipes-complex-data-structures/recipe-object-scrambled-eggs.png deleted file mode 100644 index 1d41a30c..00000000 Binary files a/docs/Deep-Dives/images/jamstack-recipes-complex-data-structures/recipe-object-scrambled-eggs.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/img-0.jpg b/docs/Deep-Dives/images/metaapi/original-size/img-0.jpg deleted file mode 100644 index 2520ad5b..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/img-0.jpg and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/img-0.png b/docs/Deep-Dives/images/metaapi/original-size/img-0.png deleted file mode 100644 index c858464c..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/img-0.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-1.png b/docs/Deep-Dives/images/metaapi/original-size/meta-1.png deleted file mode 100644 index 8543c807..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-1.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-10.png b/docs/Deep-Dives/images/metaapi/original-size/meta-10.png deleted file mode 100644 index 02a8b8e0..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-10.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-11.png b/docs/Deep-Dives/images/metaapi/original-size/meta-11.png deleted file mode 100644 index be576d56..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-11.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-13.png b/docs/Deep-Dives/images/metaapi/original-size/meta-13.png deleted file mode 100644 index c7774369..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-13.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-14.png b/docs/Deep-Dives/images/metaapi/original-size/meta-14.png deleted file mode 100644 index f69c5f43..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-14.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-15.png b/docs/Deep-Dives/images/metaapi/original-size/meta-15.png deleted file mode 100644 index 5d5ac461..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-15.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-16.png b/docs/Deep-Dives/images/metaapi/original-size/meta-16.png deleted file mode 100644 index 7448dbe3..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-16.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-17.png b/docs/Deep-Dives/images/metaapi/original-size/meta-17.png deleted file mode 100644 index 9272fa65..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-17.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-17a.png b/docs/Deep-Dives/images/metaapi/original-size/meta-17a.png deleted file mode 100644 index 740fda33..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-17a.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-18.png b/docs/Deep-Dives/images/metaapi/original-size/meta-18.png deleted file mode 100644 index f163b155..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-18.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-2.png b/docs/Deep-Dives/images/metaapi/original-size/meta-2.png deleted file mode 100644 index 58a1a6b8..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-2.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-3.png b/docs/Deep-Dives/images/metaapi/original-size/meta-3.png deleted file mode 100644 index 2e219d45..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-3.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-4.png b/docs/Deep-Dives/images/metaapi/original-size/meta-4.png deleted file mode 100644 index 8d46b6a9..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-4.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-5.png b/docs/Deep-Dives/images/metaapi/original-size/meta-5.png deleted file mode 100644 index ce1e3e3d..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-5.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-6.png b/docs/Deep-Dives/images/metaapi/original-size/meta-6.png deleted file mode 100644 index dba79e74..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-6.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-7.png b/docs/Deep-Dives/images/metaapi/original-size/meta-7.png deleted file mode 100644 index 206be15a..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-7.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-8.png b/docs/Deep-Dives/images/metaapi/original-size/meta-8.png deleted file mode 100644 index a279c937..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-8.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-9.png b/docs/Deep-Dives/images/metaapi/original-size/meta-9.png deleted file mode 100644 index 2d205083..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-9.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-about.png b/docs/Deep-Dives/images/metaapi/original-size/meta-about.png deleted file mode 100644 index bbea5de7..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-about.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-1.png b/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-1.png deleted file mode 100644 index 4330ecf7..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-1.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-2.png b/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-2.png deleted file mode 100644 index 03c45250..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-2.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-3.png b/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-3.png deleted file mode 100644 index 61951fec..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-3.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-4.png b/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-4.png deleted file mode 100644 index bece9252..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-flotiq-4.png and /dev/null differ diff --git a/docs/Deep-Dives/images/metaapi/original-size/meta-spr-1.png b/docs/Deep-Dives/images/metaapi/original-size/meta-spr-1.png deleted file mode 100644 index e9acf144..00000000 Binary files a/docs/Deep-Dives/images/metaapi/original-size/meta-spr-1.png and /dev/null differ diff --git a/docs/Deep-Dives/images/mobile-expo-product-showcase-1.png b/docs/Deep-Dives/images/mobile-expo-product-showcase-1.png deleted file mode 100644 index 00f42711..00000000 Binary files a/docs/Deep-Dives/images/mobile-expo-product-showcase-1.png and /dev/null differ diff --git a/docs/Deep-Dives/images/mobile-expo-product-showcase-2.png b/docs/Deep-Dives/images/mobile-expo-product-showcase-2.png deleted file mode 100644 index e2e5e7d0..00000000 Binary files a/docs/Deep-Dives/images/mobile-expo-product-showcase-2.png and /dev/null differ diff --git a/docs/Deep-Dives/images/mobile-expo-product-showcase-3.png b/docs/Deep-Dives/images/mobile-expo-product-showcase-3.png deleted file mode 100644 index aebf7108..00000000 Binary files a/docs/Deep-Dives/images/mobile-expo-product-showcase-3.png and /dev/null differ diff --git a/docs/Deep-Dives/images/mobile-expo-product-showcase/create-api-key.png b/docs/Deep-Dives/images/mobile-expo-product-showcase/create-api-key.png deleted file mode 100644 index 17b0e48c..00000000 Binary files a/docs/Deep-Dives/images/mobile-expo-product-showcase/create-api-key.png and /dev/null differ diff --git a/docs/Deep-Dives/images/mobile-expo-product-showcase/create-product-ctd-2.png b/docs/Deep-Dives/images/mobile-expo-product-showcase/create-product-ctd-2.png deleted file mode 100644 index 7837f9a5..00000000 Binary files a/docs/Deep-Dives/images/mobile-expo-product-showcase/create-product-ctd-2.png and /dev/null differ diff --git a/docs/Deep-Dives/images/mobile-expo-product-showcase/create-product-ctd.png b/docs/Deep-Dives/images/mobile-expo-product-showcase/create-product-ctd.png deleted file mode 100644 index 92b618ca..00000000 Binary files a/docs/Deep-Dives/images/mobile-expo-product-showcase/create-product-ctd.png and /dev/null differ diff --git a/docs/Deep-Dives/images/snipcart-gatsby-demo/flotiq-user-api-key.png b/docs/Deep-Dives/images/snipcart-gatsby-demo/flotiq-user-api-key.png deleted file mode 100644 index 5cc4cc07..00000000 Binary files a/docs/Deep-Dives/images/snipcart-gatsby-demo/flotiq-user-api-key.png and /dev/null differ diff --git a/docs/Deep-Dives/images/snipcart-gatsby-demo/predefined-content-type-definitions.png b/docs/Deep-Dives/images/snipcart-gatsby-demo/predefined-content-type-definitions.png deleted file mode 100644 index 7824e945..00000000 Binary files a/docs/Deep-Dives/images/snipcart-gatsby-demo/predefined-content-type-definitions.png and /dev/null differ diff --git a/docs/Deep-Dives/images/todomvc-react-headless-cms/3a687849-d11c-4772-a696-50d7306b3dbe.png b/docs/Deep-Dives/images/todomvc-react-headless-cms/3a687849-d11c-4772-a696-50d7306b3dbe.png deleted file mode 100644 index eeb732c4..00000000 Binary files a/docs/Deep-Dives/images/todomvc-react-headless-cms/3a687849-d11c-4772-a696-50d7306b3dbe.png and /dev/null differ diff --git a/docs/Deep-Dives/images/todomvc-react-headless-cms/c39442a7-138b-4c71-b63c-925f8224a63f.png b/docs/Deep-Dives/images/todomvc-react-headless-cms/c39442a7-138b-4c71-b63c-925f8224a63f.png deleted file mode 100644 index eeb732c4..00000000 Binary files a/docs/Deep-Dives/images/todomvc-react-headless-cms/c39442a7-138b-4c71-b63c-925f8224a63f.png and /dev/null differ diff --git a/docs/Deep-Dives/jamstack-recipes-website-complex-data-structures.md b/docs/Deep-Dives/jamstack-recipes-website-complex-data-structures.md index 2391c7aa..0f95d5b3 100644 --- a/docs/Deep-Dives/jamstack-recipes-website-complex-data-structures.md +++ b/docs/Deep-Dives/jamstack-recipes-website-complex-data-structures.md @@ -142,7 +142,7 @@ If you'd like to dig a little deeper into this recipe website, here's your quick Create your [Flotiq.com](https://flotiq.com) account. Next, create the `Recipe` Content Type: - ![Recipe content type in flotiq](images/jamstack-recipes-complex-data-structures/add-definition-type-recipe.png){: .center .width75 .border} + ![Recipe content type in flotiq](../panel/images/definition-builder-create-recipe.png){: .center .width75 .border} _Note: You can also create `Recipe` using [Flotiq REST API](https://flotiq.com/docs/API/)._ diff --git a/docs/Deep-Dives/mobile-expo-product-showcase.md b/docs/Deep-Dives/mobile-expo-product-showcase.md index 6798dc4f..45e402f5 100644 --- a/docs/Deep-Dives/mobile-expo-product-showcase.md +++ b/docs/Deep-Dives/mobile-expo-product-showcase.md @@ -89,10 +89,10 @@ The screen you will see allows you to connect with your Flotiq account, but we w Now it's time to create the Content Type definition in the Flotiq. You can use our predefined types to speed up the modelling process. You can update the Content Type definition in further development. -Go to the Content Type definitions tab and choose `Products`. +Go to the Content Type definitions tab and choose `Product`. Save your Content Type definition. Now you can add your products to the Flotiq. -![](images/mobile-expo-product-showcase/create-product-ctd.png){: .border} +![](../panel/images/definition-builder-create-product.png){: .border} ## Code updates diff --git a/docs/Deep-Dives/node-js-ecommerce-snipcart-gatsby-demo.md b/docs/Deep-Dives/node-js-ecommerce-snipcart-gatsby-demo.md index e83ad6a8..70befc76 100644 --- a/docs/Deep-Dives/node-js-ecommerce-snipcart-gatsby-demo.md +++ b/docs/Deep-Dives/node-js-ecommerce-snipcart-gatsby-demo.md @@ -35,7 +35,7 @@ The most crucial step - you have to tell Flotiq what kind of data you want to st When you first log in - it's going to be pretty empty. No content, nothing. Head over to the `Type definitions` screen. -![Predefined Content Type Definitions](images/snipcart-gatsby-demo/predefined-content-type-definitions.png){: .center .border} +![Predefined Content Type Definitions](../panel/images/TypeDefinitionsTiles.png){: .center .width75 .border} Here you find a list of simple boilerplate content types, which are a great start if you're in a hurry. @@ -92,7 +92,7 @@ SNIPCART_API_KEY="YOUR SNIPCART API KEY" You can find your Flotiq API keys in `API Keys` section: -![Flotiq user API key](images/snipcart-gatsby-demo/flotiq-user-api-key.png){: .border} +![Flotiq user API key](../API/images/api-keys-menu.png){: .border .width25 .center} !!! caution We strongly recommend that you create a scoped API key (read more about [API access](../API/index.md)), but for development, you can use the default Read Only key provided in the interface. diff --git a/docs/Flotiq-Mobile-Expo/images/logo-github.png b/docs/Flotiq-Mobile-Expo/images/logo-github.png deleted file mode 100644 index f87b70f4..00000000 Binary files a/docs/Flotiq-Mobile-Expo/images/logo-github.png and /dev/null differ diff --git a/docs/Universe/deployment/images/flotiq-api-keys-button.png b/docs/Universe/deployment/images/flotiq-api-keys-button.png deleted file mode 100644 index 3489c2ac..00000000 Binary files a/docs/Universe/deployment/images/flotiq-api-keys-button.png and /dev/null differ diff --git a/docs/Universe/deployment/images/flotiq-api-keys-gui.png b/docs/Universe/deployment/images/flotiq-api-keys-gui.png deleted file mode 100644 index 8e79bc72..00000000 Binary files a/docs/Universe/deployment/images/flotiq-api-keys-gui.png and /dev/null differ diff --git a/docs/Universe/deployment/netlify-nextjs.md b/docs/Universe/deployment/netlify-nextjs.md index 0f152392..34cd11ee 100644 --- a/docs/Universe/deployment/netlify-nextjs.md +++ b/docs/Universe/deployment/netlify-nextjs.md @@ -84,11 +84,14 @@ The essential two environment variables needed for every Gatsby project are **FL For example, if you're using the [Gatsby and Snipcart starter](https://github.com/flotiq/gatsby-starter-products) you will also provide the Snipcart API key. The project Readme always described the needed variables. -To obtain the Flotiq API key - in your Flotiq account, click your profile icon in the sidebar and go to **API keys**: ![](images/flotiq-api-keys-button.png){: .center .width25 .border} +To obtain the Flotiq API key - in your Flotiq account, click `API keys` in the sidebar: + + ![](../../API/images/api-keys-menu.png){: .center .width25 .border} + You can either select the application-wide read-only key: - ![](images/flotiq-api-keys-gui.png){: .center .width75 .border} + ![](../../API/images/api-keys_1.png){: .center .width75 .border} Or, as a safer option, create a scoped read-only API key that will only be used for the Netlify build. Read more about [Flotiq API access](https://flotiq.com/docs/API/). diff --git a/docs/Universe/deployment/vercel-gatsby.md b/docs/Universe/deployment/vercel-gatsby.md index 139b8084..77af67f4 100644 --- a/docs/Universe/deployment/vercel-gatsby.md +++ b/docs/Universe/deployment/vercel-gatsby.md @@ -102,15 +102,14 @@ The essential environment variable needed for every Gatsby project is **GATSBY_F For example, if you're using the [Gatsby and Snipcart starter](https://github.com/flotiq/gatsby-starter-products) you will also provide the Snipcart API key. The project Readme always describes the needed variables. -To obtain the Flotiq API key - go to your Flotiq account and click your profile icon in the sidebar and go to [API keys](https://editor.flotiq.com/api-keys): +To obtain the Flotiq API key - in your Flotiq account, click `API keys` in the sidebar: - - ![](images/flotiq-api-keys-button.png){: .center .width25 .border} + ![](../../API/images/api-keys-menu.png){: .center .width25 .border} You can either select the application-wide read-only key: - ![](images/flotiq-api-keys-gui.png){: .center .width75 .border} + ![](../../API/images/api-keys_1.png){: .center .width75 .border} Or, as a safer option, create a scoped read-only API key that will only be used for the Vercel build. Read more about [Flotiq API access](https://flotiq.com/docs/API/). diff --git a/docs/Universe/deployment/vercel-nextjs.md b/docs/Universe/deployment/vercel-nextjs.md index 7c0aa91d..b6955938 100644 --- a/docs/Universe/deployment/vercel-nextjs.md +++ b/docs/Universe/deployment/vercel-nextjs.md @@ -101,15 +101,14 @@ The essential two environment variables needed for every Gatsby project are `FLO For example, if you're using the [Gatsby and Snipcart starter](https://github.com/flotiq/gatsby-starter-products) you will also provide the Snipcart API key. The project Readme always described the needed variables. -To obtain the Flotiq API key - in your Flotiq account, click your profile icon in the sidebar and go to `API keys`: +To obtain the Flotiq API key - in your Flotiq account, click `API keys` in the sidebar: - ![](images/flotiq-api-keys-button.png){: .center .width25 .border} + ![](../../API/images/api-keys-menu.png){: .center .width25 .border} You can either select the application-wide read-only key: - - ![](images/flotiq-api-keys-gui.png){: .center .width75 .border} + ![](../../API/images/api-keys_1.png){: .center .width75 .border} Or, as a safer option, create a scoped read-only API key that will only be used for the Vercel build. Read more about [Flotiq API access](https://flotiq.com/docs/API/). diff --git a/docs/Universe/images/gatsby/gatsby-starters.png b/docs/Universe/images/gatsby/gatsby-starters.png index a3b4f4db..0029f683 100644 Binary files a/docs/Universe/images/gatsby/gatsby-starters.png and b/docs/Universe/images/gatsby/gatsby-starters.png differ diff --git a/docs/Universe/images/n8n/add_gmail_node.png b/docs/Universe/images/n8n/add_gmail_node.png deleted file mode 100644 index 45a7f938..00000000 Binary files a/docs/Universe/images/n8n/add_gmail_node.png and /dev/null differ diff --git a/docs/Universe/images/n8n/example_data.png b/docs/Universe/images/n8n/example_data.png deleted file mode 100644 index de1cf10b..00000000 Binary files a/docs/Universe/images/n8n/example_data.png and /dev/null differ diff --git a/docs/Universe/images/n8n/example_data_n8n.png b/docs/Universe/images/n8n/example_data_n8n.png deleted file mode 100644 index ccc1d07e..00000000 Binary files a/docs/Universe/images/n8n/example_data_n8n.png and /dev/null differ diff --git a/docs/Universe/images/n8n/webhook_params.png b/docs/Universe/images/n8n/webhook_params.png deleted file mode 100644 index ed52ec5c..00000000 Binary files a/docs/Universe/images/n8n/webhook_params.png and /dev/null differ diff --git a/docs/Universe/images/nextjs/nextjs-starters.png b/docs/Universe/images/nextjs/nextjs-starters.png index 1d42e721..78163dc5 100644 Binary files a/docs/Universe/images/nextjs/nextjs-starters.png and b/docs/Universe/images/nextjs/nextjs-starters.png differ diff --git a/docs/index.md b/docs/index.md index 89f42205..64fe62db 100644 --- a/docs/index.md +++ b/docs/index.md @@ -36,7 +36,7 @@ There are 2 primary ways to interact with Flotiq: 1. through the [user interface Data model in Flotiq is created by adding one or more Content Type Definitions (we often refer to them as CTDs). CTDs are a key part of the system, where you - the user - describe the content (data model) you will be storing in Flotiq. The [Content Type builder](panel/content-types.md) is the tool we provide for you to easily define your Content Types, using a graphical User Interface. Type Definitions are like classes in object-oriented programming, they describe object properties. -![](panel/images/EditContentTypeDefinitions.png) +![](panel/images/EditContentTypeDefinitions.png){.center .width50 .border} Read more about how to use the Content Type editor in the [Panel docs](panel/content-types.md) diff --git a/docs/panel/Plugins/Gatsby-cloud-integration.md b/docs/panel/Plugins/Gatsby-cloud-integration.md index d4bb7f43..07b3f074 100644 --- a/docs/panel/Plugins/Gatsby-cloud-integration.md +++ b/docs/panel/Plugins/Gatsby-cloud-integration.md @@ -85,7 +85,7 @@ For example, if you're using the [Gatsby and Snipcart starter](https://github.co To obtain the Flotiq API key - in your Flotiq account, click your profile icon in the sidebar and go to `API keys`: -![Access Flotiq API keys](../../API/images/user-profile.png){: .center .width25 .border} +![Access Flotiq API keys](../../API/images/api-keys-menu.png){: .center .width25 .border} You can either select the application-wide read-only key: diff --git a/docs/panel/Plugins/images/netlify/netlify-plugin-settings.png b/docs/panel/Plugins/images/netlify/netlify-plugin-settings.png deleted file mode 100644 index 7df3b6da..00000000 Binary files a/docs/panel/Plugins/images/netlify/netlify-plugin-settings.png and /dev/null differ diff --git a/docs/panel/content-objects.md b/docs/panel/content-objects.md index b216c523..15f3945f 100644 --- a/docs/panel/content-objects.md +++ b/docs/panel/content-objects.md @@ -14,7 +14,7 @@ Click tile on the Type Definitions to go to the content browser page: or entry in the left menu: -![](images/ContentMenu.png){: .center .border} +![](images/ContentMenu.png){: .center .width25 .border} The content browser provides a convenient grid interface to browse and search through large amounts of data quickly. Users can customize the grid according to their preferences: @@ -48,7 +48,7 @@ You can save Content Object only when you insert values in all required fields. Interaction buttons of Content Objects are in the top right corner of the edit screen: -![](images/EditButtons.png){: .center .border} +![](images/co-form/EditButtons.png){: .center .width50 .border} To save and stay on the form, click the `Save` button. @@ -72,7 +72,7 @@ Flotiq does not validate the Markdown code. Markdown controls: -![](images/MarkdownControlHeader.png){: .center .border} +![](images/co-form/markdown/Controls.png){: .center .border .width50} * Full screen - opens the full-screen markdown editor, helpful when editing long texts. * Heading - switch edited line to a heading (`# heading 1`) @@ -101,9 +101,9 @@ For better explanation of markup please refer to [Markup Guide](https://www.mark Rich text control help format text and generates HTML markup. Formatting works similar to MS Word or Google Docs formatting. -Rich text controls: +#### Rich text controls -![](images/RichTextControlHeader.png){: .center .border} +![](images/co-form/richtext/Controls.png){: .center .border .width50} First row: @@ -120,11 +120,7 @@ First row: * Right * Justified * Insert horizontal line - adds a horizontal line -* Add link - adds a link to selected text -* Remove link - removes the link from the text - -Second row: - +* Add/remove link - adds a link to selected text. If selected text is already linked, you can change the options or remove the link * Paragraph format - formats whole paragraph * Normal * Heading 1 @@ -146,26 +142,31 @@ Second row: * Font Size - change size of the selected text * Auto * 8, 9, 10, 11, 12, 14, 16, 18, 20, 22, 24, 26, 28, 36, 48, 72 -* Font color - only few colors are possible - ![](images/RichTextTextColors.png){: .border} +Second row: -* Highlight colour - only a few colours are possible +* Font/background color - ![](images/RichTextHighlightColors.png){: .border} + ![](images/co-form/richtext/ColorControl.png){: .center .border .width25} -* Show blocks - shows boundaries of HTML tags -* Format image - you should use it after adding the image from the Media Library, - to make sure that the image is in the system correctly. +* Image - add image by providing image URL +* Media library - opens Media Library, where you can add new files or select the ones already added - You can add alternative text, change the dimensions, position and border of the image. - You can also add a hyperlink to it by switching to the `Link` tab. - - ![](images/RichTextControlEditImage.png){: .border} +* Link object - opens modal with existing objects. Once object is selected a new span is embeded into the editor HTML. The span contains following attributes: + * `data-relation-object-id` - object id + * `data-relation-object-type` - object type + * `data-relation-url` - object data url + + Note that the span is empty and its up to you to handle it on your page programatically. -* Media library - opens Media Library, where you can add new files or select the ones already added * Display source - shows editable HTML markup of field contents; please change it with caution. +#### Image options + +After image is added, you can double click to format it. You can add alternative text, change the dimensions, position and border of the image. You can also add a hyperlink to it by switching to the `Link` tab. + +![](images/co-form/richtext/ImageProperties.png){: .center .border .width50} + You can make the editor bigger by dragging the grey arrow on the bottom right corner of the control. ### Email @@ -192,7 +193,7 @@ Standard select control. You can choose only one option. Flotiq has two types of relations in the dashboard (they are managed in the same way in the json object): -![](images/Relations.png){: .center .width75 .border} +![](images/co-form/datasource/Relations.png){: .center .width75 .border} If you want to remove the linked object, click the `trash` icon on the object's right side. You can change the order of objects in relation using arrow buttons in the top right corner. @@ -202,13 +203,13 @@ If it is not a Media object, you can edit it by clicking the `pencil` button in You can either open the form for object creation using the `Add new object and link` button: -![](images/BlogPostFormModal.png){: .center .width75 .border} +![](images/co-form/datasource/RelationAddModal.png){: .center .width75 .border} After saving the object, the system automatically links it to the object you are editing/creating right now. Or you can also click the `Link existing object` button and link the object created earlier: -![](images/LinkExistingObject.png){: .center .border} +![](images/co-form/datasource/LinkExistingObject.png){: .center .border} To add the object, click on the desired object and then the `Add` button. You can search and sort objects using the controls on top of the modal. @@ -220,7 +221,7 @@ You can search and sort objects using the controls on top of the modal. The `Open Media Library` button opens Media Library, where you can add new files or select the ones already added. -![](images/MediaLibraryModal.png){: .center .width75 .border} +![](images/co-form/datasource/MediaLibraryModal.png){: .center .width75 .border} To add the media object, click on the desired file and the `Save changes` button. Newly uploaded files are automatically selected; you only need to click the `Save changes` button. @@ -229,27 +230,27 @@ Newly uploaded files are automatically selected; you only need to click the `Sav If the object has a list property, Flotiq generates series of sub-forms with properties described in such list: -![](images/Lists.png){: .center .width75 .border} +![](images/co-form/list/List.png){: .center .width75 .border} To add the new object to the list, click the `Add item` button. You can change the order of objects in the list using the up and down arrow in the top right corner of object form. You can remove the object from the list using the trash icon in the top right corner of the object form. If the list property contains a `list` child property, the nested form will be displayed. -![](images/nested list.png) +![](images/co-form/list/NestedList.png){: .center .width75 .border} ### Geo Control for geolocation points. You can find the address using `Find on map` input or by dragging the marker on the map. You can put the coordinates in `Latitude` and `Longitude` inputs below the map if you know the coordinates without searching. -![](images/GeoControl.png){: .center .width75 .border} +![](images/co-form/geo/GeoControl.png){: .center .width75 .border} ### Date Date control. You can write the date and time or choose them from the popups. -![](images/DateControl.png){: .center .width75 .border} +![](images/co-form/date/DateControl.png){: .center .width75 .border} ### Block @@ -257,49 +258,49 @@ Developers friendly content builder. You can add texts, headers, lists, media, YouTube videos, quotes, warnings and delimiters. The control generates json description of the blocks used. -![](images/BlockControl.gif){: .center .width75 .border} +![](images/co-form/block/AddBlocks.png){: .center .width50 .border} To add the block different from standard text, click the `+` button and choose the block from the controls. Block controls: -![](images/BlockControlHeader.png){: .center .border} +![](images/co-form/block/Controls.png){: .center .border .width25} -You can tune every block by clicking the dots button in the top right corner of the block. +You can tune every block by clicking the dots button after clicking on the block. In all the tune menus, you can move the block up (`arrow up` button), remove the block (`X` button) and move the block down (`arrow down` button). * Text - block for standard paragraph content. - ![](images/BlockControlTextTune.png){: .border} + ![](images/co-form/block/TextTunes.png){: .border .width25 .center} The tunes allow to align the text in the paragraph (left, center and right). You can change the block type by selecting part of the text and opening the convert menu by clicking the `T` button. You can also bold (`B` button) or slant (`i` button) selected text or add a link to it (chain button). - ![](images/BlockControlTextInline.png){: .border} + ![](images/co-form/block/TextConversion.png){: .border .width25 .center} * Heading - block for standard header content. - ![](images/BlockControlHeadingTune.png){: .border} + ![](images/co-form/block/HeaderTunes.png){: .border .width25 .center} The tunes allow to change the level of the header, add an anchor link to it or align the text in the header (left, center and right). You can change the block type by selecting part of the text and opening the convert menu by clicking the `H` button. You can also bold (`B` button) or slant (`i` button) selected text or add a link to it (chain button). - ![](images/BlockControlHeadingInline.png){: .border} + ![](images/co-form/block/HeaderConversion.png){: .border .width25 .center} * List - block for ordered and unordered lists; you can increase the level of the list using tab. - ![](images/BlockControlListTune.png){: .border} + ![](images/co-form/block/ListTunes.png){: .border .width25 .center} The tunes allow changing the type of the list. You can bold (`B` button) or slant (`i` button) text or add a link to it (chain button) by selecting part of the text. - ![](images/BlockControlListInline.png){: .border} + ![](images/co-form/block/ListConversion.png){: .border .width25 .center} * Media - block for files (images, videos, audio, pdf) @@ -308,12 +309,12 @@ remove the block (`X` button) and move the block down (`arrow down` button). You can add a border, stretch or add background to the file in the tunes menu. - ![](images/BlockControlMediaTune.png){: .border} + ![](images/co-form/block/MediaTunes.png){: .border .width25 .center} * YouTube video - block for videos from YouTube; this block has only common tune settings. * Quote - block for quotes with captions - ![](images/BlockControlQuoteTune.png){: .border} + ![](images/co-form/block/QuoteTunes.png){: .border .width25 .center} The tunes allow aligning the text in the quote (left and center). @@ -322,7 +323,7 @@ remove the block (`X` button) and move the block down (`arrow down` button). * Code - block indicating code block; this block has only common tune settings. * Table - block for table - ![](images/BlockControlTableTune.png){: .border} + ![](images/co-form/block/TableTunes.png){: .border .width25 .center} The tunes allow adding information whether the table has header or not. @@ -330,11 +331,11 @@ remove the block (`X` button) and move the block down (`arrow down` button). You can delete the object either by clicking the `Delete` button on the edit object page (in the top right corner): -![](images/EditButtons.png){: .center .border} +![](images/co-form/EditButtons.png){: .center .width50 .border} Or by selecting it on the content browser and clicking the `Remove selected` button: -![](images/ListRemove.png){: .center .border} +![](images/GridBatchDelete.png){: .center .width50 .border} !!! warning You can only remove objects that are not linked to any other object in the system. diff --git a/docs/panel/content-types.md b/docs/panel/content-types.md index 3515ddfd..62d0a135 100644 --- a/docs/panel/content-types.md +++ b/docs/panel/content-types.md @@ -11,8 +11,8 @@ Example: * id – string, unique, required, Flotiq Dashboard adds this automatically * title – string, required, part of the object title * slug – string, unique, required + * excerpt - string, required * content – string, required - * thumbnail - relation to Media type * headerImage - relation to Media type You need an activated account to see the CTD page in the Dashboard. @@ -27,7 +27,7 @@ The Modeler interacts with the ``/api/v1/internal/contenttype`` endpoint on beha Click `Type definitions` in the menu on the left to get to CTDs list: -![](images/TypeDefinitionsMenu.png){: .center .border} +![](images/TypeDefinitionsMenu.png){: .center .width25 .border} If you don't have any Content Types defined yet, you will see a list of tiles which will help you to quickly create . Select your first one or create such from scratch by choosing `Custom`. It is also possible to create additional CTD by clicking `Add definition` button in the top right corner of the page. @@ -44,8 +44,8 @@ It has five properties: 1. title 2. slug -3. content -4. thumbnail +3. excerpt +4. content 5. headerImage @@ -63,15 +63,15 @@ The `slug` property is also required, but also must be unique across all your bl ![](images/AddContentTypeDefinitionsSlug.png){: .center .width75 .border} -The `content` property is set to generate Rich Text input (we use CKEditor in Flotiq): +The `excerpt` property is defined as a simple text area field. -![](images/AddContentTypeDefinitionsContent.png){: .center .width75 .border} +![](images/AddContentTypeDefinitionsExcerpt.png){: .center .width75 .border} -The `thumbnail` property is defined as a relation to Media CTD - a system type definition that anyone can use but sees only their entries. It can only have one element added. +The `content` property is set to generate Rich Text input (we use CKEditor in Flotiq): -![](images/AddContentTypeDefinitionsThumbnail.png){: .center .width75 .border} +![](images/AddContentTypeDefinitionsContent.png){: .center .width75 .border} -The `headerImage` is set up exactly like the thumbnail; the only difference is the property name. +The `headerImage` is is defined as a relation to Media CTD - a system type definition that anyone can use but sees only their entries. It can only have one element added. ![](images/AddContentTypeDefinitionsHeaderImage.png){: .center .width75 .border} @@ -83,7 +83,7 @@ After saving your CTD you will be redirected to the CTDs list, where you can cli Predefined CTD tiles are no longer visible. You can use the dropdown menu on the top right corner to add more of such types. -![](images/TypeDefinitionsAddButton.png){: .center .border} +![](images/TypeDefinitionsAddButton.png){: .center .width25 .border} ## Updating Content Type Definitions diff --git a/docs/panel/images/AddBlogPost.png b/docs/panel/images/AddBlogPost.png new file mode 100644 index 00000000..31d4cebc Binary files /dev/null and b/docs/panel/images/AddBlogPost.png differ diff --git a/docs/panel/images/AddContentTypeDefinitions.png b/docs/panel/images/AddContentTypeDefinitions.png index 7e945248..2739a42c 100644 Binary files a/docs/panel/images/AddContentTypeDefinitions.png and b/docs/panel/images/AddContentTypeDefinitions.png differ diff --git a/docs/panel/images/AddContentTypeDefinitionsContent.png b/docs/panel/images/AddContentTypeDefinitionsContent.png index 8ad7d11b..ee3d13a2 100644 Binary files a/docs/panel/images/AddContentTypeDefinitionsContent.png and b/docs/panel/images/AddContentTypeDefinitionsContent.png differ diff --git a/docs/panel/images/AddContentTypeDefinitionsExcerpt.png b/docs/panel/images/AddContentTypeDefinitionsExcerpt.png new file mode 100644 index 00000000..c230b88b Binary files /dev/null and b/docs/panel/images/AddContentTypeDefinitionsExcerpt.png differ diff --git a/docs/panel/images/AddContentTypeDefinitionsHeaderImage.png b/docs/panel/images/AddContentTypeDefinitionsHeaderImage.png index 9a062cab..23298002 100644 Binary files a/docs/panel/images/AddContentTypeDefinitionsHeaderImage.png and b/docs/panel/images/AddContentTypeDefinitionsHeaderImage.png differ diff --git a/docs/panel/images/AddContentTypeDefinitionsSlug.png b/docs/panel/images/AddContentTypeDefinitionsSlug.png index 4c3d240b..4a61cb37 100644 Binary files a/docs/panel/images/AddContentTypeDefinitionsSlug.png and b/docs/panel/images/AddContentTypeDefinitionsSlug.png differ diff --git a/docs/panel/images/AddContentTypeDefinitionsThumbnail.png b/docs/panel/images/AddContentTypeDefinitionsThumbnail.png deleted file mode 100644 index 221c4eaf..00000000 Binary files a/docs/panel/images/AddContentTypeDefinitionsThumbnail.png and /dev/null differ diff --git a/docs/panel/images/AddContentTypeDefinitionsTitle.png b/docs/panel/images/AddContentTypeDefinitionsTitle.png index 453e343c..04055001 100644 Binary files a/docs/panel/images/AddContentTypeDefinitionsTitle.png and b/docs/panel/images/AddContentTypeDefinitionsTitle.png differ diff --git a/docs/panel/images/AddUserMenu.png b/docs/panel/images/AddUserMenu.png index 4cdad771..e4423303 100644 Binary files a/docs/panel/images/AddUserMenu.png and b/docs/panel/images/AddUserMenu.png differ diff --git a/docs/panel/images/BlockControl.gif b/docs/panel/images/BlockControl.gif deleted file mode 100644 index a600465e..00000000 Binary files a/docs/panel/images/BlockControl.gif and /dev/null differ diff --git a/docs/panel/images/BlockControlHeader.png b/docs/panel/images/BlockControlHeader.png deleted file mode 100644 index 9d8821c8..00000000 Binary files a/docs/panel/images/BlockControlHeader.png and /dev/null differ diff --git a/docs/panel/images/BlockControlHeadingInline.png b/docs/panel/images/BlockControlHeadingInline.png deleted file mode 100644 index 509c6160..00000000 Binary files a/docs/panel/images/BlockControlHeadingInline.png and /dev/null differ diff --git a/docs/panel/images/BlockControlHeadingTune.png b/docs/panel/images/BlockControlHeadingTune.png deleted file mode 100644 index 3485a291..00000000 Binary files a/docs/panel/images/BlockControlHeadingTune.png and /dev/null differ diff --git a/docs/panel/images/BlockControlListInline.png b/docs/panel/images/BlockControlListInline.png deleted file mode 100644 index 8f17b54d..00000000 Binary files a/docs/panel/images/BlockControlListInline.png and /dev/null differ diff --git a/docs/panel/images/BlockControlListTune.png b/docs/panel/images/BlockControlListTune.png deleted file mode 100644 index b3e653a8..00000000 Binary files a/docs/panel/images/BlockControlListTune.png and /dev/null differ diff --git a/docs/panel/images/BlockControlMediaTune.png b/docs/panel/images/BlockControlMediaTune.png deleted file mode 100644 index 43580114..00000000 Binary files a/docs/panel/images/BlockControlMediaTune.png and /dev/null differ diff --git a/docs/panel/images/BlockControlQuoteTune.png b/docs/panel/images/BlockControlQuoteTune.png deleted file mode 100644 index 34d3a952..00000000 Binary files a/docs/panel/images/BlockControlQuoteTune.png and /dev/null differ diff --git a/docs/panel/images/BlockControlTableTune.png b/docs/panel/images/BlockControlTableTune.png deleted file mode 100644 index 4b1a574a..00000000 Binary files a/docs/panel/images/BlockControlTableTune.png and /dev/null differ diff --git a/docs/panel/images/BlockControlTextInline.png b/docs/panel/images/BlockControlTextInline.png deleted file mode 100644 index 0f9442a4..00000000 Binary files a/docs/panel/images/BlockControlTextInline.png and /dev/null differ diff --git a/docs/panel/images/BlockControlTextTune.png b/docs/panel/images/BlockControlTextTune.png deleted file mode 100644 index e1afd502..00000000 Binary files a/docs/panel/images/BlockControlTextTune.png and /dev/null differ diff --git a/docs/panel/images/BlockControlYTTune.png b/docs/panel/images/BlockControlYTTune.png deleted file mode 100644 index 0839eb77..00000000 Binary files a/docs/panel/images/BlockControlYTTune.png and /dev/null differ diff --git a/docs/panel/images/BlogPostForm.png b/docs/panel/images/BlogPostForm.png index c78e6c48..00a9b895 100644 Binary files a/docs/panel/images/BlogPostForm.png and b/docs/panel/images/BlogPostForm.png differ diff --git a/docs/panel/images/BlogPostFormModal.png b/docs/panel/images/BlogPostFormModal.png deleted file mode 100644 index 74bb066b..00000000 Binary files a/docs/panel/images/BlogPostFormModal.png and /dev/null differ diff --git a/docs/panel/images/ContentMenu.png b/docs/panel/images/ContentMenu.png index 87d42f3f..17018b61 100644 Binary files a/docs/panel/images/ContentMenu.png and b/docs/panel/images/ContentMenu.png differ diff --git a/docs/panel/images/Create-variant.png b/docs/panel/images/Create-variant.png index 53dfa3b1..4eb58819 100644 Binary files a/docs/panel/images/Create-variant.png and b/docs/panel/images/Create-variant.png differ diff --git a/docs/panel/images/Dashboard.png b/docs/panel/images/Dashboard.png index d1617b19..e8e2e0ed 100644 Binary files a/docs/panel/images/Dashboard.png and b/docs/panel/images/Dashboard.png differ diff --git a/docs/panel/images/DashboardSpaces.png b/docs/panel/images/DashboardSpaces.png index 3cab069a..e7b0b5a7 100644 Binary files a/docs/panel/images/DashboardSpaces.png and b/docs/panel/images/DashboardSpaces.png differ diff --git a/docs/panel/images/DateControl.png b/docs/panel/images/DateControl.png deleted file mode 100644 index d82e948c..00000000 Binary files a/docs/panel/images/DateControl.png and /dev/null differ diff --git a/docs/panel/images/Edit-Media.png b/docs/panel/images/Edit-Media.png index 772bc5cb..b2610d82 100644 Binary files a/docs/panel/images/Edit-Media.png and b/docs/panel/images/Edit-Media.png differ diff --git a/docs/panel/images/EditButtons.png b/docs/panel/images/EditButtons.png deleted file mode 100644 index f71034dd..00000000 Binary files a/docs/panel/images/EditButtons.png and /dev/null differ diff --git a/docs/panel/images/EditContentTypeDefinitions.png b/docs/panel/images/EditContentTypeDefinitions.png index bb5af0c2..841cbe1d 100644 Binary files a/docs/panel/images/EditContentTypeDefinitions.png and b/docs/panel/images/EditContentTypeDefinitions.png differ diff --git a/docs/panel/images/EditObject.png b/docs/panel/images/EditObject.png index d0e328f4..ee43731f 100644 Binary files a/docs/panel/images/EditObject.png and b/docs/panel/images/EditObject.png differ diff --git a/docs/panel/images/EditUser.png b/docs/panel/images/EditUser.png index 97210bde..4afff4f6 100644 Binary files a/docs/panel/images/EditUser.png and b/docs/panel/images/EditUser.png differ diff --git a/docs/panel/images/EventForm.png b/docs/panel/images/EventForm.png index 2a98e4cd..99ace9e1 100644 Binary files a/docs/panel/images/EventForm.png and b/docs/panel/images/EventForm.png differ diff --git a/docs/panel/images/GenerateModal1.png b/docs/panel/images/GenerateModal1.png deleted file mode 100644 index 62dcb7e5..00000000 Binary files a/docs/panel/images/GenerateModal1.png and /dev/null differ diff --git a/docs/panel/images/GenerateModal2.png b/docs/panel/images/GenerateModal2.png deleted file mode 100644 index 952e8021..00000000 Binary files a/docs/panel/images/GenerateModal2.png and /dev/null differ diff --git a/docs/panel/images/GeoControl.png b/docs/panel/images/GeoControl.png deleted file mode 100644 index 583f9208..00000000 Binary files a/docs/panel/images/GeoControl.png and /dev/null differ diff --git a/docs/panel/images/GridBatchDelete.png b/docs/panel/images/GridBatchDelete.png new file mode 100644 index 00000000..d7e27936 Binary files /dev/null and b/docs/panel/images/GridBatchDelete.png differ diff --git a/docs/panel/images/GridView.png b/docs/panel/images/GridView.png index 1365d983..aed2e006 100644 Binary files a/docs/panel/images/GridView.png and b/docs/panel/images/GridView.png differ diff --git a/docs/panel/images/LinkExistingObject.png b/docs/panel/images/LinkExistingObject.png deleted file mode 100644 index bf82acf8..00000000 Binary files a/docs/panel/images/LinkExistingObject.png and /dev/null differ diff --git a/docs/panel/images/ListRemove.png b/docs/panel/images/ListRemove.png deleted file mode 100644 index 4ec3cf48..00000000 Binary files a/docs/panel/images/ListRemove.png and /dev/null differ diff --git a/docs/panel/images/Lists.png b/docs/panel/images/Lists.png deleted file mode 100644 index 0d99cbc1..00000000 Binary files a/docs/panel/images/Lists.png and /dev/null differ diff --git a/docs/panel/images/MarkdownControlHeader.png b/docs/panel/images/MarkdownControlHeader.png deleted file mode 100644 index 862266d4..00000000 Binary files a/docs/panel/images/MarkdownControlHeader.png and /dev/null differ diff --git a/docs/panel/images/MediaLibrary-home.png b/docs/panel/images/MediaLibrary-home.png index 32ae2d8f..d6ffdd58 100644 Binary files a/docs/panel/images/MediaLibrary-home.png and b/docs/panel/images/MediaLibrary-home.png differ diff --git a/docs/panel/images/MediaLibraryModal.png b/docs/panel/images/MediaLibraryModal.png deleted file mode 100644 index 9a394b66..00000000 Binary files a/docs/panel/images/MediaLibraryModal.png and /dev/null differ diff --git a/docs/panel/images/MediaLibraryUnsplash.png b/docs/panel/images/MediaLibraryUnsplash.png index 3a69e72c..ca82fe50 100644 Binary files a/docs/panel/images/MediaLibraryUnsplash.png and b/docs/panel/images/MediaLibraryUnsplash.png differ diff --git a/docs/panel/images/OrganizationSettings.png b/docs/panel/images/OrganizationSettings.png new file mode 100644 index 00000000..e6b4db3f Binary files /dev/null and b/docs/panel/images/OrganizationSettings.png differ diff --git a/docs/panel/images/PredefinedCTDEvent.png b/docs/panel/images/PredefinedCTDEvent.png index 0ee124ec..d45c76df 100644 Binary files a/docs/panel/images/PredefinedCTDEvent.png and b/docs/panel/images/PredefinedCTDEvent.png differ diff --git a/docs/panel/images/PredefinedCTDProduct.png b/docs/panel/images/PredefinedCTDProduct.png index bc01b3fe..62a8b08b 100644 Binary files a/docs/panel/images/PredefinedCTDProduct.png and b/docs/panel/images/PredefinedCTDProduct.png differ diff --git a/docs/panel/images/PredefinedCTDProject.png b/docs/panel/images/PredefinedCTDProject.png index 434624b3..e206bf36 100644 Binary files a/docs/panel/images/PredefinedCTDProject.png and b/docs/panel/images/PredefinedCTDProject.png differ diff --git a/docs/panel/images/PredefinedCTDRecipe.png b/docs/panel/images/PredefinedCTDRecipe.png index 976bd0fa..9987b259 100644 Binary files a/docs/panel/images/PredefinedCTDRecipe.png and b/docs/panel/images/PredefinedCTDRecipe.png differ diff --git a/docs/panel/images/ProductForm.png b/docs/panel/images/ProductForm.png index 4d80c0e3..f87881fd 100644 Binary files a/docs/panel/images/ProductForm.png and b/docs/panel/images/ProductForm.png differ diff --git a/docs/panel/images/ProjectForm.png b/docs/panel/images/ProjectForm.png index de206a28..d5807949 100644 Binary files a/docs/panel/images/ProjectForm.png and b/docs/panel/images/ProjectForm.png differ diff --git a/docs/panel/images/RecipeForm.png b/docs/panel/images/RecipeForm.png index 985e1eac..4f578eed 100644 Binary files a/docs/panel/images/RecipeForm.png and b/docs/panel/images/RecipeForm.png differ diff --git a/docs/panel/images/Relations.png b/docs/panel/images/Relations.png deleted file mode 100644 index 32d66fea..00000000 Binary files a/docs/panel/images/Relations.png and /dev/null differ diff --git a/docs/panel/images/RichTextControlEditImage.png b/docs/panel/images/RichTextControlEditImage.png deleted file mode 100644 index 69b9198d..00000000 Binary files a/docs/panel/images/RichTextControlEditImage.png and /dev/null differ diff --git a/docs/panel/images/RichTextControlHeader.png b/docs/panel/images/RichTextControlHeader.png deleted file mode 100644 index 470ae691..00000000 Binary files a/docs/panel/images/RichTextControlHeader.png and /dev/null differ diff --git a/docs/panel/images/RichTextHighlightColors.png b/docs/panel/images/RichTextHighlightColors.png deleted file mode 100644 index a2046e05..00000000 Binary files a/docs/panel/images/RichTextHighlightColors.png and /dev/null differ diff --git a/docs/panel/images/RichTextTextColors.png b/docs/panel/images/RichTextTextColors.png deleted file mode 100644 index 9bb88214..00000000 Binary files a/docs/panel/images/RichTextTextColors.png and /dev/null differ diff --git a/docs/panel/images/TypeDefinitions.png b/docs/panel/images/TypeDefinitions.png index 679d7acd..ba060ec9 100644 Binary files a/docs/panel/images/TypeDefinitions.png and b/docs/panel/images/TypeDefinitions.png differ diff --git a/docs/panel/images/TypeDefinitionsAddButton.png b/docs/panel/images/TypeDefinitionsAddButton.png index ebf634df..213518cf 100644 Binary files a/docs/panel/images/TypeDefinitionsAddButton.png and b/docs/panel/images/TypeDefinitionsAddButton.png differ diff --git a/docs/panel/images/TypeDefinitionsMenu.png b/docs/panel/images/TypeDefinitionsMenu.png index eca194be..1e367f65 100644 Binary files a/docs/panel/images/TypeDefinitionsMenu.png and b/docs/panel/images/TypeDefinitionsMenu.png differ diff --git a/docs/panel/images/TypeDefinitionsTiles.png b/docs/panel/images/TypeDefinitionsTiles.png index b043d979..69054895 100644 Binary files a/docs/panel/images/TypeDefinitionsTiles.png and b/docs/panel/images/TypeDefinitionsTiles.png differ diff --git a/docs/panel/images/TypeDefinitionsTilesAll.png b/docs/panel/images/TypeDefinitionsTilesAll.png index 8f3f252e..c8af86f2 100644 Binary files a/docs/panel/images/TypeDefinitionsTilesAll.png and b/docs/panel/images/TypeDefinitionsTilesAll.png differ diff --git a/docs/panel/images/Unsplash-to-library.gif b/docs/panel/images/Unsplash-to-library.gif deleted file mode 100644 index 708c4465..00000000 Binary files a/docs/panel/images/Unsplash-to-library.gif and /dev/null differ diff --git a/docs/panel/images/UserList.png b/docs/panel/images/UserList.png index 978c2aba..cb50fa20 100644 Binary files a/docs/panel/images/UserList.png and b/docs/panel/images/UserList.png differ diff --git a/docs/panel/images/UsersMenu.png b/docs/panel/images/UsersMenu.png index d9ec3e62..8d607fee 100644 Binary files a/docs/panel/images/UsersMenu.png and b/docs/panel/images/UsersMenu.png differ diff --git a/docs/panel/images/co-form/EditButtons.png b/docs/panel/images/co-form/EditButtons.png new file mode 100644 index 00000000..e9e9ccef Binary files /dev/null and b/docs/panel/images/co-form/EditButtons.png differ diff --git a/docs/panel/images/co-form/block/AddBlocks.png b/docs/panel/images/co-form/block/AddBlocks.png new file mode 100644 index 00000000..6c2e4817 Binary files /dev/null and b/docs/panel/images/co-form/block/AddBlocks.png differ diff --git a/docs/panel/images/co-form/block/Controls.png b/docs/panel/images/co-form/block/Controls.png new file mode 100644 index 00000000..3d6d786e Binary files /dev/null and b/docs/panel/images/co-form/block/Controls.png differ diff --git a/docs/panel/images/co-form/block/HeaderConversion.png b/docs/panel/images/co-form/block/HeaderConversion.png new file mode 100644 index 00000000..472aac18 Binary files /dev/null and b/docs/panel/images/co-form/block/HeaderConversion.png differ diff --git a/docs/panel/images/co-form/block/HeaderTunes.png b/docs/panel/images/co-form/block/HeaderTunes.png new file mode 100644 index 00000000..2f14f0d7 Binary files /dev/null and b/docs/panel/images/co-form/block/HeaderTunes.png differ diff --git a/docs/panel/images/co-form/block/ListConversion.png b/docs/panel/images/co-form/block/ListConversion.png new file mode 100644 index 00000000..b6879d2f Binary files /dev/null and b/docs/panel/images/co-form/block/ListConversion.png differ diff --git a/docs/panel/images/co-form/block/ListTunes.png b/docs/panel/images/co-form/block/ListTunes.png new file mode 100644 index 00000000..4f658cfc Binary files /dev/null and b/docs/panel/images/co-form/block/ListTunes.png differ diff --git a/docs/panel/images/co-form/block/MediaTunes.png b/docs/panel/images/co-form/block/MediaTunes.png new file mode 100644 index 00000000..a4713548 Binary files /dev/null and b/docs/panel/images/co-form/block/MediaTunes.png differ diff --git a/docs/panel/images/co-form/block/QuoteTunes.png b/docs/panel/images/co-form/block/QuoteTunes.png new file mode 100644 index 00000000..7077326f Binary files /dev/null and b/docs/panel/images/co-form/block/QuoteTunes.png differ diff --git a/docs/panel/images/co-form/block/TableTunes.png b/docs/panel/images/co-form/block/TableTunes.png new file mode 100644 index 00000000..171d5c9b Binary files /dev/null and b/docs/panel/images/co-form/block/TableTunes.png differ diff --git a/docs/panel/images/co-form/block/TextConversion.png b/docs/panel/images/co-form/block/TextConversion.png new file mode 100644 index 00000000..eefec692 Binary files /dev/null and b/docs/panel/images/co-form/block/TextConversion.png differ diff --git a/docs/panel/images/co-form/block/TextTunes.png b/docs/panel/images/co-form/block/TextTunes.png new file mode 100644 index 00000000..66ab74e3 Binary files /dev/null and b/docs/panel/images/co-form/block/TextTunes.png differ diff --git a/docs/panel/images/co-form/datasource/LinkExistingObject.png b/docs/panel/images/co-form/datasource/LinkExistingObject.png new file mode 100644 index 00000000..d93bec34 Binary files /dev/null and b/docs/panel/images/co-form/datasource/LinkExistingObject.png differ diff --git a/docs/panel/images/co-form/datasource/MediaLibraryModal.png b/docs/panel/images/co-form/datasource/MediaLibraryModal.png new file mode 100644 index 00000000..026642a9 Binary files /dev/null and b/docs/panel/images/co-form/datasource/MediaLibraryModal.png differ diff --git a/docs/panel/images/co-form/datasource/RelationAddModal.png b/docs/panel/images/co-form/datasource/RelationAddModal.png new file mode 100644 index 00000000..2d797b3c Binary files /dev/null and b/docs/panel/images/co-form/datasource/RelationAddModal.png differ diff --git a/docs/panel/images/co-form/datasource/Relations.png b/docs/panel/images/co-form/datasource/Relations.png new file mode 100644 index 00000000..727262c0 Binary files /dev/null and b/docs/panel/images/co-form/datasource/Relations.png differ diff --git a/docs/panel/images/co-form/date/DateControl.png b/docs/panel/images/co-form/date/DateControl.png new file mode 100644 index 00000000..42e38519 Binary files /dev/null and b/docs/panel/images/co-form/date/DateControl.png differ diff --git a/docs/panel/images/co-form/geo/GeoControl.png b/docs/panel/images/co-form/geo/GeoControl.png new file mode 100644 index 00000000..b2c8579e Binary files /dev/null and b/docs/panel/images/co-form/geo/GeoControl.png differ diff --git a/docs/panel/images/co-form/list/List.png b/docs/panel/images/co-form/list/List.png new file mode 100644 index 00000000..668e419d Binary files /dev/null and b/docs/panel/images/co-form/list/List.png differ diff --git a/docs/panel/images/co-form/list/NestedList.png b/docs/panel/images/co-form/list/NestedList.png new file mode 100644 index 00000000..ebf12c8f Binary files /dev/null and b/docs/panel/images/co-form/list/NestedList.png differ diff --git a/docs/panel/images/co-form/markdown/Controls.png b/docs/panel/images/co-form/markdown/Controls.png new file mode 100644 index 00000000..bc173602 Binary files /dev/null and b/docs/panel/images/co-form/markdown/Controls.png differ diff --git a/docs/panel/images/co-form/richtext/ColorControl.png b/docs/panel/images/co-form/richtext/ColorControl.png new file mode 100644 index 00000000..0cd55590 Binary files /dev/null and b/docs/panel/images/co-form/richtext/ColorControl.png differ diff --git a/docs/panel/images/co-form/richtext/Controls.png b/docs/panel/images/co-form/richtext/Controls.png new file mode 100644 index 00000000..17c92b06 Binary files /dev/null and b/docs/panel/images/co-form/richtext/Controls.png differ diff --git a/docs/panel/images/co-form/richtext/ImageProperties.png b/docs/panel/images/co-form/richtext/ImageProperties.png new file mode 100644 index 00000000..99e2e230 Binary files /dev/null and b/docs/panel/images/co-form/richtext/ImageProperties.png differ diff --git a/docs/panel/images/definition-builder-create-product.png b/docs/panel/images/definition-builder-create-product.png new file mode 100644 index 00000000..b628af25 Binary files /dev/null and b/docs/panel/images/definition-builder-create-product.png differ diff --git a/docs/panel/images/definition-builder-create-recipe.png b/docs/panel/images/definition-builder-create-recipe.png new file mode 100644 index 00000000..faaadbea Binary files /dev/null and b/docs/panel/images/definition-builder-create-recipe.png differ diff --git a/docs/panel/images/nested list.png b/docs/panel/images/nested list.png deleted file mode 100644 index 6fbf3ccd..00000000 Binary files a/docs/panel/images/nested list.png and /dev/null differ diff --git a/docs/panel/images/spaces/SpaceAdd.png b/docs/panel/images/spaces/SpaceAdd.png index e581a05c..f5270049 100644 Binary files a/docs/panel/images/spaces/SpaceAdd.png and b/docs/panel/images/spaces/SpaceAdd.png differ diff --git a/docs/panel/images/spaces/SpaceEdit.png b/docs/panel/images/spaces/SpaceEdit.png index 7e1ab19b..92abaf64 100644 Binary files a/docs/panel/images/spaces/SpaceEdit.png and b/docs/panel/images/spaces/SpaceEdit.png differ diff --git a/docs/panel/images/spaces/SpaceOrgSettings.png b/docs/panel/images/spaces/SpaceOrgSettings.png deleted file mode 100644 index f13a108d..00000000 Binary files a/docs/panel/images/spaces/SpaceOrgSettings.png and /dev/null differ diff --git a/docs/panel/images/spaces/SpaceUpgrade.png b/docs/panel/images/spaces/SpaceUpgrade.png index 971d8980..f35b52c9 100644 Binary files a/docs/panel/images/spaces/SpaceUpgrade.png and b/docs/panel/images/spaces/SpaceUpgrade.png differ diff --git a/docs/panel/images/spaces/SpaceUsers.png b/docs/panel/images/spaces/SpaceUsers.png deleted file mode 100644 index 7885bb66..00000000 Binary files a/docs/panel/images/spaces/SpaceUsers.png and /dev/null differ diff --git a/docs/panel/images/spaces/SpacesAndUsage.png b/docs/panel/images/spaces/SpacesAndUsage.png index a2c7b45e..3f318af6 100644 Binary files a/docs/panel/images/spaces/SpacesAndUsage.png and b/docs/panel/images/spaces/SpacesAndUsage.png differ diff --git a/docs/panel/images/spaces/SpacesSelector.png b/docs/panel/images/spaces/SpacesSelector.png deleted file mode 100644 index 89771034..00000000 Binary files a/docs/panel/images/spaces/SpacesSelector.png and /dev/null differ diff --git a/docs/panel/images/webhooks-lifecycle/AddFieldToBlogPost.png b/docs/panel/images/webhooks-lifecycle/AddFieldToBlogPost.png index 23227ad3..4a2a37a2 100644 Binary files a/docs/panel/images/webhooks-lifecycle/AddFieldToBlogPost.png and b/docs/panel/images/webhooks-lifecycle/AddFieldToBlogPost.png differ diff --git a/docs/panel/images/webhooks-lifecycle/Example1.png b/docs/panel/images/webhooks-lifecycle/Example1.png index a56f9504..0f344ac4 100644 Binary files a/docs/panel/images/webhooks-lifecycle/Example1.png and b/docs/panel/images/webhooks-lifecycle/Example1.png differ diff --git a/docs/panel/images/webhooks-lifecycle/WebhooksLifecycle.png b/docs/panel/images/webhooks-lifecycle/WebhooksLifecycle.png index b5d29993..253729c1 100644 Binary files a/docs/panel/images/webhooks-lifecycle/WebhooksLifecycle.png and b/docs/panel/images/webhooks-lifecycle/WebhooksLifecycle.png differ diff --git a/docs/panel/images/webhooks/AddHostedWebhook.png b/docs/panel/images/webhooks/AddHostedWebhook.png index fa5f086f..bd040af4 100644 Binary files a/docs/panel/images/webhooks/AddHostedWebhook.png and b/docs/panel/images/webhooks/AddHostedWebhook.png differ diff --git a/docs/panel/images/webhooks/co-webhook-create.png b/docs/panel/images/webhooks/co-webhook-create.png index 02ec0fb3..adfd544e 100644 Binary files a/docs/panel/images/webhooks/co-webhook-create.png and b/docs/panel/images/webhooks/co-webhook-create.png differ diff --git a/docs/panel/images/webhooks/examples/aws-lambda/webhook-aws-2.png b/docs/panel/images/webhooks/examples/aws-lambda/webhook-aws-2.png index bd0b6047..b8e75b83 100644 Binary files a/docs/panel/images/webhooks/examples/aws-lambda/webhook-aws-2.png and b/docs/panel/images/webhooks/examples/aws-lambda/webhook-aws-2.png differ diff --git a/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-2.png b/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-2.png index af8cb8d9..ba494934 100644 Binary files a/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-2.png and b/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-2.png differ diff --git a/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-3.png b/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-3.png index e40c755c..59d4b691 100644 Binary files a/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-3.png and b/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-3.png differ diff --git a/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-4.png b/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-4.png index 3755ad10..80909e12 100644 Binary files a/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-4.png and b/docs/panel/images/webhooks/examples/gatsby/gatsby-cloud-4.png differ diff --git a/docs/panel/images/webhooks/examples/netlify/netlify-hook-3.png b/docs/panel/images/webhooks/examples/netlify/netlify-hook-3.png index 4a12e299..f25f643c 100644 Binary files a/docs/panel/images/webhooks/examples/netlify/netlify-hook-3.png and b/docs/panel/images/webhooks/examples/netlify/netlify-hook-3.png differ diff --git a/docs/panel/images/webhooks/examples/netlify/netlify-hook-4.png b/docs/panel/images/webhooks/examples/netlify/netlify-hook-4.png index a25d3238..070519b4 100644 Binary files a/docs/panel/images/webhooks/examples/netlify/netlify-hook-4.png and b/docs/panel/images/webhooks/examples/netlify/netlify-hook-4.png differ diff --git a/docs/panel/images/webhooks/examples/rocket/rocket-2.png b/docs/panel/images/webhooks/examples/rocket/rocket-2.png index 951d9f11..c36680cf 100644 Binary files a/docs/panel/images/webhooks/examples/rocket/rocket-2.png and b/docs/panel/images/webhooks/examples/rocket/rocket-2.png differ diff --git a/docs/panel/images/webhooks/webhooks-create-ctd-webhook.png b/docs/panel/images/webhooks/webhooks-create-ctd-webhook.png index 31e77548..6c4d4078 100644 Binary files a/docs/panel/images/webhooks/webhooks-create-ctd-webhook.png and b/docs/panel/images/webhooks/webhooks-create-ctd-webhook.png differ diff --git a/docs/panel/images/webhooks/webhooks-custom-hook.png b/docs/panel/images/webhooks/webhooks-custom-hook.png deleted file mode 100644 index db39b6cc..00000000 Binary files a/docs/panel/images/webhooks/webhooks-custom-hook.png and /dev/null differ diff --git a/docs/panel/images/webhooks/webhooks-list.png b/docs/panel/images/webhooks/webhooks-list.png index d8265123..0078a50a 100644 Binary files a/docs/panel/images/webhooks/webhooks-list.png and b/docs/panel/images/webhooks/webhooks-list.png differ diff --git a/docs/panel/images/webhooks/webhooks-log-details.png b/docs/panel/images/webhooks/webhooks-log-details.png index db8bbd67..94ca5e66 100644 Binary files a/docs/panel/images/webhooks/webhooks-log-details.png and b/docs/panel/images/webhooks/webhooks-log-details.png differ diff --git a/docs/panel/images/webhooks/webhooks-logs.png b/docs/panel/images/webhooks/webhooks-logs.png index 0bb050b0..b24ee196 100644 Binary files a/docs/panel/images/webhooks/webhooks-logs.png and b/docs/panel/images/webhooks/webhooks-logs.png differ diff --git a/docs/panel/images/webhooks/webhooks-product-added-notification.png b/docs/panel/images/webhooks/webhooks-product-added-notification.png deleted file mode 100644 index 84932331..00000000 Binary files a/docs/panel/images/webhooks/webhooks-product-added-notification.png and /dev/null differ diff --git a/docs/panel/index.md b/docs/panel/index.md index a67a05b1..d8f2a692 100644 --- a/docs/panel/index.md +++ b/docs/panel/index.md @@ -6,11 +6,11 @@ Here you will find the documentation about Flotiq Panel, which is the graphical After logging in you will see Flotiq's dashboard, by default it will show a welcome screen, the onboarding checklist and links to SDK packages that you can download in order to use the content provided by Flotiq in your project. -![Flotiq dashboard](images/Dashboard.png) +![Flotiq dashboard](images/Dashboard.png){: .border} The Dashboard you see contains information about the Space within which you are working. If you have access to multiple Spaces, you can switch contexts by clicking on the desired Space. -![Flotiq dashboard - spaces](images/DashboardSpaces.png) +![Flotiq dashboard - spaces](images/DashboardSpaces.png){: .border} !!! note Read more about Spaces in [Spaces and Organization section](/docs/panel/spaces/). @@ -19,31 +19,31 @@ The Dashboard you see contains information about the Space within which you are This part of Flotiq's interface will be your starting point whenever you begin working with new kind of data. In here you will find your existing Content Type Definitions, presented in a tile grid -![Flotiq Content Type Definitions tile list](images/TypeDefinitions.png) +![Flotiq Content Type Definitions tile list](images/TypeDefinitions.png){: .border} ## Content Type editor From the main screen showing all Content Type Definitions you can either create a new CTD or edit an existing one. Both actions will take you to the Content Type editor, which is a convenient UI to define your data model. -![Flotiq Content Type Editor](images/EditContentTypeDefinitions.png) +![Flotiq Content Type Editor](images/EditContentTypeDefinitions.png){: .center .width75 .border} ## Content Object grid Once you create a Content Type you can go to the Content menu in the left pane and select the name of the Content Type that you created. You will be taken to a grid view showing all your Content Objects. This view is particularly useful once you have many objects stored in your Flotiq account. -![Flotiq grid view](images/GridView.png) +![Flotiq grid view](images/GridView.png){: .border} ## Content Object editor From the grid view you can easily access individual objects by clicking the pencil icon in the right-most column. You can also create new objects by clicking the `Add Object` button in the top right corner. The Content Object editor itself offers a convenient form, which is automatically generated based on the Content Type Definintion that you previously created. Since Content Objects are automatically versioned - this view also allows to switch to different versions of a particular object. -![Flotiq object editor](images/EditObject.png) +![Flotiq object editor](images/EditObject.png){: .border} ## Media Library Flotiq provides storage for images and other media within our Media Library. The main screen of the Media Library shows all images and files that are currently present in your account: -![Flotiq Media Library](images/MediaLibrary-home.png) +![Flotiq Media Library](images/MediaLibrary-home.png){: .border} when you switch to the `Stock photos` view - you will have access to the entire [Unsplash](https://unsplash.com) library of images, which you can use in your projects. diff --git a/docs/panel/media-library.md b/docs/panel/media-library.md index d797b84b..370d9d96 100644 --- a/docs/panel/media-library.md +++ b/docs/panel/media-library.md @@ -12,15 +12,16 @@ The Media Library has 2 sections: This section of the Media Library gives you access to all of your files that you're storing in Flotiq. You can upload, search, sort, and remove files from the library in this screen. -![Flotiq Media Library](./images/MediaLibrary-home.png) +![Flotiq Media Library](./images/MediaLibrary-home.png){: .border} ## Stock photos This section gives you access to the Unsplash library of images. All Unsplash images are available to use for free and Flotiq takes care of the necessary attributions. + In order to use images from Unsplash - you need to download them to your library first. This is a very simple operation - once you select an image you like, simply click the download icon on that image and it will momentarily appear in you `Uploaded files`. -![Downloading from Unsplash](./images/Unsplash-to-library.gif) +![Downloading from Unsplash](./images/MediaLibraryUnsplash.png){: .border} ## Variants @@ -28,11 +29,11 @@ Variants allow you to create transformed versions of images. A variant consists In order to create a variant through dashboard, simply press the edit button on any of your images in media library, and select `Add new variant` option. -![Editing media](./images/Edit-Media.png) +![Editing media](./images/Edit-Media.png){: .border .width50 .center} A window will pop up with a WYSIWYG editor, that will allow you to easily modify the image according to your needs. -![Editing media](./images/Create-variant.png) +![Editing media](./images/Create-variant.png){.center .width75 .border} After you are done with modifying the image, press `Save changes` button and a variant with this set of transformations will be added to your media data. diff --git a/docs/panel/predefined-content-types.md b/docs/panel/predefined-content-types.md index 3766bfaa..6655a012 100644 --- a/docs/panel/predefined-content-types.md +++ b/docs/panel/predefined-content-types.md @@ -8,7 +8,7 @@ Custom tile opens empty CTD. If you already have at least one CTD, you can use the dropdown menu on the top right corner to add more predefined CTDs. -![](images/TypeDefinitionsAddButton.png){: .center .border} +![](images/TypeDefinitionsAddButton.png){: .center .width25 .border} ## Blog Post @@ -22,7 +22,7 @@ Type for storing simple blog posts. It contains properties storing title, slug, | thumbnail | Relation | Restrict to type: Media | Thumbnail image | | headerImage | Relation | Restrict to type: Media | Main image of the post | -![](../Deep-Dives/images/3-minute-blog-content-type-all-fields.png){: .center .width75 .border} +![](images/AddContentTypeDefinitions.png){: .border} Full schema for the Blog Post type: diff --git a/docs/panel/spaces.md b/docs/panel/spaces.md index 0e9181fc..5c8dcffc 100644 --- a/docs/panel/spaces.md +++ b/docs/panel/spaces.md @@ -45,7 +45,7 @@ Roles within an Organization: Every user with access to one or more Spaces will see a Spaces selector above the main application menu. -![Spaces Selector in Flotiq Dashboard](images/spaces/SpacesSelector.png) +![Spaces Selector in Flotiq Dashboard](images/DashboardSpaces.png){: .border} Depending on the selected Space, the context of the application changes - the contents displayed by the Dashboard are relevant to the chosen Space. @@ -56,7 +56,7 @@ Depending on the selected Space, the context of the application changes - the co To manage your Spaces, navigate to the `Organization Settings` section of the application. -![Go to organization Settings, Flotiq Dashboard](images/spaces/SpaceOrgSettings.png) +![Go to organization Settings, Flotiq Dashboard](images/OrganizationSettings.png){: .width25 .border .center} ### List spaces @@ -69,26 +69,26 @@ This overview allows you to: * Change the payment plan associated with a Space (Upgrade Space). * Access the subscription dashboard where you can review billing documents (Manage subscription panel). -![Spaces and Usage view in Flotiq Dashboard](images/spaces/SpacesAndUsage.png) +![Spaces and Usage view in Flotiq Dashboard](images/spaces/SpacesAndUsage.png){: .border} ### Add Space In the Space addition view, an Organization Administrator can assign a name to the Space and select the usage limits that will be available for the Space. If a paid option is selected, the Administrator will be redirected to the payment view. -![Add a new Space to your Flotiq account](images/spaces/SpaceAdd.png) +![Add a new Space to your Flotiq account](images/spaces/SpaceAdd.png){: .border} ### Edit Space In the Space editing view, an Organization Administrator can change the name of the Space, manage users within the Space, and view the limits for the given Space. -![Edit Space settings](images/spaces/SpaceEdit.png) +![Edit Space settings](images/spaces/SpaceEdit.png){: .border} ### Upgrade Space To change the plan for a Space, the Administrator can select the “Upgrade Space” option from the Spaces list. -![Upgrading Space](images/spaces/SpaceUpgrade.png) +![Upgrading Space](images/spaces/SpaceUpgrade.png){: .border} When the administrator changes the plan: @@ -107,4 +107,4 @@ If a user is assigned to a Space, there are ways to manage their access to space To display the user list, navigate to the `Users` tab in the Organization management view. -![Users in Organization](images/spaces/SpaceUsers.png) +![Users in Organization](images/UserList.png){: .border} diff --git a/docs/panel/users.md b/docs/panel/users.md index f89db676..4b403666 100644 --- a/docs/panel/users.md +++ b/docs/panel/users.md @@ -10,7 +10,7 @@ This page describes how to manage **Users**, including your own settings, using Click `Users` in the menu on the left to get to users list: -![](images/UsersMenu.png){: .center .border} +![](images/UsersMenu.png){: .center .width25 .border} If you don't have any new user added, you will see only your own user on the list. @@ -32,7 +32,7 @@ Once new user verifies his email, he will be asked to enter a new password and t When browsing users list in `Users` tab from the left panel, you can make changes to your user by clicking the pencil icon, which will open the `Edit User` tab. -![](images/EditUser.png){: .center .border} +![](images/EditUser.png){: .center .width75 .border} Here you can change your settings, like your name and password, but also edit your email subscription preferences, or the user. diff --git a/docs/panel/webhooks/async-co-webhook.md b/docs/panel/webhooks/async-co-webhook.md index 2925d5c1..71ef0662 100644 --- a/docs/panel/webhooks/async-co-webhook.md +++ b/docs/panel/webhooks/async-co-webhook.md @@ -44,10 +44,10 @@ Webhooks are useful if you want to **extend the system functionality** or **inte To create a Webhook, click on the main menu `Webhooks` -> `Add new Webhook`. -![](../images/webhooks/co-webhook-create.png){: .border} +![](../images/webhooks/co-webhook-create.png){: .border .width75 .center} !!! Note - `Async Content Object Changes` webhook `type` is default option, you don't have to worry about setting proper type + `Content Object Changes Asynchronous (non blocking)` webhook `type` is default option, you don't have to worry about setting proper type !!! Note The above configuration means: Send a POST request to `https://my-example-app.com/notify` with an `AUTH` header of `secret_token` when the new `product` in Flotiq was `created`. @@ -106,7 +106,7 @@ Webhooks with a `Custom` action assigned can be launched manually, at any time, Additionally, if the object is not saved, the execute webhook button will save the object. The custom action is not possible to be performed from the API level. -![](../images/webhooks/webhooks-custom-hook.png){: .border } +![](../images/webhooks/examples/gatsby/gatsby-cloud-4.png){: .border } ### Webhooks payload diff --git a/docs/panel/webhooks/ctd-webhook.md b/docs/panel/webhooks/ctd-webhook.md index ab78fd8a..2409c941 100644 --- a/docs/panel/webhooks/ctd-webhook.md +++ b/docs/panel/webhooks/ctd-webhook.md @@ -11,7 +11,7 @@ description: Async Content Definition webhooks in Flotiq To create your new `Content Type Definitions` Webhook, click on the main menu `Webhooks` -> `Add new Webhook`. Then select `Type` as `Content Type Definition Changes` -![](../images/webhooks/webhooks-create-ctd-webhook.png){: .border} +![](../images/webhooks/webhooks-create-ctd-webhook.png){: .border .width75 .center} !!! Note `Action` input will disappear, because `Content Definition Changes` webhooks are fired on every `Content Definition's` action (`Create`, `Update`, `Delete`). diff --git a/docs/panel/webhooks/examples.md b/docs/panel/webhooks/examples.md index 7c2ba437..615432d2 100644 --- a/docs/panel/webhooks/examples.md +++ b/docs/panel/webhooks/examples.md @@ -31,7 +31,7 @@ In the [Flotiq](https://editor.flotiq.com) dashboard: 1. Go to the `Webhooks` page and click `Add new webhook`. 2. Name the webhook (e.g. `Gatsby Preview`) and paste obtained `Preview` URL as a webhook `URL`. 3. As a trigger, choose `Create`, `Update` and `Delete` actions on the `Product` and save the webhook: - ![](../images/webhooks/examples/gatsby/gatsby-cloud-2.png){: .border .mt5} + ![](../images/webhooks/examples/gatsby/gatsby-cloud-2.png){: .border .width75 .center .mt5} ### Check the result @@ -42,7 +42,7 @@ After the `Create`, `Update`, `Delete` action on the `Product`, Gatsby Cloud Pre ## 2. Trigger a Gatsby production build when a Build production button was clicked Prerequisites: -We assume, that you have `Product` Content Type Definition in Flotiq. +We assume, that you have `Blog Post` Content Type Definition in Flotiq. In the [Gatsby Cloud](https://www.gatsbyjs.com/dashboard) dashboard: @@ -54,12 +54,12 @@ In the [Flotiq](https://editor.flotiq.com) dashboard: 1. Go to the `Webhooks` page and click `Add new webhook`. 2. Name the webhook (e.g. `Gatsby Build Production`) and paste obtained `Builds` URL as a webhook `URL`. -3. As a trigger, choose `Custom` action on the `Product` and save the webhook: - ![](../images/webhooks/examples/gatsby/gatsby-cloud-3.png){: .border .mt5} +3. As a trigger, choose `Custom` action on the `Blog Post` and save the webhook: + ![](../images/webhooks/examples/gatsby/gatsby-cloud-3.png){: .border .width75 .center .mt5} ### Check the result -Now, the `Gatsby Build Production` webhook button will be available in the Edit `Product` form. +Now, the `Gatsby Build Production` webhook button will be available in the Edit `Blog Post` form. ![](../images/webhooks/examples/gatsby/gatsby-cloud-4.png){: .border} @@ -70,7 +70,7 @@ After clicking the `Gatsby Build Production` button in Flotiq, the Gatsby Produc ## 3. Trigger a Netlify build when a Build site button was clicked Prerequisites: -We assume, that you have `Product` Content Type Definition in Flotiq. +We assume, that you have `Blog Post` Content Type Definition in Flotiq. In the [Netlify](https://app.netlify.com/) dashboard: @@ -84,23 +84,23 @@ In the [Netlify](https://app.netlify.com/) dashboard: In the [Flotiq](https://editor.flotiq.com) dashboard: 1. Go to the `Webhooks` page and click `Add new webhook`. -2. Name the webhook (e.g. `Build Site`) and paste obtained URL as a webhook `URL`. -3. As a trigger, choose `Custom` action on the `Product` and save the webhook: +2. Name the webhook (e.g. `Netlify Build`) and paste obtained URL as a webhook `URL`. +3. As a trigger, choose `Custom` action on the `Blog Post` and save the webhook: - ![](../images/webhooks/examples/netlify/netlify-hook-3.png){: .border} + ![](../images/webhooks/examples/netlify/netlify-hook-3.png){: .border .width75 .center} ### Check the result -Now, the `Build Site` webhook button will be available in the Edit `Product` form: +Now, the `Netlify Build` webhook button will be available in the Edit `Blog Post` form: ![](../images/webhooks/examples/netlify/netlify-hook-4.png){: .border} -After clicking the `Build Site` button in Flotiq, the Netlify build will be triggered: +After clicking the `Netlify Build` button in Flotiq, the Netlify build will be triggered: ![](../images/webhooks/examples/netlify/netlify-hook-5.png){: .border} !!! Note - Choosing actions `Create`, `Update`, `Delete`, the build will be triggered automatically. The button `Build Site` is visible only when you choose a `Custom` trigger. + Choosing actions `Create`, `Update`, `Delete`, the build will be triggered automatically. The button `Netlify Build` is visible only when you choose a `Custom` trigger. ## 4. Send a RocketChat notification when the contact form was submitted. @@ -133,16 +133,16 @@ In the RocketChat dashboard: In the [Flotiq](https://editor.flotiq.com) dashboard: 1. Go to the `Webhooks` page and click `Add new webhook`. -2. Name the webhook (e.g. `Chat Notification`) and paste obtained `Webhook URL` as a webhook `URL`. -3. As a trigger, choose `Create` action on the `Contact form` and save the webhook: - ![](../images/webhooks/examples/rocket/rocket-2.png){: .border .mt5} +2. Name the webhook (e.g. `Chat notification`) and paste obtained `Webhook URL` as a webhook `URL`. +3. As a trigger, choose `Create` action on the `Contact Form` and save the webhook: + ![](../images/webhooks/examples/rocket/rocket-2.png){: .border .width75 .center .mt5} !!! Note As the next step, we recommend creating the Contact Form with [Flotiq Forms](https://flotiq.com/docs/panel/flotiq-forms-add-forms-to-websites/). It is an easy-to-use form generator, that adds customer input directly to your Content Objects. ### Check the result -After the `Create` action on the `Contact form` (or submitting Contact Form based on [Flotiq Forms](https://flotiq.com/docs/panel/flotiq-forms-add-forms-to-websites/)) the RocketChat notification will be triggered: +After the `Create` action on the `Contact Form` (or submitting Contact Form based on [Flotiq Forms](https://flotiq.com/docs/panel/flotiq-forms-add-forms-to-websites/)) the RocketChat notification will be triggered: ![](../images/webhooks/examples/rocket/rocket-3.png){: .border} @@ -157,7 +157,7 @@ To integrate Flotiq Webhooks and AWS Lambda follow the steps below: 3. In the [Flotiq](https://editor.flotiq.com) dashboard go to the `Webhooks` page and click `Add new webhook` 4. Name the webhook (e.g. `Notify AWS Lambda`) and paste obtained `endpoint` URL as a webhook `URL`. 5. As a trigger, choose `Create`, `Update` and `Delete` action on the multiple Content Types: - ![](../images/webhooks/examples/aws-lambda/webhook-aws-2.png){: .border .mt5} + ![](../images/webhooks/examples/aws-lambda/webhook-aws-2.png){: .border .width75 .center .mt5} ### Check the result diff --git a/docs/panel/webhooks/hosted-webhook.md b/docs/panel/webhooks/hosted-webhook.md index fda247af..625a9f35 100644 --- a/docs/panel/webhooks/hosted-webhook.md +++ b/docs/panel/webhooks/hosted-webhook.md @@ -22,7 +22,7 @@ Creating a Hosted Sync Webhook follows a similar process as for sync webhooks. O Once you choose the "Code" option, an embedded code editor will show up, allowing you to easily write code for your hosted webhook without the need for the use of any IDE. The editor will contain example code snippets; one of which allows you to validate the target content object, and the second example that will mutate the content object, automatically creating a slug from the title property. -![](../images/webhooks/AddHostedWebhook.png){: .center .border} +![](../images/webhooks/AddHostedWebhook.png){: .center .border .width75} While the code supports most of the ES2023 syntax, it still has some limitations/requirements: diff --git a/docs/panel/webhooks/sync-examples.md b/docs/panel/webhooks/sync-examples.md index e202123e..0dec8099 100644 --- a/docs/panel/webhooks/sync-examples.md +++ b/docs/panel/webhooks/sync-examples.md @@ -5,7 +5,7 @@ description: How to use sync webhooks in Flotiq - examples ## Example with payload modification In this example we will see how to modify one of the fields of a content object in an external system. -On each update of a `BlogPost` object we will increment the field `edit_counter`. +On each update of a `Blog Post` object we will increment the field `edit_counter`. 1. Add the `edit_counter` field to `BlogPost` CTD, set the field type to `number` and default value to 0. ![](../images/webhooks-lifecycle/AddFieldToBlogPost.png){: .center .border} @@ -40,8 +40,8 @@ On each update of a `BlogPost` object we will increment the field `edit_counter` - provide the URL where your processing app is available - check the `Enabled` field - select the `Update` action to trigger the webhook - - pick the `BlogPost` Content Type Definition as a source for thie webhook. - ![](../images/webhooks-lifecycle/Example1.png){: .center .border} -4. Once the webhook is added - each update on a `BlogPost` object will call the service above and the `edit_counter` field will be incremented! + - pick the `Blog Post` Content Type Definition as a source for thie webhook. + ![](../images/webhooks-lifecycle/Example1.png){: .center .border .width75} +4. Once the webhook is added - each update on a `Blog Post` object will call the service above and the `edit_counter` field will be incremented! diff --git a/docs/panel/webhooks/sync.md b/docs/panel/webhooks/sync.md index cc375473..d402371a 100644 --- a/docs/panel/webhooks/sync.md +++ b/docs/panel/webhooks/sync.md @@ -127,7 +127,7 @@ HTTP 400: In order to create a sync webhook you can follow the same process as for async ones, just pick the "Synchronous" type. Other options can be selected just as for async. -![](../images/webhooks-lifecycle/WebhooksLifecycle.png){: .center .border} +![](../images/webhooks-lifecycle/WebhooksLifecycle.png){: .center .width75 .center .border} Once this is configured - the payload will be sent to an external system and the sync webhook process will be triggered.