Create a NOAA Themed pkgdown Landing Page

How to create a NOAA themed pkgdown landing site for your tool

Below are steps for creating a NOAA themed pkgdown webpage, with NOAA colors and a NOAA logo footer, for your tool on the toolbox. You can also fork this repo and follow directions.

  1. Set up a pkgdown website for your tool following the instructions from here.
  2. Create a pkgdown folder in your repository and add pkgdown/extra.css. Add the code below to the extra.css file. See extra.css for an example of the CSS code.
@import url("");
  1. Add the code below to to add a footer. See bottom of the for an example of the html code.
<img src="" height="75" alt="NOAA Fisheries">

[U.S. Department of Commerce]( | [National Oceanographic and Atmospheric Administration]( | [NOAA Fisheries](

Examples of tools and packages with NOAA themed pkgdown sites

Adding a video tutoral to your landing page

Follow the instructions below to add a video demo or overview of your tool on your pkgdown landing page. Examples of this can be seen on the wham and bayesdfa pages.

Embed a video in a .md page

Using a link from YouTube or Vimeo:

  1. Click share
  2. Click embed link
  3. Copy and Paste the embed link into the .md file where you want the video to appear

Example code from YouTube embed link:

<figure class="video_container">
  <iframe width="560" height="315" src="" frameborder="0" allowfullscreen="true"> </iframe>