Create you own calendar in php

Create Custom calender using PHP</h2> <xmp>Hi guys in generally 90% developers are using predefine calenders in javascript or jquery, that is good and enough for almost all purposes. But some time need to add some additional feature in calendar which is not available freely. Thats by in this tutorial I am trying to create own calendar upto next 12 months which is ajustable. Lets start 1) We need to create something like this or flexible array which is also use for API"s. <img alt="" src="https://myinboxhub.co.in/upload/blog/calendar.PNG" style="height:200px; width:400px" /> 2) I am going to use php because I am going to create calendar array which is useful for ploting dates and in API"s for front end; 3) Let start coding part; <?php $CurrentDay = date("d"); /* For current date*/ $CurrDate = strtotime(date("Y-m-d")); /* For current Date Y-m-d */ /* Now*/ for ($i = 0; $i < 12; $i++) { $r = 0; $daysA = [] $months = date("Y-m-d", strtotime("+" . $i . " month")); $monthAlpha = date("M Y", strtotime("+" . $i . " month")); $DaysInCurrMonths = cal_days_in_month(CAL_GREGORIAN, date("m", strtotime($months)), date("Y", strtotime($months))); $monthsArr[$months]["month"] = $months; $monthsArr[$months]["monthAlpha"] = $monthAlpha; $mon = date("m",strtotime($months)); $yr = date("Y",strtotime($months)); $day = date("D", strtotime(date($yr."-".$mon."-"."01"))); if($day == "Fri"){ $skipVal = 5; } elseif($day == "Sun"){ $skipVal = 0; } elseif($day == "Wed"){ $skipVal = 3; } elseif($day == "Sat"){ $skipVal = 6; } elseif($day == "Tue"){ $skipVal = 2; } elseif($day == "Mon"){ $skipVal = 1; } elseif($day == "Thu"){ $skipVal = 4; } for($ij=0;$ij<$skipVal;$ij++){ $daysA[$ij] = ""; } $r = $skipVal; for ($y = 1; $y <= $DaysInCurrMonths; $y++) { array_push($daysA,$y); $r++; } $monthsArr[$months]["days"] = ($daysA); } 4) $monthsArr is contains list of days with month; 5) Array showing something like this; <img alt="" src="https://myinboxhub.co.in/upload/blog/show array.PNG" style="height:469px; width:400px" /> and so on; 6) Now try to plot these day on page; 7) Let start; $po = 0; $content = "<div id="myCarousel" class="carousel slide myCarousel" data-ride="carousel">"; $content .= "<div class="carousel-inner">"; foreach ($monthsArr as $key => $value) { if ($po == 0) { $active = "active"; } else { $active = ""; } $content .= "" . "<div class="main-div item " . $active . ""> " . "<div>" . date("M Y", strtotime($key)) . "</div>" . "<div class="week_row">" . "<div class="week_day">Su</div>" . "<div class="week_day">Mo</div>" . "<div class="week_day">Tu</div>" . "<div class="week_day">We</div>" . "<div class="week_day">Th</div>" . "<div class="week_day">Fr</div>" . "<div class="week_day">Sa</div>" . "</div>" . "<div class="week_days">"; $g = 1; $ui = 1; $content .= "<div class="row">"; foreach ($value["days"] as $dkey => $dvalue) { if (($g % 8) == 0) { $content .= "</div>"; $content .= "<div class="row">"; $g = 1; } $loopDate = strtotime($key); if ($loopDate == $CurrDate) { if ($CurrentDay == $dvalue) { $currentDays = "currentDay"; } else { $currentDays = ""; } } else { $currentDays = ""; } $loop2 = strtotime(date("Y-m", strtotime($key)) . "-" . $dvalue); if ($loop2 < $CurrDate &amp;&amp; !empty($dvalue)) { $DisabledDates = "DisabledDates"; } else { $DisabledDates = ""; } $content .= "<div class="week_day " . $currentDays . " " . $DisabledDates . "">" . $dvalue . " <br></div>"; $g++; $ui++; } $content .= "</div></div>" . "</div>"; $po++; } $content .= "</div>"; $content .= "</div>"; $content .= "<style> .week_day{cursor:pointer;display:inline-block; width:40px; height:40px;text-align: center;} .main-div{border:1px solid #ddd;display:inline-block; height:300px;overflow:hidden;} .currentDay{background:red; color:#fff;}.DisabledDates{opacity: .5;cursor: not-allowed;} .main-div1{ display: inline-grid; width: 50%; border: 1px solid #ddd; height: 300px; } .main-div2{ background:#fff; margin-top: 10px; } #myCarousel{ width: 590px; height: 365px; background: white; padding: 0px; padding-top: 55px; position: absolute; z-index: 9; box-shadow: 0 1px 6px 0 rgba(0,0,0,.2); } .monthAlpha{ text-align:center; }</style>"; 8) Finaly showing something like <img alt="" src="https://myinboxhub.co.in/upload/blog/final.PNG" style="height:502px; width:400px" /> 9) And rest is a part of style and css what type of calendar you want to display such as (as slider, or list view or single month at time).

Thanks for reading this article, I hope you like it, now its time for try it.</h3> <xmp>Video tutorial will available soon so do not forgot to subscribe our video tutorial Youtube channel https://www.youtube.com/channel/UCXODjxyN408dUUheWC9g6kA?view_as=subscriber