How to Manage Breadcrumb Links Using MasinoFixedWidthSite Extension for PHPMaker 9.2.0

After implementing Masino Extensions in a new project of PHPMaker 9.2.0, now we are going to manage the breadcrumb links after generating the script files using PHPMaker application. As we have already known, breadcrumb links is very useful in a web application to let your users know where they are or what is the location of the page that they are visiting. In addition, breadcrumb links is also very helpful for users to jump to the parent of the current page, especially if the page is located under some parent pages.

The breadcrumb links is actualy handled by MasinoFixedWidthSite extension. Since the default setting of this extension is enabling the breadcrumb links, then you should have now four new generated .php files in order to add, move, delete, and retrieve the breadcrumb links from the database. In other words, we are able to manage the breadcrumb links from the generated web applications by logging in as Administrator user level. So, make sure also you have enabled Administrator Login (Hard-coded) and defined Login Name and Password from the Security tab of PHPMaker application.

Before we get started into this topic, then make sure you have already downloaded the latest version of MasinoFixedWidthSite extension that last updated on August 6, 2013. The update is very important so that only Administrator user can manage the breadcrumb links. Also, make sure you have done all the steps in the article I mentioned in the first paragraph above.

There are five main separated process that you can do in order to manage the breadcrumb links from your generated web applications:
1. Adding the Breadcrumb Links
2. Making the Breadcrumb Links Support for Multi Language
3. Moving the Breadcrumb Links
4. Deleting the Breadcrumb Links
5. Checking the Full Path of Breadcrumb Links

So, let's now get started! 🙂

[hidepost]

Adding the Breadcrumb Links

If you want to add a new breadcrumb links, then add the breadcrumblinksaddsp.php after your main web application address via your browser. In other words, if your web application's URL is http://www.mywebapp.com, then simply access this address: http://www.mywebapp.com/breadcrumblinksaddsp.php (adjust mywebapp.com with your main address/URL). If you have not logged in, yet, then you will be automatically redirected to the Login page. If you login as a user which has user level other than Administrator, then you will always be redirected to the Login page. So, make sure you have also logged in as an Administrator user level in order to access the page.

After successfully logged in, then you will be automatically redirected to the Add Breadcrumb Links page. Since there are no records in the breadcrumblinks table, then we are going to add the first record as the main root for all breadcrumb links for the web application.

To do that, in the Page Title Parent directive, enter: Home, in the Page Title directive, enter Home, and in the Page URL, leave the blank, then press Enter or click Add Breadcrumb Links button. If everything is fine, then you should see a success message Breadcrumb link has been successfully added..

As you can see now, then you will see the Home breadcrumb is now being displayed using the Select Option control in the Page Title Parent directive. In other words, after adding the first breadcrumb record (usually defined as Home), then this directive will turn from the Textbox into the Select Option control.

Now we are going to add another breadcrumb links. Let's say we have the menu structure as following:
Home » Customers. To add a new breadcrumb link for Customers menu, then follow the steps below:

1. In the Page Title Parent directive, make sure you have chosen Home.
2. In the Page Title directive, enter: Customers
3. In the Page URL directive, enter the URL of the List page for Customers, as usually generated by PHPMaker as customerslist.php.
4. Press Add Breadcrumb Links button.
5. Repeat those step 1, 2, 3, and 4 above for adding the other breadcrumb links. The most important thing that you have to remember is: always put the new breacrumb links under its direct parent page. For example, let's say you want to add the breadcrumb links such as Home » Customers » Add New Customer, then choose Customers from the Page Title Parent directive, enter Add New Customer string in the Page Title directive, enter customersadd.php in the Page URL directive, and then press Enter. By using this technique, then are able to create unlimited breadcrumb links as well as the unlimited menu structure that provided by PHPMaker.

Making the Breadcrumb Links Support for Multi Language

Until this step, we have just successfully added some new breadcrumb links records into the breadcrumblinks table. Since the breadcrumb links should support for multi language as well as the other language phrases that being used in the generated web applications, then we have to add the language phrases, too that related to the breadcrumb links, into the generated .xml language files.

