{"id":4719,"date":"2023-09-18T03:50:06","date_gmt":"2023-09-18T03:50:06","guid":{"rendered":"https:\/\/rengga.dev\/blog\/?p=4719"},"modified":"2023-09-18T04:05:23","modified_gmt":"2023-09-18T04:05:23","slug":"the-laravel-tablar-admin-dashboard-package","status":"publish","type":"post","link":"https:\/\/rengga.dev\/blog\/the-laravel-tablar-admin-dashboard-package\/","title":{"rendered":"The Laravel Tablar Admin Dashboard Package"},"content":{"rendered":"<p>The\u00a0<a href=\"https:\/\/github.com\/takielias\/tablar\">Laravel Tablar<\/a>\u00a0Admin Dashboard Package is a beautiful, feature-rich admin dashboard Template using Laravel,\u00a0<a href=\"https:\/\/tabler.io\/\">Tabler.io<\/a>, and Vite. Using Tabler, you can access a free and open-source web application UI kit based on Bootstrap\u00a05, with hundreds of responsive components and multiple layouts:<\/p>\n<figure id=\"attachment_4720\" aria-describedby=\"caption-attachment-4720\" style=\"width: 3176px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-4720 size-full\" src=\"https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-001.png\" alt=\"The Laravel Tablar Admin Dashboard Package\" width=\"3176\" height=\"1990\" srcset=\"https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-001.png 3176w, https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-001-768x481.png 768w, https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-001-1536x962.png 1536w, https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-001-2048x1283.png 2048w\" sizes=\"auto, (max-width: 3176px) 100vw, 3176px\" \/><figcaption id=\"caption-attachment-4720\" class=\"wp-caption-text\">The Laravel Tablar Admin Dashboard Package<\/figcaption><\/figure>\n<p>This package provides a beautiful starting point for dashboards and related components, helping you build a polished dashboard quickly. Key features of this package include:<\/p>\n<ul>\n<li>Seamless integration with Laravel<\/li>\n<li>Responsive design<\/li>\n<li>Easily customizable components<\/li>\n<li>Dynamic Menu Generation<\/li>\n<\/ul>\n<p>This package also supports dark and light modes, a complimentary CRUD generator package, and more. Here&#8217;s an example of how you might use the package&#8217;s provided template:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"php\">@extends('tablar::page')\r\n \r\n@section('content')\r\n    &lt;!-- Page header --&gt;\r\n    &lt;div class=\"page-header d-print-none\"&gt;\r\n        &lt;div class=\"container-xl\"&gt;\r\n            &lt;div class=\"row g-2 align-items-center\"&gt;\r\n                &lt;div class=\"col\"&gt;\r\n                    &lt;h2 class=\"page-title\"&gt;\r\n                        Empty page\r\n                    &lt;\/h2&gt;\r\n                &lt;\/div&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n    &lt;!-- Page body --&gt;\r\n    &lt;div class=\"page-body\"&gt;\r\n        &lt;div class=\"container-xl\"&gt;\r\n            @if(config('tablar','display_alert'))\r\n                @include('tablar::common.alert')\r\n            @endif\r\n \r\n            &lt;!-- Page Content goes here --&gt;\r\n \r\n        &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n@endsection<\/pre>\n<p>This package has a demo you can experiment with at\u00a0<a href=\"https:\/\/tablar.ebuz.xyz\/\">tablar.ebuz.xyz<\/a>, which demonstrates a dashboard table, an alerts UI, a light\/dark theme toggle, and more:<\/p>\n<figure id=\"attachment_4721\" aria-describedby=\"caption-attachment-4721\" style=\"width: 2206px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-4721 size-full\" src=\"https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-002.png\" alt=\"The Laravel Tablar Admin Dashboard Package\" width=\"2206\" height=\"1194\" srcset=\"https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-002.png 2206w, https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-002-768x416.png 768w, https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-002-1536x831.png 1536w, https:\/\/rengga.dev\/blog\/wp-content\/uploads\/2023\/09\/tablar-002-2048x1108.png 2048w\" sizes=\"auto, (max-width: 2206px) 100vw, 2206px\" \/><figcaption id=\"caption-attachment-4721\" class=\"wp-caption-text\">The Laravel Tablar Admin Dashboard Package<\/figcaption><\/figure>\n<p>You can learn more about this package, get full installation instructions, and view the\u00a0<a href=\"https:\/\/github.com\/takielias\/tablar\">source code<\/a>\u00a0on GitHub.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The\u00a0Laravel Tablar\u00a0Admin Dashboard Package is a beautiful, feature-rich admin dashboard Template using <a class=\"read-more\" href=\"https:\/\/rengga.dev\/blog\/the-laravel-tablar-admin-dashboard-package\/\" title=\"The Laravel Tablar Admin Dashboard Package\" itemprop=\"url\"><\/a><\/p>\n","protected":false},"author":1,"featured_media":4608,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12],"tags":[711,709,708,710],"newstopic":[576,597,574],"class_list":{"0":"post-4719","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-web-development","8":"tag-admin-dashboard","9":"tag-bootstrap-5","10":"tag-laravel","11":"tag-tablar","12":"newstopic-bootstrap","13":"newstopic-laravel","14":"newstopic-php"},"_links":{"self":[{"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/posts\/4719","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/comments?post=4719"}],"version-history":[{"count":1,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/posts\/4719\/revisions"}],"predecessor-version":[{"id":4722,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/posts\/4719\/revisions\/4722"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/media\/4608"}],"wp:attachment":[{"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/media?parent=4719"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/categories?post=4719"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/tags?post=4719"},{"taxonomy":"newstopic","embeddable":true,"href":"https:\/\/rengga.dev\/blog\/wp-json\/wp\/v2\/newstopic?post=4719"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}