Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Adjust the markup as necessary in page.ftl, and these component templates to achieve the desired content structure, and modify the stylesheets to meet layout needs and style your site. Remember that changes should be made in the source directory and that you will need to redeploy the project before the changes are reflected in the live website.

For more information about VIVO and web analytics, see VIVO Web Analytics.

You can find more information about the structure of the VIVO theme in How VIVO creates a page.

...

Code Block
<!-- an image file -->
<img src="${urls.base}/images/arrowIcon.gif"/>

<!-- a CSS file -->
<link rel="stylesheet" href="${urls.base}/css/login.css" />

<!-- a JavaScript file -->
<script type="text/javascript" src="${urls.base}/js/browserUtils.js"></script>

These refer to files in the vitro-corethe vivo/installer/webapp/web directory, which you can override in the vivo/productMods directory/target/vivo directory. If you look, you will see that vivo/productMods already contains some files that override those in vitro/webapp/web. This is because VIVO itself is a customization of Vitro.Image Removedthat this directory contains some files also used in the construction of thr VIVO interface.

Override Freemarker templates that are not in the theme directory

Like adding templates, overriding templates is simplified. You can override a file in vitro-core/webapp/web/templates/freemarker, or one of its sub-directories, by creating a file with the same name and path under vivo/productMods/templates/freemarker.

Image Removed

To override templates not in the theme directory, simply modify freemarker templates in vivo/installer/webapp/target/vivo.  These changes will apply to all your themes.

But VIVO treats all available Freemarker templates as belonging to the same flat namespace, whether they are in the theme directory or in the templates/freemarker directory, or one of its sub-directories. So a file named vitro-coreA file in vivo/installer/webapp/web/templates/freemarker/page/partials/footer.ftl can target/vivo can be overridden by a file called footer.ftl in corresponding file in the theme directory.And it is.

Working on the theme

When you make changes to VIVO, you should make the changes in your VIVO distribution directory, run the build scriptMaven install, restart Tomcat, and test the changes. If you are doing full customizing of VIVO, this cycle might be best.

If you are only working on the theme, you can speed things up.

  • Tell the build script to skip the unit tests: they don't test the theme.
    • ant deploy mvn install -Dskiptests=true
  • Don't restart Tomcat.
    • VIVO always serves the most recent version of CSS files, image files, and JavaScript files. You don't need to restart Tomcat to make that happen.
    • However, your browser may cache these files so you won't see the most recent version. Here are some suggestions for bypassing your browser cache.
  • Tell VIVO to reload Freemarker templates each time they are requested.
    • By default, VIVO will wait one minute before checking for a change in a Freemarker template.
    • In VIVO 1.5.2 or before, add this to deploy.properties: Environment.build=development
    • In VIVO 1.6, add this to build.properties: developer.defeatFreemarkerCache=true
    • In VIVO 1.6.1 or later, use The Developer Panel to defeat the Freemarker cache.
    • This is not a good idea for your production VIVO instance - only for developing your theme.
     See Tips for Interface Developers.

Some developers prefer to make theme changes inside the tomcat/webapp/vivo directory. This eliminates the need to run the build script, but opens the threat of having the changes over-written the next time the build script runs.

When to restart Tomcat

If you make changes to any of the runtime.properties or to any of the RDF files in your VIVO home directory, you must restart Tomcat in order to see the effect of the changes.

...

If you make changes to any of the source files in the theme, including images, CSS, JavaScript or Freemarker templates, you must run the build script, but you do not need to restart Tomcat.

...