To do this, then customize the english.xml file (and the other .xml language file(s) you have; if you are running a multi language web application) that located in the C:\Program Files\PHPMaker 9\languages\. Actually, this part is similar to the step 20 of this article regarding how to display the breadcrumb links that support for multi language.

However, let me remind you again how to make the breacrumb links that support for the multi language.

1. Open the C:\Program Files\PHPMaker 9\languages\english.xml language file, and then find this following code:

   <locale>
   

   before that line, please insert the following code:

   <breadcrumb>
     <phrase id="Home" value="Home"/>
     <phrase id="Customers" value="My Customers"/>
     <phrase id="Add New Customer" value="Add New Customers"/>  
   </breadcrumb>
   

2. Do the same step with another .xml language file. For example, I am also using Indonesian language, then I will add the following language phrases into C:\Program Files\PHPMaker 9\languages\indonesian.xml file:

   <breadcrumb>
     <phrase id="Home" value="Beranda"/>
     <phrase id="Customers" value="Pelanggan"/>
     <phrase id="Add New Customer" value="Tambah Pelanggan Baru"/>  
   </breadcrumb>
   

   As you can see above, each breadcrumb language phrase ID must be the same with the Page Title that you entered into the breadcrumblinks table. You can only change/adjust the string after the value keyword.

3. Each time you have entered the breadcrumb links record from the generated web application above, then make sure you have also defined the language phrases inside that breadcrumb block in the .xml language files. Otherwise, you will never seen the breadcrumb links properly.

Make sure do not miss this step, otherwise the breadcrumb links will not be displayed in your web application, even you have added the breadcrumb records into the breadcrumblinks table.

Moving the Breadcrumb Links

We have just successfully added the breadcrumb links records to breadcrumblinks table. The next question is, how do we move the certain breadcrumb link to another parent? This is important if, for example, you have created a breadcrumb link that located under the wrong parent. Now we are going to do that. Just like adding a new breadcrumb link, simply access the following URL via your browser (adjust mywebapp.com with your main address/URL): http://www.mywebapp.com/breadcrumblinksmovesp.php.

Now you should see Move Breadcrumb Links page. To move a breadcrumb link, simply follow this step:

1. Choose the current page title from Current Page Title directive. This is the curret breadcrumb link that you want to move.
2. Choose the new parent where the current page title in the first step above will be located from the New Root (Page Title) directive.
3. Press Move Breadcrumb Links button to submit the changes.

Deleting the Breadcrumb Links

After adding and moving the breadcrumb links, perhaps you want to delete a breadcrumb link, then simply access the following URL (adjust mywebapp.com with your main address/URL) http://www.mywebapp.com/breadcrumblinksdeletesp.php. Now you should see a Delete Breadcrumb Links page.

Warning: Removing a parent breadcrumb link which has the children, will automatically delete all the children beneath it. Once you click the button, the deleting process cannot be undo. So, be careful!

To delete a breadcrumb link, please follow this steps:

1. Choose the breadcrumb link you want to remove from the Page Title directive.
2. Press the Delete Breadcrumb Links button.

Checking the Full Path of Breadcrumb Links

Perhaps you will ask a question: how do we know the full path or the parent breadcrumb of the certain breadcrumb links? Well, simply access this URL (adjust mywebapp.com with your main address/URL): http://www.mywebapp.com/breadcrumblinkschecksp.php. Now you should see a Check Breadcrumb Links page. You can check the display of the certain breadcrumb links easily and quickly.

To check the location or the full path of a breadcrumb link:

1. Choose the page title from the Page Title directive.
2. Press the Check Breadcrumb Links button.
3. Now you should see the location or the full path of the chosen breadcrumb link below. This is only information to give you the idea how a breadcrumb link will be displayed in the related page. This is useful for you if you want to review the breadcrumb links that you have just entered into the database.

[/hidepost]