diff --git a/examples/reference/chat/ChatMessage.ipynb b/examples/reference/chat/ChatMessage.ipynb
index 90eb68fa01..84c0e4ef41 100644
--- a/examples/reference/chat/ChatMessage.ipynb
+++ b/examples/reference/chat/ChatMessage.ipynb
@@ -45,6 +45,8 @@
     "* **`user`** (str): Name of the user who sent the message.\n",
     "* **`avatar`** (str | BinaryIO): The avatar to use for the user. Can be a single character text, an emoji, or anything supported by `pn.pane.Image`. If not set, uses the first character of the name.\n",
     "* **`default_avatars`** (Dict[str, str | BinaryIO]): A default mapping of user names to their corresponding avatars to use when the user is set but the avatar is not. You can modify, but not replace the dictionary. Note, the keys are *only* alphanumeric sensitive, meaning spaces, special characters, and case sensitivity is disregarded, e.g. `\"Chat-GPT3.5\"`, `\"chatgpt 3.5\"` and `\"Chat GPT 3.5\"` all map to the same value.\n",
+    "* **`footer_objects`** (List): A list of objects to display in the column of the footer of the message.\n",
+    "* **`header_objects`** (List): A list of objects to display in the row of the header of the message.\n",
     "* **`avatar_lookup`** (Callable): A function that can lookup an `avatar` from a user name. The function signature should be `(user: str) -> Avatar`. If this is set, `default_avatars` is disregarded.\n",
     "* **`reactions`** (List): Reactions associated with the message.\n",
     "* **`reaction_icons`** (ChatReactionIcons | dict): A mapping of reactions to their reaction icons; if not provided defaults to `{\"favorite\": \"heart\"}`. Provides a visual representation of reactions.\n",
@@ -178,6 +180,35 @@
     ")"
    ]
   },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "However, if you're serializing output, it's better practice to put other objects into the `header_objects` or `footer_objects` of the `ChatMessage` so that you don't have to write a custom serializer to handle nested Panel components."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "pn.Column(\n",
+    "    ChatMessage(\n",
+    "        \"Yes. I want to hear some beat boxing\", user=\"Music Lover\", avatar=\"🎸\"\n",
+    "    ),\n",
+    "    ChatMessage(\n",
+    "        pn.pane.Audio(\n",
+    "            \"https://assets.holoviz.org/panel/samples/beatboxing.mp3\",\n",
+    "        ),\n",
+    "        header_objects=[pn.pane.HTML(\"Here goes. Hope you like this one?\", margin=(5, 0))],\n",
+    "        footer_objects=[pn.widgets.ButtonIcon(icon=\"download\", description=\"Download this! (not implemented here)\")],\n",
+    "        user=\"Beat Boxer\",\n",
+    "        avatar=\"🎶\",\n",
+    "    ),\n",
+    ")"
+   ]
+  },
   {
    "cell_type": "markdown",
    "metadata": {},
diff --git a/panel/chat/message.py b/panel/chat/message.py
index 923d88476e..91bac1e4e2 100644
--- a/panel/chat/message.py
+++ b/panel/chat/message.py
@@ -161,6 +161,12 @@ class ChatMessage(PaneBase):
         to use when the user is specified but the avatar is. You can
         modify, but not replace the dictionary.""")
 
+    footer_objects = param.List(doc="""
+        A list of objects to display in the column of the footer of the message.""")
+
+    header_objects = param.List(doc="""
+        A list of objects to display in the row of the header of the message.""")
+
     max_width = param.Integer(default=1200, bounds=(0, None))
 
     object = param.Parameter(allow_refs=False, doc="""
@@ -280,8 +286,10 @@ def _build_layout(self):
             self.param.user, height=20, css_classes=["name"],
             visible=self.param.show_user, stylesheets=self._stylesheets,
         )
