Skip to content

040 Adding Helper Structures to any JCB component

Amigo edited this page Aug 2, 2019 · 20 revisions

ADDING HELPER STRUCTURES TO ANY JCB COMPONENT

Question About Help Menu Integration For JCB Components

00:00:00

Recently an inquiry about Help Menu integration for JCB Components has been made. As may be seen JCB has this Help Document area. Time does not allow to expand upon this Help Document area, perhaps it may be done in future. It is a feature that is very easily added to any other JCB Component.

Purchased Sermon Distributor Key

00:00:39

If you have not purchased the Sermon Distributor Package, there is a place, one of the repositories on the VDM data, called JCB-Packages. Go to vdm-io, and then JCB-Packages on GitHub. Open 'Home' and then under Services, to find JCB-Packages. This package can be downloaded but it can only be used when a key is purchased for it. 00:01:18 This key may be obtained at this link: http://vdm.bz/jcb-packages. There are a few packages available which are fully mapped components in JCB.00:02:13 If this is purchased all information and code and whatever may be necessary will be included which will help you to install the Sermon Distributor Package.

I am going to install the Sermon Distributor Package on this Demo website. This will not be demonstrated here, since all the instructions are included once you have installed the Sermon Distributor Package.

New Admin View - Help Document

00:02:48

Admin Views has this new admin view called 'Help Document'. JCB have this Demo Component by default. To demonstrate it: This Demo Component is opened and a Helper structure is added to it. Presently it does not have any Helper structure. It is just a Demo Component with only a few structures.00:03:28 It only has that Admin View and one view called 'Look'. It does not have a Custom view, but it got a Site view called 'Looks' and 'Looking'. First, go to the Admin Views and click '+' to add another row. We are going to add the View - Help Documents, the support icon.

If this un-ticked problem shows up, just close that and open it again and all those tick boxes will be in place. Repeatable fields will be phased out and you will end up working with sub forms in future. 00:04:19Then the 'View - Help Document' is added, the 'Support' icon will be used, and leave most of this to defaults, except it does not have 'Metadata'. 'Access' is not going to be used. An 'Import' can be done, but it does not have a front end editing. We do not want it to have one and we would have it in the 2nd position, maybe not part of the Main Menu.00:04:52 Save. Then save and close. The Sermon Distributor Package has now been installed in JCB, that added the Help Document Admin View, and I've just linked that view to the Demo component. Go to the Compiler. and compile that Demo Component. As may be seen it is not yet installed on the website. This is quite important not to have it installed on the website. Compile it, and install it.

Demo - Help Document - New

00:05:43

If Demo is opened, it may be seen that it has this new Help Documents area. At the moment it does not have any Help Documents. To change that, go to the Help Documents, click New, and when it is opened, select which group you want to Target. Select all, then select in 'Location', that a view in the Admin Area needs to be targeted. The Demo will be the Desk Dashboard. Then there is 'Help Documents'. 00:06:23 There is 'Import'. The 'Looks' area will be targeted and a title may be given to it. The type of help that is needed may be selected, like a link to an Joomla article is needed, or to put in preferred custom text, or to be able to link to an external URL.

  • Type - Link To External URL

00:06:41

This is usually what will be used when a component gets shipped . Since this will then give the opportunity to link it to an external URL which can be updated and edited without sending an update or an upgrade to the component. The help pages can be changed which were linked them.<<<<<<<<<<< This is how JCB is been setup. JCB is linking to an external Help Structure but you can decide whatever you want to do with this component.

  • Type - Text

00:07:20

For example: 'Text' can be used, and "This is the help you need" can be typed in or whatever. Save and close. If 'Looks' is opened, a new button called 'Help' is shown. If it is used it opens that 'Help'. 00:07:47 Go back and click 'New' then that 'Help menu' will not be displayed anymore. You can close , and go back to the 'Help Documents' and create another one. Again a specific group may be targeted , or all groups can be targeted. Again at Admin area. The Site area can also be targeted, and it is possible to link it to any of the front end areas. 00:08:32 It may be decided not to target the list(Looks), but the edit area(Look) which is singular. Again a title may be given to it. In this instance link it to an URL. Save and close. Then in the 'Looks' area, add New, and now it can be seen that area also has a Help button. When the help button is used, it opens that URL in a pop-up, and as may be seen a video is selected .00:09:13 That is how to link to other external sources to give instructions that is necessary(Help) to a specific page.

