<image source="image">
    <caption source="caption"/>
</image>

Put that code in the (portable) infobox template.

It should look something like:

<infobox type="cosmeticbox">
    <title source="title">
        <default><div style="text-align: center;">{{PAGENAME}}</div></default>
        <format><div style="text-align: center;">{{{title}}}</div></format>
    </title>
    <image source="image">
        <caption source="caption"/>
    </image>
    <group>
        <data source="cost">
            <label>{{Label|Cost}}</label>
        </data>
    </group>
</infobox>

The image is set with "image" and its caption with "caption"

Kk ty

Are you talking about creating/editing an infobox or using it on a page? If you are creating/editing an infobox, you can use Special:InfoboxBuilder which provides a graphical interface for creating the infobox. If you are talking about user the infobox on a page, then you just provide the image name as the input for the template parameter belonging to the image tag.