Creating downloadable pdf files in Storyline - an update on earlier methods

Jan 02, 2023

𝖳𝗁𝖾𝗋𝖾 𝗁𝖺𝗏𝖾 𝖻𝖾𝖾𝗇 𝗆𝖺𝗇𝗒 𝖾𝗑𝖼𝖾𝗅𝗅𝖾𝗇𝗍 𝗉𝗈𝗌𝗍𝗌 𝗈𝗏𝖾𝗋 𝗍𝗁𝖾 𝗒𝖾𝖺𝗋𝗌 𝗈𝗇 𝖼𝗋𝖾𝖺𝗍𝗂𝗇𝗀 𝗉𝖽𝖿 𝖿𝗂𝗅𝖾𝗌 𝖻𝗒 𝗎𝗌𝗂𝗇𝗀 𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 𝖿𝗋𝗈𝗆 𝗐𝗂𝗍𝗁𝗂𝗇 𝖲𝗍𝗈𝗋𝗒𝗅𝗂𝗇𝖾 (𝖾.𝗀. Saving Storyline Variables to a PDF - Articulate Storyline Discussions - E-Learning Heroes) 𝖺𝗇𝖽 𝖨 𝗁𝖺𝗏𝖾 𝗁𝖺𝖽 𝗁𝖾𝗅𝗉 𝖿𝗋𝗈𝗆 𝗆𝖺𝗇𝗒 𝗁𝖾𝗋𝗈𝖾𝗌 𝗈𝗇 𝗍𝗁𝗂𝗌 𝗌𝗂𝗍𝖾 𝗐𝗁𝖾𝗇 𝖨 𝗐𝖺𝗌 𝗂𝗇𝗂𝗍𝗂𝖺𝗅𝗅𝗒 𝗍𝗋𝗒𝗂𝗇𝗀 𝗍𝗈 𝖿𝗂𝗀𝗎𝗋𝖾 𝗂𝗍 𝗈𝗎𝗍 𝖿𝗈𝗋 𝗆𝗒𝗌𝖾𝗅𝖿.

