Como usar FullCalendar com Bootstrap 5
Neste tutorial, será apresentado como integrar o FullCalendar com o Bootstrap 5.
Primeiramente, será mostrado como incluir o Bootstrap na página.
Por fim, será mostrro como usar o Bootstrap com o FullCalendar.
Download do código fonte desenvolvido na aula: Download
Curso de PHP Developer: Mais Detalhes do Curso
Playlist completa sobre como usar Fullcalendar com PHP: Acessar
Receber as aulas gratuitas do curso de PHP Developer: Acessar
Para começar, é utilizado como base o projeto da aula "Como usar FullCalendar com PHP e listar eventos do banco de dados".
Primeiramente, incluído o CSS e JavaScript do Bootstrap.
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>É necessário indicar ao FullCalendar para utilizar o Bootstrap. No projeto é incluido no arquivo "custom.js".
// Incluir o bootstrap 5
themeSystem: 'bootstrap5',Também é necessário incluir o JavaScript fornecido pelo FullCalendar para integrar com Bootstrap.
<script src="js/bootstrap5/index.global.min.js"></script>Baixar o código-fonte completo do projeto.
Bom, era isso. Espero que o tutorial tenha sido útil!