# Timeline event template custom design.

**URL:** <https://community.hubspot.com/t/timeline-event-template-custom-design/31896>\
**Category:** CMS Development\
**Created:** [February 17, 2021, 7:06am UTC](https://community.hubspot.com/t/timeline-event-template-custom-design/31896 "2021-02-17T07:06:00Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![ADTPriya](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/adtpriya/32/68963_2.png) [@ADTPriya](https://community.hubspot.com/u/ADTPriya)\
**Post date:** [February 17, 2021, 7:06am UTC](https://community.hubspot.com/t/timeline-event-template-custom-design/31896/1 "2021-02-17T07:06:00Z")

</div>

Hi,

I am currently trying to create template for contacts timeline using [Developers | HubSpot](https://app.hubspot.com/developer/%5C)/application/\<appId\>/event-templates.

I have few queries regarding the template which I am working right now.

1. I wanted to implement my own design for the template. How do I create my own inside hubspot?

2. Whenever I use extraData in detailsTemplate, I could see [Details](https://app.hubspot.com/developer/9185528/application/238759/event-templates)

toggle button in timeline records. So Is it possible to remove the toggle button by using template design?

3. How to integrate custom module into timeline template?

Could anybody please suggest me a better solution?

Thanks in advance.

---

<div class="post-metadata">

**Author:** ![mangelet](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/mangelet/32/83031_2.png) [@mangelet](https://community.hubspot.com/u/mangelet)\
**Post date:** [February 17, 2021, 11:40am UTC](https://community.hubspot.com/t/timeline-event-template-custom-design/31896/2 "2021-02-17T11:40:38Z")

</div>

@ADTPriya usually you would add a custom module into a template.

and that custom module should know of a few props for showing event data.

you can add your custom module into: HTML + HubL and Drag and Drop templates

using hubl will look like this

```lia-code-sample
{% module "event" path="@hubspot/custom-events",
 label="Event name",
 date="2021-02-16"
%}

```

---

<div class="post-metadata">

**Author:** ![ADTPriya](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/adtpriya/32/68963_2.png) [@ADTPriya](https://community.hubspot.com/u/ADTPriya)\
**Post date:** [February 17, 2021, 1:11pm UTC](https://community.hubspot.com/t/timeline-event-template-custom-design/31896/3 "2021-02-17T13:11:29Z")

</div>

Would it be possible to have this under detailed templates of event type creation page?  
Because , I couldn’t add these template into it, it is reflecting as is in the timeline activity.

---

<div class="post-metadata">

**Author:** ![mangelet](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/mangelet/32/83031_2.png) [@mangelet](https://community.hubspot.com/u/mangelet)\
**Post date:** [February 17, 2021, 7:57pm UTC](https://community.hubspot.com/t/timeline-event-template-custom-design/31896/4 "2021-02-17T19:57:35Z")

</div>

Not sure what your are saying now.  
But this works for any kind of template as stated before.

---

<div class="post-metadata">

**Author:** ![ADTPriya](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/adtpriya/32/68963_2.png) [@ADTPriya](https://community.hubspot.com/u/ADTPriya)\
**Post date:** [February 18, 2021, 7:37am UTC](https://community.hubspot.com/t/timeline-event-template-custom-design/31896/5 "2021-02-18T07:37:17Z")

</div>

I wanted to design (like using some sort of tables, background color etc) a timeline activity records in Hubspot event template creation page where we have two sections one is header template and another oner is detailed template.

Right now, I could create a conditional rendering of data with the help of handlebars and markdown. So what I’m asking here is it possible to make css styles or futher more design especially for timeline templates?

[[Developers | HubSpot](https://app.hubspot.com/developer/9185528/application/238759/event-templates)]([http://Event](http://Event)%20template creation)

---

<div class="post-metadata">

**Author:** ![mangelet](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/mangelet/32/83031_2.png) [@mangelet](https://community.hubspot.com/u/mangelet)\
**Post date:** [February 18, 2021, 3:29pm UTC](https://community.hubspot.com/t/timeline-event-template-custom-design/31896/6 "2021-02-18T15:29:52Z")

</div>

@ADTPriya Sure! You can crate anything adding the right css. HubSpot uses timelines a lot (= we do so as well) tipically for presenting an event agenda).