# 3-Column Text and Link Repeating Group

##

## Overview

This module allows a user to view a list of things and to click on the `︙icon` to edit or delete an item via a menu focus group. For more information on how to use `menufocusgroups`, please [click here](https://docs.airdev.co/canvas/assets/reuseables/menufocusgroup).

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LcIs-gSpTbjY-2AaYKP%2F-LcIs_TStx1QGbKd_fZf%2FScreen%20Shot%202019-01-25%20at%202.29.47%20PM.png?alt=media\&token=272e0370-c216-439e-8894-627346c3b65e)

\
Structure <a href="#structure" id="structure"></a>
--------------------------------------------------

* When this module is added to a page, it is placed within a group called `Group page860Group` on the page. This group contains the responsive settings for all modules.
* This module contains three main groups:
  * `Group verticalPadding 1` - For responsiveness (please do not delete)
  * `Group verticalPadding 2` - For responsiveness (please do not delete)
  * `Group 780StandardGroup` - If you add more elements to the group, please ensure that they are contained within this main content group.
* This module contains the `menufocusgroup2` reusable element. This reusable element contains all the additional actions you can perform (e.g., edit data, delete data, and more)
* All data is displayed in `RepeatingGroup 780-1Column`

## How to set up

* Go to the page where you have added the module and update `RepeatingGroup 780-1Column's` data source

![Update data source](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LcIs-gSpTbjY-2AaYKP%2F-LcIxvrxeBlIbd_4i0gX%2FScreen%20Shot%202019-04-12%20at%204.52.19%20PM.png?alt=media\&token=0bd989b0-a46c-428d-83bf-fd8ceaf3906a)

* Update the data source of the texts and links in the module.&#x20;
* Remove `Button ADD` or add a workflow to the button
* Open `menufocusgroup2` and modify the type of content displayed in the reusable to be whatever object for which you want

![Update reusable data content](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LcIs-gSpTbjY-2AaYKP%2F-LcIz67ejeHyw1QIFsTB%2FScreen%20Shot%202019-04-12%20at%204.57.34%20PM.png?alt=media\&token=e78cec2d-73e8-4f8c-bb67-c242a3d25339)

* Open `GroupFocusUser` and modify the type of content displayed. The data source should be set to `menufocusgroup2` reusable's data.

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LcIs-gSpTbjY-2AaYKP%2F-LcIzVdPc98ae5pSzFkK%2FScreen%20Shot%202019-04-12%20at%204.59.01%20PM.png?alt=media\&token=e51ba3c6-1159-4322-8e03-747e4ec288d9)

* Under elements tree, you can view hidden menu options within the `GroupFocusUser` menu. Simply click on `Group Option X` and check or uncheck the settings for `This element is visible on page load` to show or hide a menu option.

![Hide or show menu options](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LcIs-gSpTbjY-2AaYKP%2F-LcJ-5bDgQ3seuPh3iQt%2FScreen%20Shot%202019-04-12%20at%205.01.44%20PM.png?alt=media\&token=eab7f53e-d049-4a8a-98bd-e8bda39ec761)

* Update the workflows for when `Group Option X is clicked`
* For more information on how to use `menufocusgroups`, please [click here](https://docs.airdev.co/canvas/assets/reuseables/menufocusgroup).

## How can I hide columns?

* Go to the page where you have added the module and in the Bubble Editor click on the `Responsive` tab next to `UI Builder`

![Responsive view in the editor](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LcIs-gSpTbjY-2AaYKP%2F-LcJ14BcETqMTnA-w6fk%2FScreen%20Shot%202019-04-12%20at%205.10.33%20PM.png?alt=media\&token=23f45771-118e-4a63-b6c5-d913eebfbd6b)

* Using the ruler at the top (<-->), adjust the page width to the width that you want the column to hide at

![Adjust the page width in the responsive editor](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LcIs-gSpTbjY-2AaYKP%2F-LcJ1TbcZjtV2mGe8Z4h%2FScreen%20Shot%202019-04-12%20at%205.11.26%20PM.png?alt=media\&token=0fc96d19-6819-46c6-a40f-3b6e24ee96f5)

* Click on the element or column you want to hide at that page width and check the settings for `hide when parent width <= WIDTH`<br>
