As you can see in the image there is an image input field , i want to change that in image icon, How can i change that in a image icon instead of browse.. button ,

Inside form.py I defined the fields classes :
class Meta:
        model = Blog
        fields = ('tag',"title","image_data","body",)
        widgets ={
            'image_data': forms.FileInput(attrs={'class':'control-flow blogimage'})
        }
custom.css
.blogimage{
    style:fa fa-image;
}
html
<h1>Create a new blog</h1>
<form enctype="multipart/form-data" method="POST">
    {% csrf_token %}
    {% bootstrap_form form %}
    
    <input type="submit" value='Publish' class="btn btn-primary btn-large">
</form>
generated html of imagefield :
<div class="form-group"><label class="control-label" for="id_image_data">Image data</label><input type="file" name="image_data" class="blogimage" accept="image/*" title="" required="" id="id_image_data"></div>
If more information or code is require than tell me in comments session I will update my question with that information.
