# 2b: Programs

### Video Tutorial

{% embed url="<https://www.youtube.com/watch?v=_z7lPQv8rd4>" %}

The Programs page should fill in a few remaining gaps not covered in the Home page section. Once you’ve looked at both of these, you should have a pretty good idea of how to edit nearly any page on the site.

#### Columns with Cover Blocks

The first section is a row of columns. As mentioned on the Home page, these can be tricky to navigate, so let’s look at how one block is embedded in another is embedded in another is embedded in another (phew!) and how to modify each part.

First, you can click on the text and button blocks to make edits to them. Pretty simple so far:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-Ltal74sOvIaTgKfh1_o%2F-LtamFCXskyB_z6Wkm6U%2FScreenshot%202019-11-13%20at%205.00.33%20PM.png?alt=media\&token=43bb62b2-1d38-4529-9efc-4bc627219f49)

**Sidenote: Updating PDF links**

The registration buttons happen to link to PDF registration forms. Linking to PDFs is one of the more ‘clunky’ processes here, so I’ll tell you how I do it.

First, I would open the Dashboard in a *new, second tab*. From there, I would visit the Media > Add New page:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-Ltehwr2bzzKrgf2vHaH%2F-LtenMKG7FSD5qw9flXv%2FScreenshot%202019-11-14%20at%2011.42.24%20AM.png?alt=media\&token=f43e7f7f-4d22-4eb5-a9c3-8b4ed508bb32)

Here, I can drag and drop a PDF into the designated box to upload one. Once it’s finished uploading, I would click Edit:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-Ltehwr2bzzKrgf2vHaH%2F-LtenJllQfFxinKfR2Xg%2FScreenshot%202019-11-14%20at%2011.43.50%20AM.png?alt=media\&token=5e3d002e-5073-4d4f-9b36-6acb88d92edd)

Now, I would want to copy the File URL to my clipboard – select it and either right click and pick ‘Copy’ or use the keyboard shortcut (ctrl + c (Windows); ⌘ + c (Apple)):

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-Ltehwr2bzzKrgf2vHaH%2F-LtennAbeGhYyP4aG6Uh%2FScreenshot%202019-11-14%20at%2011.45.29%20AM.png?alt=media\&token=4d3ae258-3512-4fc3-a395-c7923fa4019d)

Go ahead and close the tab. We’re nearly done. Back in your Programs page (or whichever), paste the link as your button URL – right click and pick ‘Paste’ or use the keyboard shortcut (ctrl + v (Windows); ⌘ + v (Apple)):

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-Ltehwr2bzzKrgf2vHaH%2F-LteoBOPeioBSlP2KiMH%2FScreenshot%202019-11-14%20at%2011.48.04%20AM.png?alt=media\&token=e0c6146d-d299-45a9-8e56-0f58036d585d)

**End of sidenote, back to editing:**

Click on the outside of these blocks, on the image behind them and you will see the text and buttons are inside a “Cover” block. This is where the background image comes from. The Cover block basically gives you an eye-catching section where you can have a background image with any number of child blocks within it. If you want to edit the background image, there are two ways. I think the first one is easier. With the cover block selected, click the pencil icon up top and you will be able to pick a new image:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-LudABdELdTa4zd2zZ-i%2F-LudF9PeaoLKmqI5w5l1%2FScreenshot%202019-11-26%20at%202.46.34%20PM.png?alt=media\&token=5ba235f9-ef95-4f4d-8b6b-6f14a6504801)

Or, you can click Clear Media in the block settings and then pick a new image in the block itself:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-LudABdELdTa4zd2zZ-i%2F-LudFHOaqFF4aZdbGLPS%2FScreenshot%202019-11-26%20at%202.47.03%20PM.png?alt=media\&token=c20e05b6-db9d-4f9f-a797-768131f5d5c0)

Below that, in the settings, you can edit the overlay colour as well.

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-Ltal74sOvIaTgKfh1_o%2F-LtanG5Y_1S_NGbFoeCf%2FScreenshot%202019-11-13%20at%205.03.16%20PM.png?alt=media\&token=cd859435-784e-4960-a9a9-322cb4cc88cc)

The cover block is within a column. Click the dotted line just outside of this to select the column (as discussed on the Home page’s first column block). Finally, the containing Columns block in which all three columns live. Because it’s full-width here, it can be harder to select, so *here is another way to navigate ‘nested’ blocks:*

You can select the Block Navigation icon from the toolbar above to bring up a sort of family tree that gives you a representation of the parent and child blocks in whatever area you’re currently working in:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-Ltal74sOvIaTgKfh1_o%2F-Ltao-DrG-S3C9YnOfv0%2FScreenshot%202019-11-13%20at%205.07.47%20PM.png?alt=media\&token=11442710-ec45-4659-8310-a95d330f9973)

Select **Columns** there and you will be able to edit the containing Columns block.

#### Gallery

Click on any image on the gallery and you’ll see you have some self-explanatory ways to remove images (**X**), quickly move them left or right (**<**, **>**), or drag and drop new images to upload them:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-LtefQQ3Lto2YSq5Miv1%2F-LtehNglKnTtAWkGIAhn%2FScreenshot%202019-11-14%20at%2011.17.42%20AM.png?alt=media\&token=7753e154-3591-4658-989a-9f2f533e6627)

What’s less obvious is that it’s actually easier to move items around by clicking the Media Library button and then, if it’s not active already, clicking on Edit Gallery on the side:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-LtefQQ3Lto2YSq5Miv1%2F-LtehcT4BJsoOWNkbN-w%2FScreenshot%202019-11-14%20at%2011.19.12%20AM.png?alt=media\&token=7547ba72-1e38-404d-bf0b-b02fddee15b9)

From here, you can drag and drop images into whatever order you want in a much quicker, easier way. Finally, if you want to change the gallery’s number of columns, you have that option on the side of the page back in your editor:

![](https://4206546585-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lq1lrin55_4hS5LfVW8%2F-LtefQQ3Lto2YSq5Miv1%2F-LtehuFhfq8PkNoVoQaC%2FScreenshot%202019-11-14%20at%2011.20.23%20AM.png?alt=media\&token=f19a1e58-f34e-4a68-8ff9-8a93fa586e84)
