If you want a user to open a document, read it and then confirm that they have read it, then here is a cool script developed by Dylan to do that, and then mark the page as complete when they are done.

Instructions:

1. Create a content page in your CLS course
2. Add a plain text template to the page
3. Edit the content HTML template
4. In the 'Design' Tab click on the 'Source code menu item ' < > '
5. Paste in the HTML section below
6. Click 'Ok'
7. Click the 'Style' tab
8. Paste the CSS sesction below
9. Select the 'Script' tab
10. Paste in the javascript below
11. Select 'Save form the bottom of the screen
12. You can then edit the Text and URL's in the HTML design tab

HTML Section

<!-- Page completion box -->
<div id="interaction-section">
    <div id="interaction-icon"><i class="fa fa-folder-open fa-5x" aria-hidden="true"></i></div>
    <div id="interaction-content">
        <div id="interaction-main">
            <h4 id="interaction-main-title"><a id="interaction-main-title-link" href="https://www.google.com" target="_blank">Richard and Mary's Story (10 min)</a></h4>
            <div id="interaction-main-status">
                <p>Status: <strong><span id="status">Unread</span></strong></p>
            </div>
        </div>
        <div id="interaction-confirm">
            <p><input id="interaction-confirm-checkbox" type="checkbox" name="confirmation" value="confirmation" disabled="disabled" /> I acknowledge I have viewed this whole video.</p>
        </div>
    </div>
</div>

CSS Section

#interaction-section {
  height: 100px;
  border: 1px solid #E6E6E6;
  border-radius: 25px;
}

#interaction-icon {
  float: left;
 height: 100%;
  border-right: 1px solid #E6E6E6;
}

#interaction-icon i {
  padding: 10px; 
  margin-left: 4px;
  margin-top: 12px;
}

#interaction-main {
   height: 45px;
}

#interaction-main h4, 
#interaction-main p {
   margin-left: 20px;
}

#interaction-main-title {
   margin-bottom: 2px;
}

#interaction-main-title-link {
   margin-left: 20px;
}

#interaction-main-status {
   color: red;
}

#interaction-main-status p{
   margin-left: 110px;
}

#interaction-confirm {
height: 43px;
color: #565656;
border-top: 1px solid #E6E6E6;
overflow: hidden;
background-color: #F2DEDE;
border-bottom-right-radius: 25px;
}

#interaction-confirm p{
margin-left: 20px;
padding-top: 8px;
}

Javascript Section

// Handle completion for interactive panels
// ------------------------------

var hasCompletedContent = false;

var completeContent = function(){
   if(!hasCompletedContent) {
      if(typeof completeInteractiveContent == 'function') {
         completeInteractiveContent('{panel-id}');
      }

      hasCompletedContent = true;
   }
}

$(document).ready(function() {
   if (coursePlayer && coursePlayer.currentItem.Completed) {
      $('#interaction-confirm-checkbox').prop('checked', true);
      $('#interaction-confirm-checkbox').prop('disabled', true);
      $('#interaction-main-status').css('color', 'green');
      $('#status').text("Read");
      
      $('#interaction-confirm').css('background-color', '#DFF0D8');
      $('#interaction-confirm').css('color', '#565656');
   } else {
      $('#interaction-main-title-link').click(function() {
         $('#interaction-confirm-checkbox').prop('disabled', false);
         $('#interaction-main-status').css('color', 'green');
         $('#status').text("Read");

         $('#interaction-confirm-checkbox').click(function() {
            if ($('#interaction-confirm-checkbox').prop('checked', true)) {
               completeContent();

               $('#interaction-confirm-checkbox').prop('disabled', true);
               $('#interaction-confirm').css('background-color', '#DFF0D8');
               $('#interaction-confirm').css('color', '#565656');
            }
         });
      });
   }
});