Configuring Templates for Listing Details on Separate Page

There are four list view templates included with the Business Directory application. They are named DNNP-BD6.1 List View, DNNP-BD6.1 List View 2, DNNP-BD6.1 List View Featured Grid, and DNNP-BD6.1 List View Featured 2 Grid. In this section we will discuss the DNNP-BD6.1 List View template and the DNNP-BD6.1 Tabbed Detail View templates that allow you to show listing details in-line.

If you have configured your Xmod module, in Step. 3 Configure Main Form, to use the DNNP-BD6.1 List View 2 and DNNP-BD6.1 Tabbed Detail View 2 templates proceed with this lesson.

The DNNP-BD6.1 List View 2 template is designed to be used with the DNNP-BD6.1 Tabbed Detail View 2 template that uses the  XMod Detail View for XMod 5.0 - PA. With these two templates you will form a listings page and a detail template that will be placed on a unique DNN portal page. With this setup you can add additional Business Directory modules and DNN modules to your detail page.

The DNNP-BD6.1 List View 2 template is specially designed for using DNNP-BD6.1 Tabbed Detail View 2 template. Both of these templates are designed to be used with the XMod Detail View for XMod 5.0 - PA (see Installation instructions for more details) which allows you to have your detail view of Business Directory on its own page.

Step 1.

Add a new DotNetNuke portal page to your site. We might name this page 'Directory Listing details" and the parent page would be your listing page (in our example below it is named Business Directory).

Note: After setup is fully complete you can return to the page settings and hide this page from the menu.

Next add the XMod Detail Module to this page.

Next configure the module.

Before updating your configuration note the URL in the browser window. You will need the tabid and the mid values to complete the next steps.

Example:

http://yourdomain.com/BusinessDirectory/DirectoryListingDetails/tabid/66/ctl/Configure/mid/412/Default.aspx

Click Update

Next add a DotNetNuke Text/HTML module to this page below the details module.

In the module settings set the container to not show and add the following text in source view.

Replace 'YOUR MAIN LISTING PAGE URL; with the link to your main directory listing page and replace /portals/0 with the portal number of your site if it is not 0.

This will create a Return to List button below the details of the listing.

Note: This is the same code that we added to the No Items Found textbox when we configured the details module above.

 Save and return to your main listings page.

Step 2. XMod Configuration for the DNNP-BD6.1 List View 2 template

Quick set up.

Edit DNNP-BD6.1 List View 2 Template

 

Manage Templates >> Template Settings

Note: Checking or unchecking Show Details Inline will not affect the details showing on a separate page.

 

Manage Templates >> Item Settings >> Header Style

 

Manage Templates >> Item Settings >> Item Style

 

Manage Templates >> Item Settings >> Alternating Item Style

 

Manage Templates >> Item Settings >> Pager Style

 

Note: Code changes need to be made in the editor code window for the DNNP-BD6.1 List View 2 Template.

There are four links in the DNNP-BD6.1 List View 2 template that will link to your detail page. You simply need to modify these links by replacing the tabid and the xmid default values with the values that you noted when you configured the detail module above.

In our example above the replacement values were 66 and 412.

Tip: The quickest way to search these link areas and make edits is to copy the code into Notepad and search for YOUR DETAIL PAGE TABID HERE.

After the four link changes are complete:

Save Template

Step 2.

XMod Configuration for

the DNNP-BD6.1 Tabbed Detail View 2 Template

Edit DNNP-BD6.1 Tabbed Detail View 2 template

The DNNP-BD6.1 Tabbed Detail View 2 template only requires editing of the Google Map Key. This key is unique to your domain and there is two instances of the words, 'YOUR GOOGLE MAP KEY HERE', that need to be replaced with the map key that you obtained from Google at http://code.google.com/apis/maps/signup.html (refer to Step 3. Configure Main Form).

Tip: The quickest way to search these Google map key areas and make edits is to copy the code into Notepad and search for YOUR GOOGLE MAP KEY HERE.

Great Job!

You are now ready to return to your listing page and begin adding listings.

Next >> Step 8 Adding Inquiry Form