# Naming Conventions

## Naming different Groups or Elements

### **For Parent Groups:**&#x20;

<mark style="color:blue;">{Element Shorthand}</mark> <mark style="color:red;">{Describe Parent Thing}</mark>&#x20;

For Example: "GP review listing"

<figure><img src="https://1250195888-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJaAsYfp594cjUUThh0ri%2Fuploads%2FQfDX4huLidkBT85UlqEQ%2Fparent%20group.png?alt=media&#x26;token=c38f6265-a24c-43ad-9f77-337c28fe5b73" alt=""><figcaption></figcaption></figure>

### **For Organizing Groups:**

<mark style="color:blue;">{Element Shorthand}</mark> <mark style="color:red;">{Parent Group Initials}</mark> <mark style="color:yellow;">{Organizing Group Name}</mark>

These are explained in more detail in the [Naming Groups Within Groups Section](#naming-groups-within-groups), but put simply, you should break up each page (and where necessary, complex groups) into three sections:

Head = top/first

Body = Middle

Foot = Bottom/last

<figure><img src="https://1250195888-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJaAsYfp594cjUUThh0ri%2Fuploads%2FXRX0GhpKLYfMIuvJNpSx%2FOrganizing%20group.png?alt=media&#x26;token=5b1fa03f-635a-4a2c-afcb-4ff82b338870" alt=""><figcaption></figcaption></figure>

### **For Child Groups:**&#x20;

<mark style="color:blue;">{Element Shorthand}</mark> <mark style="color:red;">{Parent Group Initials}</mark> <mark style="color:yellow;">{Organizing Group Initial}</mark> <mark style="color:purple;">{Describe Child Thing}</mark>

For Example: "TXT RL H date"

NOTE: you can continue to chain on child group names as is appropriate as you nest deeper, however if you use organizing group initials consistently, this should become less necessary.&#x20;

<figure><img src="https://1250195888-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJaAsYfp594cjUUThh0ri%2Fuploads%2FZ5PqFVWYR4BR2YNibgY2%2Fnaming%20example.png?alt=media&#x26;token=09633174-5767-4644-b8d2-3d08a92cf184" alt=""><figcaption></figcaption></figure>

**For Reusable Elements:**

<mark style="color:orange;">{Reusable Element Name}</mark> <mark style="color:green;">{Page Name}</mark>&#x20;

To avoid confusion when using a reusable element multiple times replace Bubble's automatic "A", "B", "C" with the page name.

If you use the same reusable multiple times on a page, simply follow the standard naming conventions.&#x20;

<mark style="color:orange;">{Reusable Element Name}</mark> <mark style="color:green;">{Page Name}</mark> <mark style="color:red;">{Parent Group Initials}</mark> <mark style="color:yellow;">{Organizing Group Initial}</mark> <mark style="color:purple;">{Child Thing}</mark>

Try to make it only as complex as it needs to be, usually parent group initials will be enough.

<figure><img src="https://1250195888-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJaAsYfp594cjUUThh0ri%2Fuploads%2Fz2EUfbqdUQQLqIv1deRz%2FRE.png?alt=media&#x26;token=1be14aa1-3be1-4312-b45a-0cecfee6b703" alt=""><figcaption></figcaption></figure>

#### Here is an example of a simple page layout using the APG nomenclature and design principles:

<figure><img src="https://1250195888-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJaAsYfp594cjUUThh0ri%2Fuploads%2FO3BfAG75vm1E027tjLX1%2Fexemplar.png?alt=media&#x26;token=001f8b63-1e2d-4923-b2b6-a95d5220b33a" alt=""><figcaption></figcaption></figure>

## Resolving Naming Conflicts

By using the  <mark style="color:red;">{Parent Group Initials}</mark> and <mark style="color:yellow;">{Organizing Group Initial},</mark> you should avoid 99% of conflicts. However, if conflicts occur between similar groups or elements, they will likely occur:

* Within the same parent group:&#x20;
  * In this case, please differentiate by creating <mark style="color:green;">{Sibling Group}</mark> names and using the following structure:

<mark style="color:blue;">{Element Shorthand}</mark> <mark style="color:red;">{Parent Group Initials}</mark> <mark style="color:yellow;">{Organizing Group Initial}</mark> <mark style="color:green;">{Sibling Group name/initial}</mark> <mark style="color:purple;">{Describe Child Thing}</mark>

Wherever possible try to avoid using numbers, as this can get confusing in workflows for those unfamiliar with the app (however, use your judgment, as there may be times when this makes the most sense).&#x20;
