Image next to form

Hi,

I have replied to your similar query in Rainmaker support Forum. Adding it again, I hope it will be helpful.

There is no direct way achieve this, but it can be done with some custom css.
Please add the below css code in Icegram Campaign Settings Page > Custom code > CSS area.

#ig_this_message .ig_form_container{
padding-left: 80px;
}
#ig_this_message .ig_form_container:after{
    position: absolute;
    content: '';
    height: 100%;
    width: 60px;
    background-image: url(https://megamel.co.za/wp-content/uploads/2017/04/test-200x300.jpg);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    top: unset;
    left: 10px;
    bottom: 0;
}

Please refer this blog – How to add custom code with Icegram?
You may require to do some adjustment for image size and form left padding.

Let me know, if you still need any help on this.

Ravi Oza,
Team Icegram.

• This reply was modified 7 years, 7 months ago by Ravi Oza.

Hi, Thanks so much works great! Just one problem though the image goes over the text if you view it on a smart phone what would i need to alter?

Hi,

We also need to add some css for mobile devices, after the above customisation.
Add below css with the above code.

@media only screen and (max-width: 768px){
    #ig_this_message .ig_form_container:after{
        bottom: -2em;
    }
}

I hope this helps.

Ravi Oza,
Team Icegram.

Hi,

I have checked the Icegram message on your site and it looks the above CSS has fixed the issue for mobile view.

I am marking this as resolved.
You can contact us if you need any help.

Thank you ??

Ravi Oza,
Team Icegram.