𝖬𝗈𝗌𝗍 𝗈𝖿 𝗍𝗁𝖾 𝖺𝗋𝗍𝗂𝖼𝗅𝖾𝗌 (𝗅𝗂𝗄𝖾 𝗍𝗁𝖾 𝗈𝗇𝖾 𝖺𝖻𝗈𝗏𝖾) 𝖺𝗋𝖾 𝖿𝖺𝗂𝗋𝗅𝗒 𝗈𝗅𝖽 𝗇𝗈𝗐 𝖺𝗇𝖽 𝖺𝖽𝗏𝗈𝖼𝖺𝗍𝖾 𝗎𝗌𝗂𝗇𝗀 𝗍𝗁𝖾 𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 𝖼𝗈𝖽𝖾 𝗅𝗂𝖻𝗋𝖺𝗋𝗒 "𝗃𝗌𝖯𝖽𝖿". 𝖠 𝗍𝗒𝗉𝗂𝖼𝖺𝗅 𝖺𝗉𝗉𝗋𝗈𝖺𝖼𝗁 𝗐𝗈𝗎𝗅𝖽 𝖻𝖾 𝗍𝗈 𝖼𝖺𝗉𝗍𝗎𝗋𝖾 𝗒𝗈𝗎𝗋 𝗅𝖾𝖺𝗋𝗇𝖾𝗋'𝗌 𝗂𝗇𝗉𝗎𝗍 𝗎𝗌𝗂𝗇𝗀 𝗍𝖾𝗑𝗍 𝖾𝗇𝗍𝗋𝗒 𝗏𝖺𝗋𝗂𝖺𝖻𝗅𝖾𝗌 𝗂𝗇 𝖲𝗍𝗈𝗋𝗒𝗅𝗂𝗇𝖾 - 𝖺𝗍 𝗍𝗁𝖾 𝖾𝗇𝖽 𝗈𝖿 𝗍𝗁𝖾 𝖼𝗈𝗎𝗋𝗌𝖾 𝗒𝗈𝗎 𝗂𝗇𝖼𝗅𝗎𝖽𝖾 𝖺 𝖻𝗎𝗍𝗍𝗈𝗇 𝗍𝗁𝖺𝗍 𝗍𝗋𝗂𝗀𝗀𝖾𝗋𝗌 𝗌𝗈𝗆𝖾 𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 𝗐𝗁𝗂𝖼𝗁 𝗐𝗈𝗎𝗅𝖽 𝗍𝗁𝖾𝗇 𝗋𝖾𝗍𝗋𝗂𝖾𝗏𝖾 𝗍𝗁𝖾 𝖲𝗍𝗈𝗋𝗒𝗅𝗂𝗇𝖾 𝗏𝖺𝗋𝗂𝖺𝖻𝗅𝖾𝗌, 𝗋𝖾𝖺𝖽 𝗂𝗇 𝖺 𝗉𝗇𝗀 𝗈𝗋 𝗃𝗉𝗀 𝗂𝗆𝖺𝗀𝖾 𝗈𝖿 𝖺 𝗉𝖽𝖿 𝖿𝗂𝗅𝖾 𝗉𝖺𝗀𝖾, 𝗂𝗇𝗌𝖾𝗋𝗍 𝗍𝗁𝖾 𝗋𝖾𝗊𝗎𝗂𝗋𝖾𝖽 𝗍𝖾𝗑𝗍 𝖺𝗍 𝗍𝗁𝖾 𝖺𝗉𝗉𝗋𝗈𝗉𝗋𝗂𝖺𝗍𝖾 𝗑 𝖺𝗇𝖽 𝗒 𝖼𝗈𝗈𝗋𝖽𝗂𝗇𝖺𝗍𝖾𝗌 𝗈𝗇 𝗍𝗁𝖾 𝗉𝖺𝗀𝖾, 𝖺𝗇𝖽 𝗍𝗁𝖾𝗇 𝖼𝖺𝗅𝗅 𝖺 𝖿𝗎𝗇𝖼𝗍𝗂𝗈𝗇 𝗍𝗈 "𝗌𝖺𝗏𝖾" 𝗍𝗁𝖾 𝗋𝖾𝗌𝗎𝗅𝗍𝖺𝗇𝗍 𝖼𝗈𝗆𝗉𝗅𝖾𝗍𝖾𝖽 𝗉𝖽𝖿.

𝖳𝗁𝖾 𝗅𝖾𝖺𝗋𝗇𝖾𝗋 (𝖽𝖾𝗉𝖾𝗇𝖽𝗂𝗇𝗀 𝗈𝗇 𝗍𝗁𝖾𝗂𝗋 𝖻𝗋𝗈𝗐𝗌𝖾𝗋) 𝗐𝗈𝗎𝗅𝖽 𝖻𝖾 𝗉𝗋𝖾𝗌𝖾𝗇𝗍𝖾𝖽 𝗐𝗂𝗍𝗁 𝖺𝗇 𝗈𝗉𝗍𝗂𝗈𝗇 𝗍𝗈 '𝗌𝖺𝗏𝖾' 𝗈𝗋 '𝖽𝗈𝗐𝗇𝗅𝗈𝖺𝖽' 𝗍𝗁𝖾 𝖿𝗂𝗅𝖾.

