4.1 Add Member Menus to Test our new Network

In the last article, we finished creating the Member and Info forms we need to run our new network. Each of these forms creates a matching List where we can add new data just by clicking on the Add button. In this article, we will first look at the Service Provider Info Form and List in the back end and then create menu items to look at the same form and list in the front end. Then in the next article, we will use our Member Registration Form to add our Demo Members and have our Demo Service Providers fill out the Service Provider Info form to test how well our new network works.

View our Service Provider Info Form and List in the Back End
Go to Fabrik Forms, Service Provider Info and click View Data.

01

We have set these form elements so the only elements shown on the List are Service Provider City, Service Provider Name, Service Provider Category and Provider Photo. Note that we have reordering the elements to put the Service Provider City first. We could add new service providers here in the backend if we wanted just by clicking on Add. But because we only want folks with Linux computers accessing the back end, we will instead create a system where folks can sign up on the front end and thus be able to use any computer without compromising the security of the back end of our website. Click the back arrow to exit this screen. We will next create several new menus and several new menu items to add our Demo Members in the front end.

Add Two New Menu Items to our existing Main Menu
First, we need a Member Signup Menu Item. Then we need Member Log In. These two menu items will both be available for the Public to see on our Main Menu.

Create a Member Signup Menu Item
Go to Menus, Main Menu and click New. Then for Menu Item Type, click SELECT. Then click Fabrik.

02

Click Form. Then for Fabrik Form, select the Registration Form. For Menu Title, type Member Signup. Then in the lower right corner, change the Access from Public to Guest. This will hide the Signup menu item from Members who are already logged in.

03

Then click Save and Close.

Create a Member Log In menu item
While there is a menu item type that creates a menu item that just displays the standard Joomla Login Form, it does not have an easy way to add Login instructions for new members. We will therefore create a new Joomla article and then place the Log In module at the bottom of that article.

Go to Content, Articles, New. For Title, type Member Log In. For description, type: Welcome! Type in your username and password in the box below to got to the Members area of our website.

Then click Save and Close. Then go to Menus, Main Menu and click New. For Menu Item Type, click Select. Click Articles, Single Article. Then click Select to select the Member Login article. Name the menu item Member Login. Set Access to Guest. Then click Save and Close. The Member Login menu item now appears in the front end main menu. Next, to add the Login module to the bottom of this article, go to Extensions, Modules and click on the Login Form to edit it. Hide the Title and place it in the Helix Content Bottom position. Click Publish. Then click Edit to direct members to the First Steps article after they log in and to the Home page after they log out:

04

Then click on the Menu Assignment tab. Select Only on the pages selected. Then click None. Then check the box for Member Log In. Then click Save and Close.Then go to the front end and click on the Member Log In menu item. Here is the finished log in page:

05

Create Three New Menus for our Three Member Groups
We need a new menu for each of our three Member groups. The first is a Members Menu with access set for Registered Members. The second is a Service Providers Menu with access set for Service Provider Members. The third is a Job Providers Menu with access set for Job Provider Members.

06

Create a Members Menu
We have previously created an Administrator menu that can only be seen by logged in Administrators. Now we will create a Members Menu that can only be seen by logged in Members. Click Menus, Manage, Add New Menu. For Title, type in Members Menu. For Menu Type, type in membersmenu (no spaces). For Description, type in Members Menu. For client, leave it set for Site as we want this to display on the Front end of our website and not the back end.

07

Then click Save and Close. This will bring us back to the Menu Manager where our new menu now appears in the table of menus. Click on “Add a module for this menu type.” For Module Title, type in Members Menu. For Title, leave it at Show. For Position, click on Helix User1 position. For Access, change the access to the Registered Access Level.

This will allow all Registered Members access to the Members Menu – even though the actual menu items each group sees will depend on the access level of each menu item. Click Save and Close.

08

Create a Service Providers Menu
Click Menus, Manage, Add New Menu. For Title, type in Service Providers Menu. For Menu Type, type in serviceprovidersmenu (no spaces). For Description, type in Service Providers Menu. For client, leave it set for Site.Then click Save and Close. This will bring us back to the Menu Manager where our new menu now appears in the table of menus. Click on “Add a module for this menu type.” For Module Title, type in Service Providers Menu. For Title, leave it at Show. For Position, click on Helix User2 position. For Access, change the access to the Service Provider Access Level. This will allow all Service Provider Members access to the Service Providers Menu. Click Save and Close.

