Dropify

														
<div class="col">
	<input type="file" id="input-file-now" class="dropify" />
</div>
													

														
<!-- Dropify JavaScript -->
<script src="vendors/dropify/dist/js/dropify.min.js"></script>	

$('.dropify').dropify({
	messages: {
		'default': 'Upload a high quality image to Make your blog post inviting',
		'replace': 'Drag and drop or click to replace',
		'remove':  'Remove',
		'error':   'Ooops, something wrong happended.'
	},
	tpl: {
		message:'
 
{{ default }}
',
	}
});
													

														
	<div class="col-sm-2">
		<div class="dropify-circle">
			<input type="file"  class="dropify-1"/>
		</div>
	</div>
	<div class="col-sm-2">
		<div class="dropify-square">
			<input type="file"  class="dropify-1"/>
		</div>
	</div>
													

														
$('.dropify-1').dropify({
	messages: {
	  'default': 'Upload Photo',
  },
  tpl: {
	  message:'
 
{{ default }}
',
  }
});
													

														
<div class="dropify-circle edit-img">
	<input type="file"  class="dropify-1" data-default-file="dist/img/avatar1.jpg"/>
</div>
													

														
$('.dropify-1').dropify({
	messages: {
		'default': 'Upload Photo',
	},
	tpl: {
		message:'
 
{{ default }}
',
	}
});