𝖢𝗋𝖾𝖺𝗍𝗂𝗇𝗀 𝗆𝗎𝗅𝗍𝗂𝗉𝗅𝖾 𝗉𝖺𝗀𝖾 𝗉𝖽𝖿'𝗌 𝗐𝖺𝗌 𝖼𝗈𝗆𝗉𝗅𝗂𝖼𝖺𝗍𝖾𝖽 - 𝖻𝗎𝗍 𝖺𝗅𝗌𝗈 𝗉𝗈𝗌𝗌𝗂𝖻𝗅𝖾. 𝖨'𝗏𝖾 𝗉𝖾𝗋𝗌𝗈𝗇𝖺𝗅𝗅𝗒 𝖽𝗈𝗇𝖾 𝗆𝖺𝗇𝗒 𝗌𝗎𝖼𝖼𝖾𝗌𝗌𝖿𝗎𝗅 𝗉𝗋𝗈𝗃𝖾𝖼𝗍𝗌 𝗎𝗌𝗂𝗇𝗀 𝗍𝗁𝗂𝗌 𝖺𝗉𝗉𝗋𝗈𝖺𝖼𝗁 𝖿𝗈𝗋 𝖽𝗈𝗐𝗇𝗅𝗈𝖺𝖽𝗂𝗇𝗀 𝖼𝗈𝗎𝗋𝗌𝖾 𝗇𝗈𝗍𝖾𝗌, 𝗌𝗎𝗋𝗏𝖾𝗒 𝗋𝖾𝗌𝗎𝗅𝗍𝗌 𝗈𝗋 𝖼𝖾𝗋𝗍𝗂𝖿𝗂𝖼𝖺𝗍𝖾𝗌.

𝗦𝗼 𝘄𝗵𝘆 𝗮𝗺 𝗜 𝗻𝗼𝘄 𝗮𝗱𝘃𝗼𝗰𝗮𝘁𝗶𝗻𝗴 𝗮 𝗱𝗶𝗳𝗳𝗲𝗿𝗲𝗻𝘁 𝗮𝗽𝗽𝗿𝗼𝗮𝗰𝗵?

𝖶𝖾𝗅𝗅, 𝗅𝗂𝗄𝖾 𝗍𝗁𝖾 𝖺𝗋𝗍𝗂𝖼𝗅𝖾𝗌, 𝗃𝗌𝖯𝖽𝖿 𝗂𝗌 𝖺 𝗅𝗂𝖻𝗋𝖺𝗋𝗒 𝗍𝗁𝖺𝗍 𝗁𝖺𝗌 𝖻𝖾𝖾𝗇 𝖺𝗋𝗈𝗎𝗇𝖽 𝗌𝗈𝗆𝖾 𝗍𝗂𝗆𝖾. 𝖨𝗍 𝖽𝗈𝖾𝗌 𝖺 𝗀𝗈𝗈𝖽 𝗃𝗈𝖻 𝖺𝗇𝖽 𝗍𝗁𝗈𝗎𝗌𝖺𝗇𝖽𝗌 𝗈𝖿 𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 𝗉𝗋𝗈𝗀𝗋𝖺𝗆𝗆𝖾𝗋𝗌 𝗋𝖾𝗅𝗒 𝗈𝗇 𝗂𝗍. 𝖨𝗍 𝖼𝖺𝗇 𝖼𝗋𝖾𝖺𝗍𝖾, 𝖺𝗇𝖽 𝗌𝖺𝗏𝖾 𝗉𝖽𝖿'𝗌 𝗃𝗎𝗌𝗍 𝖿𝗂𝗇𝖾. 𝖧𝗈𝗐𝖾𝗏𝖾𝗋, 𝖺 𝗆𝗈𝗋𝖾 𝗋𝖾𝖼𝖾𝗇𝗍 𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 𝗅𝗂𝖻𝗋𝖺𝗋𝗒 "𝗉𝖽𝖿-𝗅𝗂𝖻" 𝗁𝖺𝗌 𝖺 𝖫𝖮𝖳 𝗆𝗈𝗋𝖾 𝖿𝗎𝗇𝖼𝗍𝗂𝗈𝗇𝖺𝗅𝗂𝗍𝗒. 𝖨𝗇 𝗉𝖺𝗋𝗍𝗂𝖼𝗎𝗅𝖺𝗋, 𝗂𝗍 𝖼𝖺𝗇

