The Kloosterman Integration

This particular integration method really isn’t an integration at all. Essentially, what you are doing is “wrapping” the WordPress theme around the TNG content. It is really very easy to set up. This same information can be found on Cees Kloosterman’s site, but I know that many people now come here for instructions so I decided to include his here as well.  As with the other instructions, I am starting at the very beginning. If you already have WordPress and TNG installed, just pick up from where you need.

Step One

Download the Software

1. Download the latest version of WordPress from WordPress.org and unzip it to a folder on your hard drive.
2. Download the latest version of TNG using the download link and login provided when you purchased the software. Unzip the file to a folder on your hard drive.

Prepare the Web Server

In the root folder of your web hosting account (generally home/username/public_html) create a directory for TNG. In this case, you can name the directory anything you want; I generally name it “genealogy.” This means that the url to my TNG pages on this site is https://uniquelyyourshosting.net/genealogy/surnames.php.

Upload the files you downloaded and unzipped using an FTP client; WordPress files into the root folder, TNG files in the tng folder.

In your web hosting control panel create a database and database user/password for your installation. You will be installing both WordPress and TNG tables to this database so the name can be anything you like (i.e. genealogy). Note that in most cases your database and username will be prefixed with accountname_. This is part of the database/user name and must be included in the configuration files. Make a note of both names and the password.

Step Two

Install and Set Up WordPress

1. Point your browser to http://www.yourdomain.com. Follow the onscreen instructions to create the configuration file and install WordPress. Once setup is complete, log in to the Admin Dashboard.
2. In the sidebar Menu select Settings -> Permalinks. Set the permalink structure to anything but Default (I strongly recommend %postname%) and save changes.
   [NOTE: TNG pages will not display properly with the Permalinks setting on Default.]
3. Next go to Appearance -> Themes and select the “Add New” tab and find a theme you like if you don’t want to use the default theme. I recommend a responsive theme that includes a full-width template and a bottom widget bar. You can also download and install the theme on this site. You just need to click on “Upload Theme” and then upload the .zip file and then install it.

That was pretty easy so far wasn’t it? Let’s continue…

Install and Set Up TNG

1. Point your browser to http://www.yourdomain.com/[directoryname]/admin.php. In the Admin menu select Setup –> General Settings and work through all the levels. The most important part right now is under “Site Design and Definition.” Set the Home Page to the site URL (http://www.yourdomain.tld) and the Genealogy URL will be http://www.yourdomain.tld/directory-where-tng-is-installed.
2. Once you have completed the settings tab, select the “Table Creation” tab and create the tables.
3. Go to the Users menu selection and add yourself as a new user (you will automatically be the superadmin). Make sure the user name and password you enter is the same as it is in WordPress. This is important if you want integrated login to work!
4. Go to Setup –> Theme Settings.  Set “Enable Template Switching” to No. Set the Template Selection to blank. See endnotes below for instructions on how to copy the template files you want to use to the appropriate folders.

At this point, TNG is installed but not integrated.

Step Three

Integrate WordPress and TNG

1. Create three new files in your TNG root folder and name them WPTNG-topmenu.php, WPTNG-footer.php and WPTNG-meta.php. Next you are going to edit each file to include the code required to show the WordPress stuff.
2. In your favorite text editor, open WPTNG-topmenu.php and insert the following code, then save the file:
   <?php
require ("../wp-load.php");
get_header ();
 ?>
3. In your favorite text editor, open WPTNG-footer.php and insert the following code, then save the file:
   <?php
get_sidebar(); //if you want to have it displayed in TNG pages
get_footer ();
 ?>
4. In your favorite text editor, open WPTNG-meta.php and insert the following code, then save the file:
   <?php
global $cms;
?>
<style> ... custom styles go here ... </style>
NOTE: The custom styles would theme styles that need tweaking to work correctly with the TNG pages.
5. Make sure the changed files are updated on the server and then go the TNG Admin –> General Settings. Under Site Design and Definition, make the following changes and save your settings:
   1. Change Custom Header to WPTNG-header.php
   2. Change Custom Footer to WPTNG-footer.php
   3. Change Custom Meta to WPTNG-meta.php

That’s it! You’re done.

Final Steps

Addressing the Privacy Issue

If you are insistent on restricting access to all your genealogy pages to registered users only, don’t despair. You can have your privacy and WordPress too! Because there is no plugin involved, whatever privacy settings you select in TNG Admin will work. There is also a new mod available, Public Access Control, that will let you fine tune your privacy settings even more. This mod works with TNG v. 10 and later.

Endnotes

The rest of the customization is up to you. Just about any theme you like will work with TNG.  You can usually find a TNG template whose colors complement your WordPress theme. You can copy the css files from the template’s css directory to the root css directory overwriting the existing files. Any images required by these changes need to be added to the image folder in the root directory of your TNG install.

Finally, if you have any questions, please feel free to contact me. I will also provide my services to do an integration for you for a nominal fee. Good luck and have fun!