# Hubspot Starter templet Css edit

**URL:** <https://community.hubspot.com/t/hubspot-starter-templet-css-edit/84783>\
**Category:** CMS Development\
**Created:** [July 6, 2023, 6:34am UTC](https://community.hubspot.com/t/hubspot-starter-templet-css-edit/84783 "2023-07-06T06:34:11Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Raghavendra](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/raghavendra/32/198072_2.png) [@Raghavendra](https://community.hubspot.com/u/Raghavendra)\
**Post date:** [July 6, 2023, 6:34am UTC](https://community.hubspot.com/t/hubspot-starter-templet-css-edit/84783/1 "2023-07-06T06:34:11Z")

</div>

hi,

i have a problem in a landing page, i need to add whats app image and i need to make that image position fixed, it is a starter templet, no themes or templets are or no code are used.

 ![Capture.PNG](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/c/4c7d60b7674e9c48dd9f9adaef41efa66e67d8b4.png)

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [July 6, 2023, 6:52am UTC](https://community.hubspot.com/t/hubspot-starter-templet-css-edit/84783/2 "2023-07-06T06:52:06Z")

</div>

Hi @Raghavendra,

a fixed image(I assume it should be clickable) isn’t possible by default but you can easily create a custom module and use this on your pages.

The layout of the custom module should look something like this

```lia-code-sample
{% require_css %}
<style>
.fixedImage{
position:fixed;
right:1rem;
top:40%;
}
.clickableImage{
width:3rem;
height:3rem;}
}
</style>
{% end_require_css %}

<div class="fixedImage">
<a href="tel:{{module.whatsapp_number|cut(" ")|replace("+", "00")}}"><img src="{{ module.image.src }}" alt="{{ module.image.src }}" class="clickableImage">
</a>
</div>

```

Add a text(not rich-text) function “whatsapp number” and an image function “image” to the module and you’re ready to go.

One thing to keep in mind - phone numbers have to be only numbers (without slashes, spacings etc.) so either you put the number in the correct format right into the text field or you can use [|cut](https://developers.hubspot.com/docs/cms/hubl/filters#cut) and [|replace](https://developers.hubspot.com/docs/cms/hubl/filters#replace) filters like in the example above.

Let me now if you need further assistance

best,

Anton

---

<div class="post-metadata">

**Author:** ![Raghavendra](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/raghavendra/32/198072_2.png) [@Raghavendra](https://community.hubspot.com/u/Raghavendra)\
**Post date:** [July 6, 2023, 7:05am UTC](https://community.hubspot.com/t/hubspot-starter-templet-css-edit/84783/3 "2023-07-06T07:05:49Z")

</div>

unable to add custom module

 ![Raghavendra_0-1688627143836.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/7/0/705463845b2886f52a2dcaa7e1d5b048a8df781b.png)

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [July 6, 2023, 9:31am UTC](https://community.hubspot.com/t/hubspot-starter-templet-css-edit/84783/4 "2023-07-06T09:31:06Z")

</div>

Hi @Raghavendra,

you have to create and publish a custom module in the design-manager first.

You can find the design-manager here: Marketing-\> Files & Tempaltes → Design tools (the new name of design-manager). The next steps are

- navigate to your theme (if you’re not using a child or custom theme you don’t have to do this)
- select “File” → “New file” in the top left corner of the left sidebar
- select “Module” in the pop-up window
- select the page-types you’d like to use this module in (don’t select Email and/or Quote)
- choose if it should be a local or global module.  
**local modules:** can be used several times and can have different content  
**global module:** can be used several times and have the same content
- type in a name. I recommend to use dashes or underscores instead of spaces like “THIS\_IS-MY-CUSTOM\_MODULE” instead of " THIS IS MY CUSTOM MODULE"
- add a text field(“Whatsapp number”) in the right sidebar
- add an image field(“Image”) in the right sidebar
- Paste the code from the previous answer to the HTML+Hubl area in the middle of the screen
- click on “Publish” in the top right corner
- done

Also - here some useful ressources on module development:

- [getting startet with module development](https://developers.hubspot.com/docs/cms/building-blocks/modules/files)
- [available fields for custom modules](https://developers.hubspot.com/docs/cms/building-blocks/module-theme-fields)

p.s: You might need to change some CSS settings

best,

Anton