Bootstrap Datepicker
CSS / HTML / JavaScript / jQuery

How to use Bootstrap Datepicker in Bootstrap 4

Bootstrap Datepicker

Maybe you are struggling with Bootstrap 4 when trying to make a Date picker input in your project using Bootstrap 4. Remember that bootstrap-date picker is not a part of the Bootstrap. So first we include it and then initialize it.

Include Bootstrap-Date picker CSS after Bootstrap 4 CSS:

<link href="" rel="stylesheet"/>

Now add Bootstrap-Date picker JS and initialize it:

Note: Make sure you have included jQuery plugin before including the given js.

<script src=""></script>
    weekStart: 1,
    daysOfWeekHighlighted: "6,0",
    autoclose: true,
    todayHighlight: true,
  $('#datepicker').datepicker("setDate", new Date());


<input type="text" name="" class="form-control" id="datepicker">

Thanks for visiting.


I am a Full Stack Web Developer. I have more than 8 years of experience in the web design and development industry.

Leave a Reply

Your email address will not be published. Required fields are marked *