HTMLBundles - PresConsUIUC/PSAP GitHub Wiki

The Collection ID Guide, Advanced Help, and User Manual exist as folder-bundles of HTML files and images. This is so that authors can make changes in an HTML editor without needing to set up and run the PSAP application or be fluent in ERB, Git, etc. Changes are made directly to the bundles, and then the bundles are ingested into the application.

When changing this content, make changes only to the folder bundle (the CollectionIDGuide, AdvHelp, or UserManual folders). All image, video, and HTML filenames must be unique throughout the bundle.

CIDG, advanced help, and user manual URLs look like:

• https://.../collection-id-guide/page#anchor
• https://.../help/page#anchor
• https://.../manual/page#anchor

These correspond to bundle HTML files of:

• CollectionIDGuide/folder/modulename/page.html
• AdvHelp/page.html
• UserManual/page.html

Because filenames map to URLs, they should be changed only as a last resort, as this may cause broken links.

HTML files must be UTF-8-encoded. Whatever text editor you are using, make sure it is set to save files in this encoding.

To link within a bundle, use a tag like: <a href="page.html#section">link</a>.

This link will work when previewing the bundle HTML in a web browser, and it will be automatically modified to work in the application during ingest.

To link from one bundle to another, add a slash before the component name, using a tag like: <a href="/collection-id-guide/page#section">link</a>.

This link will not work when previewing the bundle HTML in a web browser.

1. Images should be placed in an images subfolder (like all the other images) and videos in a videos subfolder.
2. Full-sized images should be at least 3000 pixels on the longest side, if possible (or two times the width of the entry in StaticPageImporter::PROFILES whose type is full). There is no benefit to anything larger. If all you have is smaller, that's OK.
3. Don't create web-ready images yourself. This will be done automatically.
4. Don't modify an image without renaming it, otherwise the change won't propagate to the auto-generated web-ready images from the previous step.
5. Reference only your full-sized images in <img src=""> attributes, like <img src="images/myimage.jpg"> (note forward slash). There is no need to add height or width tags, as they will be replaced.
6. Make sure the case in the src attribute matches the filename. For example, if the image is named MyImage.jpg, set the src to that exactly. Even though setting it to myimage.jpg may appear to work, it will cause problems later.

1. Copy the folder bundle you just changed into db/seed_data, overwriting the current copy.
2. Run the following command to generate derivative images/videos: $ bundle exec rake psap:generate_derivatives.
3. Commit changes with git.
4. Re-seed the content in the database: $ bundle exec rake psap:seed_html_bundles. This command is safe to run in production. In development, db:seed will run it automatically.