joomla/Component-Builder
joomla/Component-Builder
39
23
Fork 11
Code Issues 82 Pull Requests Projects 4 Wiki Activity
Page: 060 The custom dashboard option in JCB
Pages
001 Hello World with Joomla Component Builder 002 Intro to JCB 003 Installation of JCB 004 General Planning 005 Field Types 006 Basic Fields 007 Admin Views 008 Advanced Fields 009 Adding Admin Views to a Component 010 Component Settings 011 Component Scripts 012 Component FTP and more 013 dynamicGet 014 Adding dynamicGet to a Site View 015 Adding Templates and Layouts to a Site View 016 Template Setup 017 Layout Setup 018 Custom Admin Views 019 Adding Site Views to a Component 020 Adding Custom Admin Views to a Component 021 Tweaking MySQL Demo Data 022 Global Settings of Component Builder 023 Adding a custom time field 024 How to integrate the Create User Helper Method in your Components 025 How to use email helper in your components 026 How to setup a store message method along side the email helper class 027 How to ensure that a field is not escaped when added to list views 028 How to change exported values and setup custom import options 029 How to overwrite the custom fields 030 How to filter a list field based on association with another field 031 Automatic import of custom code during compilation in JCB 032 JCB manual custom code implementation 033 Export Import of fully mapped components 034 How to add Custom Buttons in JCB to your component Admin Area 035 Translation Mananger in JCB explained 036 Setting Site View Permission 037 Auto create SQL updates for Componets in JCB 038 Setup Site Edit View in JCB 039 Automated backup system in JCB 040 Adding Helper Structures to any JCB component 041 Upgrade to JCB v2.5.8 and using the new Admin View and Admin Fields 042 How to setup tabs after upgrade to v2.5.8 in JCB 043 Major Release of JCB v2.6.0 044 Hello World Component with Joomla Component Builder Creator Extended 045 Adding your own rule validation to a field in JCB 046 General overview of how community snippets work 047 Tutorial on forking JCB snippets so you can share your snippets with the rest of the Community 048 Tutorial on making a pull request at Joomla Component Builder Snippets 049 The New Library Manager Area 050 Easy Translation via excel 051 Dynamic Router Implementation Explained 052 Automated database updates in Joomla during development of a component 053 Quick Subform Demonstration 054 VDM Package Import Option 055 Dynamic File and Folder Inclusion concept 056 How to use the file field type to upload a file in JCB 057 Drag and Drop Upload functionality in JCB 058 The Quick Hello Word with JCB 059 Adding none database fields to an admin view 060 The custom dashboard option in JCB 061 Add or Remove Prefix to Component Name in Joomla Menu 062 Add your own JCB packages to the JCB Communty Directory 063 Proposed Collaborative Workflow in JCB 064 How to install jcb packages 065 JAB18 Using Joomla Component Builder 066 The new fields Area to make things easier 067 Adding Language String to your Component and get the Language Placeholder for dynamic use 068 Library Manager Anticipated Functionality 069 Join Fields in the admin list view with field relations 070 How to change the License Template in JCB 071 Reuse Custom Code 072 Setup Local Development Environment with Bitnami 073 JCB Fields Type Extended 074 How to add Joomla Custom Fields 075 Expand Custom Field Type Beyond The Default 076 A Quick Demonstration to Load a List of Items in a Site View 077 Run Expansion Explained 078 How to Add a Form to a Site View 079 Update the Site Form Field via URL Parameter 080 How to Add More Helper Methods to Your Components Helper Class 081 Easy Validation Rules for Fields in JCB 082 New Placeholders Feature 083 Manage a Components Global Config Option Field in Relation With Menu Params 084 Default Database Values can be set per Field Type Beta Testing Component Settings Develop a Joomla Component Guide to use the Component Builder Developing with Joomla Component Builder Home PHP Settings TIPS: Custom Code Using the JCB Demo Component While Building Your Local Development System
6 060 The custom dashboard option in JCB
Amigo edited this page 2019-09-26 09:31:21 +02:00
Table of Contents