Create a Job Providers Menu
Click Menus, Manage, Add New Menu. For Title, type in Job Providers Menu. For Menu Type, type in jobprovidersmenu (no spaces). For Description, type in Job Providers Menu. For client, leave it set for Site.Then click Save and Close. This will bring us back to the Menu Manager where our new menu now appears in the table of menus. Click on “Add a module for this menu type.” For Module Title, type in Job Providers Menu. For Title, leave it at Show.

For Position, click on Helix User3 position. Change the access to the Job Provider Access Level. This will allow all Job Provider Members access to the Job Providers Menu. Click Save and Close.

Move New Member Tips Category & Article to the Members Menu
We have previously created menu items in our Main Menu for the Community Network Tips category and the First Steps for New Members article. Click on Community Network Tips menu item to edit it. Change its access to Registered. Then in the upper right corner, change the menu from Main Menu to Members Menu. Then click Save and Close. Then click on the First Steps for New Members menu item and change its access to Registered and its Menu to Members Menu. Then click Save and Close. Then go to the Members Menu and click on First Steps to edit it. Make its Parent Item Community Network Tips. Then click Save and Close.

Create 4 New Menu Items for our Members Menu
We next need to create four new menu items that each should have the access set to Registered. These include a menu item for the Service Provider List. We also need a Job Provider Sign Up Menu item connected to our Job Provider Info form and a menu item for the Job Provider List. We also need a Member Info Edit menu item for Members to edit their Info form and a Member Sign Out menu item for members to click on when they want to log out of the Members area of our website.

Create a Service Provider List menu Item
Go to Menus, Members Menu and click New. Then click Select and select Fabrik List. Then for Fabrik form, select the Service Provider Info list. For Title, type, Service Provider List. For Access, select Registered. Then click Save and New.

Create a Service Provider List menu Item
Go to Menus, Members Menu and click New. Then click Select and select Fabrik List. Then for Fabrik form, select the Job Privider Info list. For Title, type, Job Provider List. For Access, select Registered. Then click Save and New.

Create a Edit your Member Info menu item
Go to Menus, Members Menu and click New. Then click Select and select Fabrik Form. Then for Fabrik form, select the Member Registration form. For Title, type, Edit your Member Info. For Access, select Registered. Then click on the Fabrik Form Options tab. Type -1 in the Row id box and userid in the Key Name box.

09

Then click Save and Close.

Create a Menu Logout Menu Item
We will create Member Log Out page similar to our Member Login page. Go to Content, Articles, New. For Title, type Member Log Out. For description, type: Thank you for visiting our Members area and thank you for supporting our Service Providers! To log out, just click on the LOG OUT button below. Then click Save and Close.

Then go to Menus, Member Menu and click New. For Menu Item Type, click Select. Click Articles, Single Article. Then click Select to select the Member Log Out article. Name the menu item Member Log Out. Set Access to Registered. Then click Save and Close.

The Member Log Out menu item now appears in the Member Menu. Next add the Login module to the bottom of this article. Go to Extensions, Modules and click on the Login Form to edit it. (Note that the Login form automatically switchs to a log out form after a member has logged in). Click on the Menu Assignment tab. Select Only on the pages selected. Then click None. Check the boxes for Member Log Out and Member Login. Click Save & Close.

We also Here are our 6 Members Menu Items:

10

Create Menu Items for the Service Provider Menu
We need a Service Provider Sign Up Menu item connected to our Service Provider Info form. We also need a Service Provider Edit menu item for Service Providers to edit their Info form.

Create an article & menu item: Create Your Own Provider Image
First, open a new Libre Writer document and write the article with images. Then right click on each image and compress to 150 DPI. Then create a copy of the document. To make the copy text only, add placeholder text above each image like image01. Then right click on each image and save it to an article images folder. Then in the Joomla Control Panel, click Content Media and create a new folder. Upload the images to this folder. Then click Content, New article and copy paste the Text Only version of your article to the workspace. Then delete the image placeholder text and use the JCE editor image button to insert each image back into the web article. Then save and close the article. Then go to Menus, Member Menu and click New. Click Select and click Articles, Single Article. Select the article and give it a title. Set Access to Service Provider. Then click Save and Close.

Create a Service Provider Signup and or Edit menu item
We need a way for Service Providers to complete and or edit their Provider Info Form. For example, they may want to change their contact information or replace their Provider Photo. We will therefore create a Service Provider Signup and or Edit menu item. We only want each provider to be able to edit their own Provider form. We do not want them to be able to edit a different Providers Form.

To achieve this, go to Menus, Service Provider Menu and click New. Then choose Fabrik Form. Then select the Service Provider Info form. For Title, type Service Provider Signup and or Edit. For access, choose Service Provider. Then click on the Fabrik Form Options tab. Type -1 in the Row id box and userid in for Key Name.

