# Post Content Component

The Post Content Component displays information about a post, including its content and engagements.

<figure><img src="https://2352509137-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MX0mOAVWkotGme0iRzu%2Fuploads%2Fjp7jURYbSPADh1zuMumT%2FScreenshot%202024-07-17%20at%2011.34.27%E2%80%AFAM.png?alt=media&#x26;token=690d43db-eb0f-4b60-acce-43b8d991325e" alt="" width="375"><figcaption></figcaption></figure>

### Customization

<table><thead><tr><th width="213">Config ID</th><th width="122">Type</th><th>Description</th></tr></thead><tbody><tr><td>*/post_content/*</td><td>Theme</td><td>User can customize component theme.</td></tr><tr><td>*/post_content/moderator_badge</td><td>Element</td><td>User can change icon and wording of Moderator Badge.</td></tr><tr><td>*/post_content/timestamp</td><td>Element</td><td>User can hide timestamp.</td></tr><tr><td>*/post_content/menu_button</td><td>Element</td><td>User can change icon of menu button.</td></tr><tr><td>*/post_content/reaction_button</td><td>Element</td><td>User can change reaction button icon and wording.</td></tr><tr><td>*/post_content/comment_button</td><td>Element</td><td>User can change comment button icon and wording.</td></tr><tr><td>*/post_content/share_button</td><td>Element</td><td>User can change share button icon and wording.</td></tr></tbody></table>

For more details on customization, please refer to the [Customization](https://docs.social.plus/social-plus-uikit/uikit-4/customization) page.

### Usage <a href="#usage" id="usage"></a>

The Post Content Component can be used in the app if you already have an AmityPost object from social.plus SDK.

{% tabs %}
{% tab title="iOS" %}
{% embed url="<https://gist.github.com/amythee/65e5a7dde7deee76e93a7e2624e242a9>" %}
{% endtab %}

{% tab title="Android" %}
{% embed url="<https://gist.github.com/9d3a0a0eba4bb6d39171ee6b98e7ddbe>" %}
{% endtab %}

{% tab title="Web" %}
{% embed url="<https://gist.github.com/amythee/b2935b60715e01825c9a58a636322f0a>" %}
{% endtab %}

{% tab title="React Native" %}
{% embed url="<https://gist.github.com/amythee/1f58d75e6a2c28030889829970748307>" %}
{% endtab %}

{% tab title="Flutter" %}
{% embed url="<https://gist.github.com/amythee/31f09b1d3ba8c82c390070e4364c4e82>" %}
{% endtab %}
{% endtabs %}

### Navigation Behavior

Custom navigation behavior can be implemented to enhance or modify the interaction flow on the AmityPostContentComponent.

For more details, please refer to the [Overriding Navigation Behavior](https://docs.amity.co/amity-uikit/uikit-v4-beta/customization/overriding-navigation-behaviour) page.

{% tabs %}
{% tab title="iOS" %}
{% embed url="<https://gist.github.com/amythee/d3cfa869a3eaa49806b73e44957ade4c>" %}
{% endtab %}

{% tab title="Android" %}
{% embed url="<https://gist.github.com/e7c75e6dde0532689ec176d00767cfef>" %}
{% endtab %}

{% tab title="Web" %}
{% embed url="<https://gist.github.com/amythee/b2935b60715e01825c9a58a636322f0a>" %}
{% endtab %}

{% tab title="React Native" %}
{% embed url="<https://gist.github.com/e7c75e6dde0532689ec176d00767cfef>" %}
{% endtab %}
{% endtabs %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.social.plus/social-plus-uikit/uikit-4/social/post/post-details-page/post-content-component.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.