THE CUSTOM DASHBOARD OPTION IN JCB

Adding Your Own Custom Dashboard To Your Component

00:00:00 (Click on these time links to see Youtube video)

The option to add your own custom dashboard to your component has finally come. I might have mentioned this in some previous tutorials but it is somewhat hidden. In the past, all components layouts ended up as the dashboard that looks like this but obviously with your own icons. You could only do what you see here. This is still the default dashboard. If you do not add your own, they will build this for you. Based on your fields, icons, and layout selection.

Adding Tabs

00:00:43

You could add tabs as we have here. These tabs are quite powerful. You can add a lot of functionality within that. For some of you, this might be boring and not what you would like. In fact, you do want it to look different and not to look like it was built with JCB. What makes components valuable is that they are unique. That is why JCB exists, it exists because I did not want a cookie-cutter component. 00:01:22 I wanted to build my own components that look different from others and yet have similar behavior. None of the others out there could do that for me. We ended up looking like the one we are using. 00:01:42 With JCB we constantly are trying to make sure that this is not the case, in fact, that is why the site view area is a bit more difficult. We want to give you the opportunity to express the functionality of your components in a way that is unique to you. This might be a challenge but in the long run believe me, it is the advantage if you are familiar with JavaScript or CSS or HTML. 00:02:13 So there is a little bit of incentive to get your head around some of these technologies.

Open Hello World Component - Dashboard

00:02:41

We have this common known Hello World Component open on the website, this is its dashboard. It does not have a custom dashboard and I am not going to add one at this point, but I am going to take away the dashboard it has, then it behaves like the article manager for example. If we would go in the Joomla Components area there is a tab called Dash & Install. You will see it has a Default, and it has some description of what that means. If you click on Dynamic 00:03:27 it gives you a list of all the available Sites Views that are linked to the component. That would be Custom Admin Views as well as normal Admin views. It will show you a list of them all. You can then select any of those. That will become the new dashboard for your component. Save and close. 00:03:52 Go to the compiler and compile the Hello World Component, and reinstall. To demonstrate how that changed, our components behavior we are going to install. Go to components and click on Hello World link 00:04:17 to see what it does now, as its default dashboard. It loads the list view and the dashboard is gone. From this point forward your Hello World Component looks like this. It does not have a dashboard.

Use A Custom Dashboard - JCB Compiler Dashboard

00:04:34

You could use a custom dashboard, which in our case if you are using a component that has Custom Admin Views. JCB has the compiler and has a snippets area as Custom Admin Views. If we were to do a similar thing with JCB, we could select one of those, 00:05:04 say Dynamic and select one of those views, scroll down a bit to the Compiler. We could make the Compiler JCB's Dashboard. 00:05:20 It is going to break a lot of things somehow I suppose. Let's try it out. We have JCB, we switched it to have another dashboard instead of the normal dashboard. We are going to compile it and install. Before I install it, I just want to tell you what I meant by things that may break. We have a bunch of tabs, and all these tabs are getting information and making it available to you, that you could get information from us. 00:05:50 We have the version, the last build date, you are going to remove this whole area. We just did. If I click on this install, we will first see it tells us that this language string is no longer here. At first, it seems like it has a broken issue, but if we refresh it, you will see that it removed it. It is just a catch thing there. 00:06:23 The dashboard is gone and if I was to go and click on Component Builder, it will from now on opens right at the Compiler, and will be its default page. The behavior is correct. We do not see any issues. If you were to go to the code, Dashboard is completely removed, all its files everything, no trace of it is left. To undo this you could simply say default again, save and close. Compile it again. It will place the dashboard back. No harm was done to the component, but for those of you who want to take the Custom Admin Views 00:07:17 and design, a much more impressive maybe not a boring dashboard, can do so by simply using this new feature. I am sure it is going to be a lot of fun. We refresh it, the dashboard is back and if you click on it everything is fine again.