Edit a sub-site

On this page

There are a few unique features on the sub-site that we’ve created editing instructions for on this page:

Go to the editing regular pages guide for instructions on adding headings, images, links, and other common Drupal features to your pages. 

What you can do as a sub-site content manager

Sub-site content managers can:

  • Edit pages
  • Unpublish pages
  • Add alerts
  • Add features like headings, links and buttons, cards, and hero images (find instructions in the editing regular pages guide).

Reach out to web-support@lib.arizona.edu to:

Alerts

Add homepage alerts using the Card element in Quickstart.

After logging in, click the Edit tab in the header area of the page.

screenshot of content manager options on a quickstart page

Scroll down in the edit view, click Add Cards.

screenshot of the different types of content that is addable on quickstart

Customize the card:

  • Cards per row on desktop: 1
  • Card style: Borderless cards
  • Card title style: Title within card
  • Uncheck “Clickable cards”
    screenshot of card editing settings

Customize the card content. Select Arizona Red as card background, then add a title and body text. You can also insert a link in the body. Leave Card link title and Card link URL empty.

screenshot of card editor with the selection "arizona red" chosen

Scroll back up to the top of the Cards section, click Collapse.

screenshot of card editor with the "collapse" feature highlighted

Finally, drag the card to the top of page, making it the first element in "Main content”. This can be tricky, since it's a big web page and might load a bit slowly.

When you’re ready, Save the page. The alert will display beneath the search box, since the search box is hardcoded to be at the top of the homepage.

Creating new sub-site pages

  1. Go to Content > Add content > Page.
  2. To create a new HSL sub-site page, the URL path must start with /hsl. To update the URL path of the new page:
    1. Go to “URL alias” in the right column.
    2. Uncheck “Generate automatic URL alias”
    3. Add the path starting with “/hsl.”
  3. Add your content and set the status as “Published.” Select “Save” to publish the page.
  4. If the page needs to be added to the sub-site menu, see Menu link landing page for instructions on updating the menu and adding a page description to the section’s landing page. Only content administrators can update menu link landing pages.

Sub-site header blocks

A sub-site header is a custom paragraph type on our Drupal site. Paragraphs are a Drupal structure that allow you to create components with unique fields and styling that can be reused throughout the site.

Our sub-site paragraph type includes the hero image and title part of our sub-sites. We add the paragraph type to a custom flexible block that we can configure to display under a specific URL path. For example, for the Health Sciences Library sub-site, the sub-site header shows up on every page under the /hsl path.

Edit a sub-site header

Only content administrators can edit a sub-site header. All sub-site headers should follow the same naming convention, which you can use to find the header you want to edit: [sub-site name] - sub-site header.

To view and edit existing sub-site headers:

  • Select "Content" from the Drupal admin menu
  • Select the "Blocks" tab
  • Select the sub-site header you want to view and edit
  • You can edit the image, the title that appears over the hero image, and the link that the header title goes to when selected.
    screenshot of custom block library
    screenshot of editing a custom block which is the hsl subsite header

How to create a new sub-site header

Only content administrators can create a sub-site header.

  1. In the Drupal admin menu, go to “Structure” → “Block layout” → “Create custom block” → “Flexible block.”
  2. Create the flexible custom block for the sub-site header. Name it "[sub-site name] - sub-site header."
  3. Select “Save.”
  4. Then, you’ll need to create a new menu for the sub-site. Go to “Structure” → “Menus” → “Add menu.”
  5. Name the new menu "[sub-site name] - sub-site menu."
  6. Let dev know that the block and menu are created and what URL path the sub-site header and menu should appear under. The dev team will then configure them so that they appear on all pages under whatever path has been chosen for the specific sub-site.

Formatting sub-site header images

Overly-large images in the sub-site header will impact the site performance. Sub-site header images should be:

  • JPEG images only (not PNG)
  • Dimensions: 4092 x 384
  • File size less than 1MB (consider using Image Compressor if you need to compress an image)

The image is placed using the "background position: center" css rule. The image will be positioned in the center of the block for the sub-site header, which is very short and wide. Either pick an image that already matches that aspect ratio or be aware that the top and bottom of the image might get cut off and that the image needs to be very wide in order to avoid a repeating tile effect.

Placing the sub-site header and menu block (for developers)

  • Place the sub-site header block and menu to the "Help" region. To place blocks, to go "Structure" then "Block Layout".

    screenshot of block layout editor

  • Change the visibility of the block and menu block to only display on the sub-site path.

  • When placing the menu block, add a "Theme hook suggestion" that will be used for creating a template override.

    screenshot of block editor showing where to add "theme hook suggestion"

  • Add "subsite-menu" class to the menu block for the sub-site menu when placing it.

  • Using the "Theme hook suggestion", create a template override for the menu. Add the template override to `web/modules/custom/ual_subsites/template'. You can copy an existing one.