Лесно добавяне на дата и календар в уебсайт с HTML код

Календарите са трудни за създаване, но има начини, които са проектирани, за да ви позволят да изградите календар, да персонализирате оформлението му или да изберете модел с готов дизайн, който да интегрирате във вашия уебсайт с няколко реда HTML код.

Добавянето на дата и календар се използват от уеб дизайнерите, програмистите, както и от собствениците на сайта, за да развиват и обогатяват визията и съдържанието.

В тази статия ще ви покажем един от начините, по който собствениците на сайт могат да добавят дата и календар на техния уебсайт.

 1  Дата и календар с HTML код

Дата и календар с HTML код е първият пример, който ще ви предложим за вашия сайт. Визията е максимално изчистена, което го прави подходящ за сайтове с различна цветова схема и дизайн.

Календарът се появява, когато поставите курсора на мишката върху полето с датата и кликнете върху черната стрелка в дясно сочеща надолу.

Можете да прелиствате месеците със стрелките наляво или надясно, да проверите дата, която е била преди или ще бъде след няколко години.

Демо: 

HTML код:

<input type="date" id="davaToday">

<script>document.getElementById('davaToday').valueAsDate = new Date();</script>

 2  Месец, година и календар с HTML код

Месец, година и календар с HTML код е второто ни предложение за сайта ви.

Варианта е по-опростен, като ще се вижда само текущия месец и година, календара се отваря като се кликнете върху черната стрелка в полето в дясно.

Демо: 

HTML код:

<input type="month" id="monthToday">

<script>document.getElementById('monthToday').valueAsDate = new Date();</script>

 3  Седмица, година и календар с HTML код

Седмица, година и календар с HTML код е третия вариант за интегриране в сайта ви, който ще ви предложим. Той ще визуализира само поредността на седмицата и годината.

Отново календара е скрит и се отваря само когато се кликне върху стрелката в края на полето. Визията на календара е малко по-различна защото е добавена колонка с номер за поредността на седмицата.

Демо: 

HTML код:

<input type="week" id="weekToday"><script>document.getElementById('weekToday').valueAsDate = new Date();</script>

И трите календара са една чудесна добавка към съдържанието на вашия уебсайт, която можете да вградите изключително лесно, като просто копирате HTML кода и го добавите на мястото, където искате той да се визуализира.