+
         header_row = Row(
             self._user_html,
+            *self.param.header_objects.rx(),
             self.chat_copy_icon,
             self._activity_dot,
             stylesheets=self._stylesheets + self.param.stylesheets.rx(),
@@ -295,7 +303,8 @@ def _build_layout(self):
             visible=self.param.show_timestamp
         )
 
-        footer_row = Row(
+        footer_col = Column(
+            *self.param.footer_objects.rx(),
             self._timestamp_html,
             stylesheets=self._stylesheets + self.param.stylesheets.rx(),
             sizing_mode="stretch_width",
@@ -305,7 +314,7 @@ def _build_layout(self):
         self._right_col = right_col = Column(
             header_row,
             self._center_row,
-            footer_row,
+            footer_col,
             css_classes=["right"],
             stylesheets=self._stylesheets + self.param.stylesheets.rx(),
             sizing_mode=None
diff --git a/panel/dist/css/chat_message.css b/panel/dist/css/chat_message.css
index fe39d2ea1c..3a022875ba 100644
--- a/panel/dist/css/chat_message.css
+++ b/panel/dist/css/chat_message.css
@@ -72,7 +72,7 @@
       1px;
   font-size: 1.25em;
   min-height: 50px;
-  margin-block: 0px;
+  margin-top: 0px;
   margin-left: 10px; /* Space for avatar */
   margin-right: 5px; /* Space for reaction */
   background-color: var(--panel-surface-color, #f1f1f1);
@@ -88,7 +88,7 @@
 
 .footer {
   display: flex;
-  flex-direction: row;
+  flex-direction: column;
   align-items: center;
   justify-content: space-between;
 }
@@ -96,7 +96,7 @@
 .timestamp {
   color: #a9a9a9;
   display: flex;
-  margin-top: 3px;
+  margin-top: 0px;
 }
 
 .markdown {
diff --git a/panel/tests/chat/test_message.py b/panel/tests/chat/test_message.py
index 96759e69b8..c30319dd21 100644
--- a/panel/tests/chat/test_message.py
+++ b/panel/tests/chat/test_message.py
@@ -15,6 +15,7 @@
 from panel.pane.image import PNG, SVG, Image
 from panel.pane.markup import HTML, DataFrame, Markdown
 from panel.pane.media import Audio
+from panel.param import ParamFunction
 from panel.tests.util import mpl_available, mpl_figure
 from panel.widgets.button import Button
 from panel.widgets.input import (
@@ -28,7 +29,7 @@
 
 class TestChatMessage:
     def test_layout(self):
-        message = ChatMessage(object="ABC")
+        message = ChatMessage(object="ABC", header_objects=["Header Test"], footer_objects=["Footer Test"])
         columns = message._composite.objects
         assert len(columns) == 2
 
@@ -36,11 +37,15 @@ def test_layout(self):
         assert isinstance(avatar_pane, HTML)
         assert avatar_pane.object == "🧑"
 
-        row = columns[1][0]
-        user_pane = row[0]
+        header_row = columns[1][0]
+        user_pane = header_row[0]
         assert isinstance(user_pane, HTML)
         assert user_pane.object == "User"
 
+        header_objects = header_row[1][0]
+        assert isinstance(header_objects, Row)
+        assert isinstance(header_objects.objects[0], ParamFunction)
+
         center_row = columns[1][1]
         assert isinstance(center_row, Row)
 
@@ -51,10 +56,14 @@ def test_layout(self):
         icons = center_row[1]
         assert isinstance(icons, ChatReactionIcons)
 
-        footer_row = columns[1][2]
-        assert isinstance(footer_row, Row)
+        footer_col = columns[1][2]
+        assert isinstance(footer_col, Column)
+
+        footer_objects = footer_col[0][0]
+        assert isinstance(footer_objects, Row)
+        assert isinstance(footer_objects.objects[0], ParamFunction)
 
-        timestamp_pane = footer_row[0]
+        timestamp_pane = footer_col[1]
         assert isinstance(timestamp_pane, HTML)
 
     def test_reactions_link(self):