11

Then Save & Close.

Move Service Provider Information from the Admin Menu to the Service Provider Menu
We had previously created a Service Provider Information menu item in the Admin Menu. It links to a Category of the same name with a Welcome Service Providers article in it. Click on it and change its Access to Service Provider. Then change its menu to Service Provider Menu. Then click Save and New.

Create a Create Service Provider Article Menu Item
Click Select and select Articles, Create Article. For Title, type Create a Service Provider Article. For Access, select Service Provider. Then click Save and Close.

Create a Job Provider Signup and or Edit menu item
We need a way for Job Providers to Sign Up for and later edit their Job Provider Info. For example, they may want to change their contact information. We will therefore create a Job Provider Info Edit menu item. We only want each provider to be able to edit their own Job Provider Info form. We do not want them to be able to edit a different Providers Info Form. To achieve this, go to Menus, Job Provider Menu and click New. Then choose Fabrik Form. Then select the Provider Info form. For Title, type Edit your Job Provider Info. For access, choose Job Service Provider.

Then click on the Fabrik Form Options tab. Type -1 in the Row id box and userid in the Key Name box. Then Save & Close.

Create a Job Provider Information article
We previously created a Service Provider Information category and Welcome article. We will now create a Job Providers Information category and Welcome article assigned to this category. Then go to the Job Providers menu and click New. Then click Select. Click Articles, Category Blog. Then select the Job Providers information category. For title, type Job Providers Information. Then click Save and New.

Create a Create Provider Article Menu Item
Click Select and select Articles, Create Article. For Title, type Create a Job Provider Article. For Access, select Job Provider. Then click Save and Close.

Here are the Admin Menu and all three Member Menus as seen by a logged in Super User:

12

Create a Member Coordinator Menu
We also need a menu for Member Coordinators to view our Member Lists and change groups for new Members on the Front End. This menu should only be seen by Member Coordinators, the Tech Team and Super Users. We have previously created a Joomla Access Level called Member Coordinators that should accomplish this task. Log into the back end and click Menus, Manage New. For Title, type Member Coordinator. For Menu Type, type membercoordinator.

For Description, type Member Coordinator. Then click Save and Close. Then click Add a module. For Title, type Member Coordinator, For Show Title, click Hide. For Position, select title. For Access, select Member Coordinator. Then click Save and Close.

Add Member Coordinator Menu Items
The Member Coordinator will need to see the Member List and will need to be able to create, edit and delete members. We will add 3 menu items. The first is the Member List. Go to the Member Coordinator Menu and click New. Click Select Fabrik Lists. Then select the Member Registration List. For Menu Title, type Member List. For Access, select Member Coordinator. Click Save & New.

Click Selelct Fabrik Form. Select the Member Registration form. For Title, type Register a New Member. For Access, select Member Coordinator. Then click Save and New.

Create an article for Member Coordinators. Go to Content, Articles, New. For Title, type: Instructions for Member Coordinators
In the workspace, copy paste: Click on new Member Registration to register new members or click on the Member List to edit existing members.

Then click Save and Close. Then go to Menus, Member Coordinator Menu and click New. Click Select, Articles, New Article. Then select the Instructions for Member Coordinators article. Set Access for Member Coordinators. Then click Save and Close.

To view this new menu on the front end, since we do not yet have anyone in the Member Coordinator group, log in as a Super User.

The Member Coordinator Menu is just above the header. Click on Member List to view a list of our Members:

13

These are all members we added in a previous chapter. We willl add more in the next chapter. Not that by default, any one who has access to the Member List can edit view or delete any member.

Create a New Menu Item called Sign Up Success
We need a menu item for new members to be directed to after they have submitted their Member Registration form. The article is needed to let them know that they will need to be approved before they can log into the Members area of our website.

Go to Content, Articles, New. For Title, type: Sign Up Success!

For text, type: Thank you for joining our community network!. You can now log into our Members area by clicking on the Member Login button in the Main Menu!

Then click Save and Close. Then create a Hidden Menu by going to Menus, Manage, New. Name the menu Hidden Menu. Then save the new hidden menu and click Add Module. For Title, type Hidden Menu. For module position, put the module in a position that does not exist in our template layout. We will use Helix Position 8. Then click Save and Close. The go to Menus, Hidden Menu, New. Click Select Articles, Single Article. Click Select and select the Sign Up Success article. For Title, type Sign Up Success. Then click Save and Close.

What’s Next?

Now that we have created our Member Menu Structure, in the next article, we will register our Demo Members to see if our Community Network Registration system actually works.