docs: updated contentful documentation (#3800)

This commit is contained in:
Shahed Nasser
2023-04-11 18:45:33 +03:00
committed by GitHub
parent 78ff64e783
commit 9b1348df48
2 changed files with 53 additions and 80 deletions

View File

@@ -147,31 +147,16 @@ This runs the Contentful migration in that file and makes the necessary changes
To check if the above migration worked, in your Contentful Space dashboard go to Content Models from the navigation bar. You should see the new content model Rich Text.
![Rich Text can be found among content models](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001241/Medusa%20Docs/Contentful/W5WzcTG_vau6c9.png)
The above migration also allows you to add Rich Text content to pages. To test this out:
The above migration also allows you to add Rich Text content to pages. To test this out, go to Content from the navigation bar and choose Page in the select field next to the search bar. This shows the available pages in your Contentful Space.
![Filter content to only show pages by choosing Page in the Content Type select field](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001251/Medusa%20Docs/Contentful/ht87z4e_gmbk6c.png)
Choose one of the pages. For example, the About page. Then, scroll down to the Add content button. If you click on it, you should be able to choose Rich Text under New Content.
![Click on add content and choose from the dropdown Rich Text](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001261/Medusa%20Docs/Contentful/pJ5yM0m_dfb7vp.png)
Click on Rich Text and a new form will open to create new Rich Text content. It has the same fields that you defined in the migration file.
![The Rich Text form is filled with data](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001271/Medusa%20Docs/Contentful/lAglhc9_ejfs2i.png)
After adding the content you want, click on the Publish button on the right then go back to the About page editor.
![Click on the Publish button at the right](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001281/Medusa%20Docs/Contentful/oYpQKsc_piobfk.png)
Similarly, in the About page editor, click on the Publish Changes button on the right to view these changes later in the storefront.
![Click on the Publish changes button at the right](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001296/Medusa%20Docs/Contentful/DIMo3hd_ylxkr3.png)
Similarly, you can add Rich Text content to any product page.
![A rich text content is added to a product](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001305/Medusa%20Docs/Contentful/wgI8mEB_wbukpd.png)
1. Go to Content from the navigation bar.
2. Choose Page in the select field next to the search bar. This shows the available pages in your Contentful Space.
3. Choose one of the pages. For example, the About page.
4. Scroll down to the Add content button. If you click on it, you should be able to choose Rich Text under New Content.
5. Click on Rich Text and a new form will open to create new Rich Text content. It has the same fields that you defined in the migration file.
6. After adding the content you want, click on the Publish button on the right then go back to the About page editor.
7. Similarly, in the About page editor, click on the Publish Changes button on the right to view these changes later in the storefront.
8. Similarly, you can add Rich Text content to any product page.
---
@@ -259,20 +244,18 @@ export const query = graphql`
To test this out, run your Medusa backend by running this command in its directory:
```bash
```bash npm2yarn
npm run start
```
Then run the Gatsby storefront by running this command in its directory:
```bash
```bash npm2yarn
npm run start
```
This runs the Gatsby storefront on `localhost:8000`. Go to the storefront in your browser and open the About page. You should see the Rich Text content you added.
![Rich Text content you added to the about page should be visible now](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001320/Medusa%20Docs/Contentful/aQAY9Vz_yw4eop.png)
### Render Component in a Product Page
In the example migration, you also edited the product page to include a new Content Modules field that allows inserting Rich Text content.
@@ -339,8 +322,6 @@ This loops over `contentModules` and if the type of the content is Rich Text, it
Restart the Gatsby storefront then open a product that you added Rich Text content to. You should see the Rich Text component at the end of the page.
![Rich Text content you added to the product should be visible at the end of the page](https://res.cloudinary.com/dza7lstvk/image/upload/v1668001342/Medusa%20Docs/Contentful/LGiVMxx_rqsr2l.png)
---
## See Also