Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

Version 1 Current »

Instructions for making a digital gallery in Drupal using objects in Hyrax

Step-by-step guide

  1. Find the series or collection you want to make a gallery for in ArcLight or ArchivesSpace and copy the ASpace Identifier. This will make a gallery for all child archival objects that have digital objects in Hyrax.
    1. I am making a gallery for the Crimson & White, so I find the Crimson & White series in the Milne School Records (https://archives.albany.edu/collections/catalog/ua659aspace_232eda0f4bc2d1cab2fb69ce7b3062b1)
    2. The ID is 232eda0f4bc2d1cab2fb69ce7b3062b1
  2. Make a new or edit an existing Drupal page
  3. Copy the following code into the Edit form:
    1. <script type="text/javascript" src="/sites/all/themes/New_UArchives/js/headerAffix.js"></script>
      <link rel="stylesheet" href="https://archives.albany.edu/browse/css/ua/oneColumn.css" type="text/css"></link>
      <script type="text/javascript" src="/sites/all/themes/New_UArchives/js/hyraxGallery.js"></script>
      <style>
      .galleryItem {
      display: flex;
      align-items: baseline;
      margin: 10px;
      }
      .galleryThumb {flex-grow: 1}
      .galleryThumb img {max-width: 100px; max-height: 120px;}
      .galleryLabel {flex-grow: 4; padding: 20px;}
      /*.flexbox {display: flex; flex-wrap: wrap;}*/
      .loading {text-align: center;}
      </style>
      
      
      <div class="row">
      <div class="container">
      <div id="contentColumn" class="col-md-12">
      <h1 id="ID_HERE" class="seriesTitle" style="text-align:center;">Crimson and White</h1>
      <p>&nbsp;</p>
      
      <div id="OPTIONS_HERE" class="appendHere">
      <div class="loading"><img id="loadingGif" src="/sites/all/themes/New_UArchives/img/loading2.gif" alt="loading..." /></div>
      </div>
  4. Paste the ASpace ID as the id="" attribute for the <h1> tag
  5. Enter options as the id="" attribute for the <div> tag with the class "appendHere"
    1. id="noYears" will not display page headers for each unique date
    2. id="noThumbs" will not display thumbnail images for large groups of objects that will load slowly. A simple bulleted list will display instead.
  6. Publish the Page!
  7. If you need to edit the JavaScript, the important file is here: \\titus\wwwroot\sites\all\themes\New_UArchives\js\hyraxGallery.js

 

  • No labels