System Name

  • NB.Remember to Compile Before Install

00:09:36

Having set up a few Help Menus for the Component you can go back to Component Builder and to the Admin View Area. If for instance a Help Document is linked to Component Demo, and you want to ship it with the information that you have created as 'Help' inside of the Component. What needs to be done, is to open this Admin View, and give it a system name of 'Demo'. Then go to MySQL(add MySQL), and indicate by 'Yes' that it should be linked.<<<

00:10:31 I'll select MySQL source - Table. I would go to the Demo Table, select a Table. You see demo_help_document click on that, and I'll just remove some of the values that I know is not necessary.(See video) Created modified and version can stay. Save and close. I can save this or save as copy. If I have another component, I'll copy Help Document(demo) and link it to that components database. The only thing to remember when you've done this 00:11:36 Is it is you must first compile the component before you uninstall the local component. First come here(Compiler) and compile that(demo) component.

Insert Tables - Linking Table To Component

Let me quickly show you in the code what is happened. I've opened com_demo_v2_0_0_J3.zip package of a component. Go to Admin area, then to sql. Then I go to the install.mysql.utf8.sql document. Double clicked on that. It open this document. You'll see that they has 00:12:25 Insert Table. It also has Insert Data that we created. There is 'this is the help you need', there's a URL I added. It will insert this data into the database when this component is installed. 00:12:50 Having done those changes and linking the table to the component, it goes to the database and extract these values and places into the dump file of the Component. It does not place it into the update file, just that you know. That means that if users already have your component installed and they install this, it will not add these helper structures, you'll have to use Custom Scripting in the Joomla Component Area in the PHP tab. There is a place for update and uninstalled and installed 00:13:40 to add Custom PHP Script, where you can insert this data into the Database.

What Happens If Component Is No Longer Installed?

I'm going to show you what happens if the component is no longer installed, and you try to compile it. The first thing is I'm going to quickly uninstalled the Demo Component. I'm going to go to the compiler. I'm going to try and compile Demo Component. It will give 'An error has occurred'. It's telling you that it couldn't find "Table 'demo.#_demo_help_document'doesn't exist". 00:14:24 It couldn't find that table because you uninstalled it. The only way to compile this component would be to go back to the Admin View, and delink the component from the table.

NS. Compile The Component Before Uninstall Components

Like I said make sure to compile the component before you uninstall the component which you are linking to. We linked to the installed components table. The other way to try and avoid this 00:14:55 is to instead of linking to the table, is to use a Dump file. I would click on Dump. Open your sql file that it created, and copy the values from that file or cut whatever. Paste those values in here MySQL. 00:15:28 You could leave a comment or even leave a comment out. This way if we save and close, we will even if the component is uninstalled, be able to compile. And still have this Demo or Shipping values of the component in place. Let's try compiling it again. This time it compiled without any errors. 00:16:04 If we go open the com_demo_v2_0_0_J3.zip package, Admin, sql, and then open install.mysql.utf8.sql file. We will see that it added that Dump Values right back into the file, and that's exactly what you would like it to do. This was just to demonstrate how to add a Help Menu Structure to any JCB Component. 00:16:45

You could do that without purchasing the Sermon Distributor Component. The only part that really is necessary, is for you to create a Helper Document, and of course this Helper Document that we are using from the Sermon Distributor Package has custom scripting in it. And it's this custom scripting that makes it adaptable to any other Component. I can quickly show you which areas this custom scripting must go, 00:17:18 but I would rather want you to buy the Components Package. It's in a relation to the Articles, and to the Site Views, and the Admin View, that we have Custom Fields that are a little tricky, as well as the user group. You need to 00:17:42 have a little perspective on how to setup user groups.

JCB Detects If It Is A Help Document

Admin View and Site View are the two areas that are difficult as well as the Articles. When JCB detects that this is a Help Document, and it detects those specific field values that are set up correctly, then it automatically build some of the front-end necessary concepts as well as adding this dynamic behavior in the back end. I hope this helps to at least show you that it is very doable, the adding in help 00:18:25 structure to a component. What I think makes this quite unique is that the component then ships with this pre-built in Help Structure, but the user that uses your component, he might want to give extra help or little different kind of help to the front end users of his Website, and he will be having access to this Help Area and editing it and changing it to the correct wording and expectations that he might have. 00:18:59 That is the way that you could add Helper structures to your JCB components.

Clone this wiki locally