𝗆𝗈𝖽𝗂𝖿𝗒 𝖾𝗑𝗂𝗌𝗍𝗂𝗇𝗀 𝗉𝖽𝖿'𝗌

𝖼𝗋𝖾𝖺𝗍𝖾, 𝖿𝗂𝗅𝗅 𝖺𝗇𝖽 𝖿𝗅𝖺𝗍𝗍𝖾𝗇 𝗉𝖽𝖿 𝖿𝗈𝗋𝗆𝗌

𝖺𝖽𝖽, 𝗂𝗇𝗌𝖾𝗋𝗍 𝖺𝗇𝖽 𝗋𝖾𝗆𝗈𝗏𝖾 𝗉𝖺𝗀𝖾𝗌 𝖿𝗋𝗈𝗆 𝖺 𝗉𝖽𝖿

...𝖺𝗇𝖽 𝖺 𝗐𝗁𝗈𝗅𝖾 𝗅𝗈𝗍 𝗆𝗈𝗋𝖾.

𝖳𝗁𝗂𝗌 𝗆𝖾𝖺𝗇𝗌 𝗍𝗁𝖺𝗍 𝗂𝗇𝗌𝗍𝖾𝖺𝖽 𝗈𝖿 𝗉𝖺𝗂𝗇𝖿𝗎𝗅𝗅𝗒 𝗐𝗈𝗋𝗄𝗂𝗇𝗀 𝗈𝗎𝗍 𝗐𝗁𝖾𝗋𝖾 𝗒𝗈𝗎 𝗇𝖾𝖾𝖽 𝗍𝗈 𝗉𝗅𝖺𝖼𝖾 𝗍𝗁𝖾 𝗍𝖾𝗑𝗍 𝗈𝗇 𝖾𝖺𝖼𝗁 𝗉𝖺𝗀𝖾 𝗈𝖿 𝗍𝗁𝖾 𝗉𝖽𝖿, 𝗒𝗈𝗎 𝖼𝖺𝗇 𝗌𝗂𝗆𝗉𝗅𝗒 𝖽𝖾𝗌𝗂𝗀𝗇 𝖺 𝗉𝖽𝖿 𝖿𝗈𝗋𝗆, 𝗇𝖺𝗆𝖾 𝗍𝗁𝖾 𝖿𝗂𝖾𝗅𝖽𝗌 𝖺𝗇𝖽 𝗍𝗁𝖾𝗇 𝗎𝗌𝖾 𝗍𝗁𝖾 𝗋𝖾𝗍𝗋𝗂𝖾𝗏𝖾𝖽 𝗏𝖺𝗋𝗂𝖺𝖻𝗅𝖾𝗌 𝖿𝗋𝗈𝗆 𝖲𝗍𝗈𝗋𝗒𝗅𝗂𝗇𝖾 𝗍𝗈 '𝖿𝗂𝗅𝗅' 𝗈𝗎𝗍 𝗍𝗁𝖾 𝖿𝗈𝗋𝗆.

