How do I add a PDF to a LifterLMS lesson?

Video

# Top

 

How to display a PDF file inside a lesson page

# Top

There are times when it is helpful to add a PDF to a lesson.

Step 1. Open the lesson you want to edit in the block editor. To do this, open the lesson on the frontend, and then click on the Edit Lesson button.

Edit Lesson button

This would open the lesson page in the block editor, as shown below.

Lesson page in the block editor

Step 2. Click on the Toggle block inserter button.

Toggle block inserter button

This will open up the block inserter sidebar, as shown below.

Block inserter sidebar

Step 3. Click on the Search field.

Block inserter sidebar search field

Step 4. Type “File” in the Search field.

Type File in the Search field

Step 5. Click on File block and drag-and-drop it to the lesson content area.

Click on File block and drag-and-drop it to the lesson content area

 

Step 6. If your PDF file is already in the WordPress media library, click on the Media Library button.

If your PDF file is already in the WordPress media library, click on the Media Library button

This will open up a pop-up box where you can select the items from your media library.

Pop-up box where you can select the items from your media library

Click on the PDF file you want to insert in your lesson page.

Click on the PDF file you want to insert in your lesson page

Click on the Select button at the bottom.

Click on the Select button at the bottom

This will insert the PDF file to the lesson page.

PDF file inserted to the lesson page

Step 7. If your PDF file is not yet in the WordPress media library, click on the Upload button. Select the file you wish to upload from your computer.

If your PDF file is not yet in the WordPress media library, click on the Upload button

This will insert the PDF file on your lesson page.

Clicking on the Open button will insert the PDF file on your lesson page

Step 8. Click on the Save button to save the changes.

Click on the Save button to save the changes on the lesson

 

The steps below show how to link a file to several words inside a paragraph. This file used in this tutorial is a PDF file. But any type of file can be used: images, videos, etc.

Step 1. Navigate to Media > Library from the WordPress dashboard.

Navigate to Media and then to Library from the WordPress dashboard

Step 2. Click on the file you want to link to. If the media library is empty, you can just upload assets to it.

Click on the file you want to link to. If the media library is empty, you can just upload assets to it

This will open up a popup box where you can view the file in detail.

A popup box where you can view the file in detail.webp

Step 3. Click on the Copy URL to clipboard button. This will copy the URL.

Click on the Copy URL to clipboard button

Step 5. Go back to the WordPress dashboard or backend of your site.

Step 6. Visit the lesson you want to edit.

Visit the lesson you want to edit

Step 7. Click on the Edit lesson button in the admin toolbar.

Click on the Edit lesson button in the admin toolbar

 

This will open the lesson in the editor.

A lesson open in the block editor

Step 8. Highlight the text or image you want to add a link to.

Highlight the text you want to add a link to

Step 9. Click on the Link icon.

Click on the Link icon

This will open up a pop-up where you can paste the URL you copied from Step 3.

This will open up a pop up where you can paste the URL you copied

Step 9. Paste the URL you copied from Step 3.

Paste the URL you copied

Step 10. Click on the Submit button.

Click on the Submit button

This will attach the link to the text you highlighted.

Step 11. Save the changes by clicking on the Save button.

Save the changes by clicking on the Save button

The steps below show how to link a file to a button. This file used in this tutorial is a PDF file. But any type of file can be used: images, videos, etc.

Step 1. Follow the same steps for adding a link to some words inside a paragraph, but only up to (and including) Step 7.

Step 2. In the block editor, click on the Toggle block inserter button.

In the block editor (Gutenberg), click on the Toggle block inserter button

This will open up the block inserter.

Block inserter open in the block inserter

Step 3. On the Search field, type “Button”.

On the Search field, type Button

Step 4. Click on the Buttons block, and then drag it to where you want it to appear in the content area.

Click on the Buttons block, and then drag it to where you want it to appear in the content area

Button added in the block editor

Step 5. Click on the button (i.e., on the Add text… area).

Click on the Add text… button

Step 6. Type some text on that button. In the example below, we have typed “Click to view PDF file”.

Type some text on that button. In the example below, I typed Click to view PDF file

Step 7. Click on the Link icon.

Click on the Link icon for the button

This will open up a pop up box where you can type the URL or paste any URL you just copied.

A pop up box where you can type the URL or paste any URL you just copied

Step 8. Paste the URL of the file in the “Search or type URL” field.

Paste the URL of the file in the Search or type URL field

Step 9. Click on the Submit button.

Click on the submit button to add the link to that button

Step 10. Save the changes by clicking on the Save button.

Save the changes by clicking on the Save button in the block editor

Other resources

# Top
Last Updated on
Was this article helpful?