# Custom-image2

### custom - image2

> Module position: Position-2
>
> Module class suffix: custom-img

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2FK6dPXhsxLyvZnwEWRQjT%2Fcustom_image2.png?alt=media\&token=33317418-4310-43b1-85c8-a85d76d2b215)

If you want to display your image like this you have to create a custom module and publish the custom module like below

#### Step-1:

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2FShbCLxNWgOVN8ZDeTCqn%2FUnite_Revolution_Slider2_step1.png?alt=media\&token=4ffd1eb7-44b9-4859-b1c9-8c69da7157c6)

#### Step-2:

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2F0K1SDtHKLuvGTUbJFnCF%2Fsocial_share_step2.png?alt=media\&token=5bad5c42-f035-4014-82aa-425b3226d528)

#### Step-3:

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2FIeWtW34RlaiP1KvvjHLJ%2Fcustom_image2_step1.png?alt=media\&token=ef5ddb5d-db79-49f1-a83a-06f1e04a3f1f)

#### Step-4:

Add the following code in your custom module

```html
<div class="custom-image"><img src="images/themeparrot/slideshow/read2.jpg" alt="read2" />
    <div class="overlay">
        <h2>Best Offer</h2>
        <p>
            <a href="#"> <em class="fa fa-plus-square"></em> </a>
        </p>
    </div>
</div>
```