𝖶𝖾 𝗁𝖺𝗏𝖾 𝖻𝖾𝖾𝗇 𝖺𝗐𝖺𝗋𝖾 𝗈𝖿 𝗉𝖽𝖿-𝗅𝗂𝖻 𝖿𝗈𝗋 𝗌𝗈𝗆𝖾 𝗍𝗂𝗆𝖾 𝖻𝗎𝗍 𝗇𝖾𝗏𝖾𝗋 𝖿𝗈𝗎𝗇𝖽 𝗍𝗁𝖾 𝗍𝗂𝗆𝖾 𝗍𝗈 𝖽𝗈 𝖺𝗇𝗒𝗍𝗁𝗂𝗇𝗀 𝖺𝖻𝗈𝗎𝗍 𝗂𝗍 (𝗎𝗌𝗂𝗇𝗀 𝗍𝗁𝖾 𝗈𝗅𝖽 𝗉𝗋𝗈𝗀𝗋𝖺𝗆𝗆𝖾𝗋𝗌' 𝖺𝖽𝖺𝗀𝖾 "𝗂𝖿 𝗒𝗈𝗎𝗋 𝖼𝗈𝖽𝖾 𝗂𝗌 𝗐𝗈𝗋𝗄𝗂𝗇𝗀 𝖽𝗈𝗇'𝗍 𝗍𝗋𝗒 𝖺𝗇𝖽 𝖿𝗂𝗑 𝗂𝗍"). 𝖮𝗏𝖾𝗋 𝗍𝗁𝖾 𝖢𝗁𝗋𝗂𝗌𝗍𝗆𝖺𝗌 𝖻𝗋𝖾𝖺𝗄 𝗂𝗇-𝖻𝖾𝗍𝗐𝖾𝖾𝗇 𝖼𝖾𝗅𝖾𝖻𝗋𝖺𝗍𝗂𝗈𝗇𝗌 (𝖺𝗇𝖽 𝗉𝗋𝗈𝖻𝖺𝖻𝗅𝗒 𝖿𝗎𝖾𝗅𝖾𝖽 𝖻𝗒 𝗍𝗈𝗈 𝗆𝗎𝖼𝗁 𝖿𝖾𝗌𝗍𝗂𝗏𝖾 𝗌𝗉𝗂𝗋𝗂𝗍 𝗈𝗇 𝗈𝖼𝖼𝖺𝗌𝗂𝗈𝗇𝗌) 𝗐𝖾 𝗐𝖾𝗋𝖾 𝖺𝖻𝗅𝖾 𝗍𝗈 𝗀𝖾𝗍 𝖺 𝗇𝖾𝗐 (𝖻𝗎𝗍 𝗏𝖾𝗋𝗒 𝖻𝖺𝗌𝗂𝖼) 𝖽𝖾𝗆𝗈𝗇𝗌𝗍𝗋𝖺𝗍𝗂𝗈𝗇 𝗐𝗈𝗋𝗄𝗂𝗇𝗀 𝗐𝗁𝗂𝖼𝗁 𝖼𝖺𝗇 𝖻𝖾 𝗏𝗂𝖾𝗐𝖾𝖽 𝗁𝖾𝗋𝖾:

https://demo5.profilelearning.com

𝖮𝗄, 𝗍𝗁𝗂𝗌 𝗂𝗌𝗇'𝗍 𝖺 𝗏𝖾𝗋𝗒 𝗂𝗆𝗉𝗋𝖾𝗌𝗌𝗂𝗏𝖾 𝖽𝖾𝗆𝗈 - 𝖻𝗎𝗍 𝗐𝖾 𝖺𝗋𝖾 𝗐𝗈𝗋𝗄𝗂𝗇𝗀 𝗈𝗇 𝗂𝗍 - 𝖺𝗇𝖽 𝗐𝗂𝗅𝗅 𝗉𝗎𝖻𝗅𝗂𝗌𝗁 𝗍𝗐𝗈 𝗈𝗋 𝗍𝗁𝗋𝖾𝖾 𝗆𝗈𝗋𝖾 𝖺𝗋𝗍𝗂𝖼𝗅𝖾𝗌 𝖾𝗑𝗉𝗅𝖺𝗂𝗇𝗂𝗇𝗀 𝖺 𝖻𝗂𝗍 𝗆𝗈𝗋𝖾 𝖺𝖻𝗈𝗎𝗍 𝗍𝗁𝗂𝗌 𝖼𝗈𝖽𝖾 𝗅𝗂𝖻𝗋𝖺𝗋𝗒 𝖺𝗇𝖽 𝖺𝗅𝗌𝗈 𝖺𝖻𝗈𝗎𝗍 '𝗆𝗈𝖽𝖾𝗋𝗇 𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍'

𝗝𝘂𝘀𝘁 𝘁𝗼 𝘄𝗵𝗲𝘁 𝘆𝗼𝘂𝗿 𝗮𝗽𝗽𝗲𝘁𝗶𝘁𝗲 𝗮 𝗹𝗶𝘁𝘁𝗹𝗲 𝗳𝘂𝗿𝘁𝗵𝗲𝗿 𝘁𝗼 𝗯𝗼𝗼𝗸𝗺𝗮𝗿𝗸 𝘁𝗵𝗶𝘀 𝗽𝗼𝘀𝘁 - 𝘄𝗲 𝗮𝗹𝘀𝗼 𝗵𝗮𝘃𝗲 𝘁𝗵𝗲 𝗮𝗯𝗼𝘃𝗲 𝗱𝗲𝗺𝗼𝗻𝘀𝘁𝗿𝗮𝘁𝗶𝗼𝗻 𝘄𝗼𝗿𝗸𝗶𝗻𝗴 𝗶𝗻 𝗥𝗜𝗦𝗘....

59 Replies

Nedim Ramic

1 month ago03/21/24 at 1:21 am (UTC)

Thank you for sharing, John! I've been searching for something like this for my client, and it's wonderful to discover that this method, along with this JavaScript library, offers even more possibilities. I've successfully implemented it as a web object triggered by a button click, allowing me to fetch and save the PDF template. This enables me to publish it to Review 360 for my client's review and feedback. Additionally, I've made efforts to avoid duplicating the PDF template to the root directory each time I publish the course. By keeping it within the web object folder, the PDF template remains easily accessible at all times. I just started following your LinkedIn company page.

John Cooper
Author

1 month ago03/21/24 at 7:51 am (UTC)

Hi Nedim

I'm glad this discussion was of use. I have also used the same approach and JavaScript library to provide downloadbale notes in RISE. This is done by using Storyline blocks for the text entry and then storing the variables in local browser storage until the end of the course when another Storyline block populates the notes document from the pdf template.

I had a request on another thread to run a workshop on this for RISE developers and there are two FREE on-line workshops running next Tuesday (26th March) which will walk through an example of this. If anyone is interested in attending, send me a message and I can provide a link.

1 month ago03/21/24 at 12:10 pm (UTC)

Hi John, I'm interested in attending!

1 month ago03/21/24 at 7:55 pm (UTC)

Hi John. I'm interested. Hope I'll get some spare time to attend it.

26 days ago04/03/24 at 7:43 pm (UTC)

Hello, John! I see the workshops have passed; do you know if there's a recording of the workshop?

Also, is this just a solution for Rise or can it be applied to Storyline 360? Frankly, I have *zero* Javascript experience so this might be out of my league entirely.

25 days ago04/04/24 at 6:43 pm (UTC)

Hi Heather,

Feel free to open a case with our support team here if you'd like to request recordings of trainings or webinars that you may have missed. I'll let John help you with the Javascript side of things!

John Cooper
Author

25 days ago04/04/24 at 9:17 pm (UTC)

Hi Heather

The workshops were a one-off and were specific to creating downloadable notes in RISE using Javascript and local browser storage. They weren't recorded because the workshop usedseveral short video clips demonstrating the key steps in the approach. I am currently converting these into a single asynchronous elearning that covers the whole process and step-by-step instructions, which I will make available on our site.

BUT, if your interest is just to do this in Storyline, I posted details and a short demo of this earlier in this thread. It looks a bit daunting if JavaScript isn't your thing - but it is, actually, fairly simple code.

If you download the sample Storyline file and the pdf template in this post, I would be happy to help go through that example.

The nice thing about this approach is that you, firstly, design your handount as a pdf template inserting fields where you want the learner's input to go - no JavaScript at all involved in that bit! You then just copy the code from the Storyline sample and it should be reasonably simple to work out where your field names need to go.

But, as I say - happy to assist, if I can.