Background

• The website is a genealogy website tracing the lineage of a particular family.
• This website is built on Wordpress, and is currently using the plugin, Advanced Custom Fields Pro (ACF), to create custom fields for a custom post type: "People".
• Each person can have many spouses, many children, and many siblings. Children can only have one mother and one father.

Scope

• PART I: Create family tree diagrams to be included on the page of each person in the 'people' custom post type (CSS only).
  • The data should be returned in a nested list format, with spouses part of their husband (or wife's) list element. The actual CSS is not needed -- just the data returned in a nested list formatted as shown below:

    <ul>
    
       <li>
         <div>
           <span class="female">UNKNOWN</span>
           <span class="spacer"></span>
           <span class="male">UNKNOWN</span>
        </div>
        <ul>
         <li>
           <div>
              <span class="male">Sam Snow 1631 - 1695</span>
              <span class="spacer"></span>
              <span class="female">Lily Sight 1633 - 1697</span>
           </div>
           <ul>
              <li>
                 <div>
                    <span class="male">Ralf Snow 1651 - </span>
                </div>
              </li>
               <li>
                  <div>
                      <span class="female">Brie Snow 1653 - </span>
                  </div>
               </li>
           </ul>
         </li>
         <li>
           <div>
             <span class="male">Jim Snow 1633 - 1697</span>
             <span class="spacer"></span>
              <span class="female">Zoe Blue 1633 - 1697</span>
           </div>
          <ul>
            <li>
              <div>
                 <span class="male">Ralf Snow 1651 - </span>
                 <span class="spacer"></span>
                 <span class="female">Sally Bern 1653 - </span>
              </div>
           <ul>
            <li><div><span class="female">Magna Snow
    1679 - </span></div></li></ul></li><li><div><span class="female">Brie Snow
    1653 - </span></div></li></ul></li><li><div><span class="male">John Snow
    1635 - 1699</span></div></li></ul></li></ul>

• PART II: Create the "Are We Related Tool". This tool allows website visitors to quickly determine relationship to the family line by allowing visitors to select a surname and view the family tree for that surname. As these trees will be larger, JQuery will be needed to accomplish these diagrams.

This particular project will likely have to be completed in two portions, unless the developer believes that the project would be cheaper, or easier to complete in one session. As funding is an issue, the project may not commence immediately, or may need to be completed in several small chunks.

Requirements

• If I update Person #1 to add Person #2 as a spouse, I want Person #2's spouse field to reflect that change by showing Person #1 as Person #2's spouse.
• Fields in the spouse group, such as marriage date, marriage location, and notes, should also be reflected by Person #2.
• If I add Person #3 as a spouse to Person #1, Person #3 should also reflect that change -- so Person #1 would show two spouses (not removing the other one).
• If I deleted Person #3 from a spouse of Person #1, Person #3 should no longer have a spouse, but Person #1 would still reflect Person #2 as a spouse, and vice versa.
• If I add a child to a person and spouse pair, I'd like that change to reflect as the mother and father for the child and also that child to be reflected as a child on the spouse's page, as well as the person we are editing's page.
• Removing a child from a person and spouse pair would result in both parents being removed from relationship with the child, but the person/spouse pair would still be intact.
• Removing a person/spouse pair with children would result in no mother or father for the children.

I just need the bi-directional relationships working correctly in the backend of the website. I do not need help displaying the relationships on the front-end.

Online Examples

There are a couple examples I have been able to find online of how bi-directional relationships could be accomplished: 

• ACF Bi-directional Relationships Example
• ACF Post-2-Post Plugin
• ACF Post-2-Post Plugin
• ACF Reciprocal Relationship

My PHP skills are unfortunately not good enough to be able to translate these examples into my own setup within ACF Pro, as I cannot find any examples of bi-directional relationships which use repeaters.

Here is a link to the documentation of ACF. It appears that you'll need to hook into the acf/update_value filter in order to accomplish this.

The Fields Setup

All of the relevant fields are in one ACF field group: "People - Basic Information". Within that field group, there are three "groups":

• names - group
• whp_parents - group
• spouses - repeater field type

In the "names" group, the only relevant field will be "gender", which should be used to determine whether a person is a "mother" or a "father" of a child.

In the "whp_parents" group, I have two fields:

• mother - post object field type (allows only one selection)
• father - post object field type (allows only one selection)

The "spouses" repeater is where is gets a little confusing.

• spouse - group
  • spouse - post object field type
  • dates - group
    • marriage_date - date picker field type
    • year - range field type
  • marriage_location - taxonomy field type
  • notes - textarea field type
• children - post object field type (returns an array of posts)