HTML Components | Examples
The HTML component in Pages gives you the ability to format, link, and customize the layout of your text and visuals in a Page using standard HTML.
This article provides examples of HTML (iframe) components in admin view of the Intellum platform and the resulting content in learner view.
Things to Note:
- The platform does not validate custom code. Any incorrect HTML you add may have an effect on other Page components.
HTML Component Examples
Iframe Embeds:
An iframe embed in Admin View:
![](https://cdn.exceedlms.com/uploads/resource_images/targets/5488905/page_regular/2024-05-29-15-18-34.png?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uZXhjZWVkbG1zLmNvbS91cGxvYWRzL3Jlc291cmNlX2ltYWdlcy90YXJnZXRzLzU0ODg5MDUvcGFnZV9yZWd1bGFyLzIwMjQtMDUtMjktMTUtMTgtMzQucG5nIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzI1NzYxMjc0fX19XX0_&Signature=Qh629CJNByRoVZSxGAiBmzKO1Vj6wFIm3GWSo9iqskbQ8QL1fnYQrZsBoYuT3XGQkEFJUeyFhXmdXE0dLhTgs9y5zmfLj8aPnpzF4fon064ADINtV-3YR3sYypCTQ11yIrsS5nrgp1WdGK~MwJW4qcr79Bs1LMcB90bao5ChUaLdrvG1YJuiIT6niFdjedRef78NNO5XWyhGMvmzMcL6MjJq-oGSeePRnQdcyWXN5iSQkjN3daHNYFbm9JBBmjxD04N8K1ylwcjNDdQmsybH4wJ3VrWfyCTlW4DYMznlY19En1BVCvx9LvdUEAh2RluPW8K95AjJqqFmrGtqv2XZyg__&Key-Pair-Id=APKAJINUZDMKZJI5I6DA)
and here's the result in Learner View:
![](https://cdn.exceedlms.com/uploads/resource_images/targets/5488949/page_regular/2024-05-29-15-21-44.png?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uZXhjZWVkbG1zLmNvbS91cGxvYWRzL3Jlc291cmNlX2ltYWdlcy90YXJnZXRzLzU0ODg5NDkvcGFnZV9yZWd1bGFyLzIwMjQtMDUtMjktMTUtMjEtNDQucG5nIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzI1NzYxMjc0fX19XX0_&Signature=FRoFwP9doVphENAg~UjIeuBZftwkBqOA5E1sgIPloUezL3d-NcRUfqXgwUJQl1FtAMt-WGighia8h5i1IsyhIEflmyAgjYNATJaHbL-~nRveNELtbOSyJeVcDgxnTPUzPU6wE4TuvxJPFaKjZVo8xcev5m3DH8Pz7G9V4KEoLhRYJCFzGeVbTdqR8h-l5sotwubsA7doJsS5Oe1ZVhNBRCSE04P5Y4t0f2H9Ht~zSL8HTZRxJg1g4x9M4N4R0YLbDnrhGaIl2xpGR1472WJQfBVOpo-CNc5H2g9OPKDeU1PDFKcgXVGoZcnamAtLBLVBLfdYM0~c3~zEvtZesGjhbg__&Key-Pair-Id=APKAJINUZDMKZJI5I6DA)
![](https://cdn.exceedlms.com/uploads/resource_images/targets/1449628/page_regular/hr1.jpeg?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uZXhjZWVkbG1zLmNvbS91cGxvYWRzL3Jlc291cmNlX2ltYWdlcy90YXJnZXRzLzE0NDk2MjgvcGFnZV9yZWd1bGFyL2hyMS5qcGVnIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzI1NzYxMjc1fX19XX0_&Signature=G6netKBGFGFmkz1dVfc35F9Ekh2aJPNJu~6ukfDa3ywQYBBn7jNbd1b2oyVqjtlaGtGGarEZDJ-I1z6sopXZ75QbAyp7HjYZdqLt-gdMp7zjrR-Rj2DVR0tgv99WQ14lXxU9ZxaK6I8e-ldH-ukO5e5kYAh-d7VSmtIcbejPdBioF570ZsCMo2wLKLUp9WGxsnH5sOHWqWUE3mOEutSJSuQL6Njksg9sJCLTgdGuMiFOuQ05hP6wjrF6SImLj8-4~zLz~RehDiNDbQQRC2ow92UJ~T1ur5GzX2wn4BGWN0mFZdl6IfxdzU4-xNUKYIvCAINbo1agHX5FSvIF0dA1qg__&Key-Pair-Id=APKAJINUZDMKZJI5I6DA)
HTML Tables
Creating an HTML table in Admin View:
![](https://cdn.exceedlms.com/uploads/resource_images/targets/1449629/page_regular/table.png?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uZXhjZWVkbG1zLmNvbS91cGxvYWRzL3Jlc291cmNlX2ltYWdlcy90YXJnZXRzLzE0NDk2MjkvcGFnZV9yZWd1bGFyL3RhYmxlLnBuZyIsIkNvbmRpdGlvbiI6eyJEYXRlTGVzc1RoYW4iOnsiQVdTOkVwb2NoVGltZSI6MTcyNTc2MTI3NX19fV19&Signature=AZSlVLr-wYrdAtuH3cKYuWnNGiS8Z2ohLpJPc9~n2c2ymphsr19iXNjq3W0EXSK0Hkpv23ZZt7D01b~smfI9yPcwehilZ3JWTqlfCt-vXjy7ZIZDUuG-W3Tu1JxqYacHpZhm4yRy9kuVr-Pa1ygbnIKR6FUnIrdBzSNocGVbC-p5JymNqYbi2yw4ysmUoIe83csKC8uI4WutWFzY8jG~bzyUGBpGSUoJETu07LOZz97fqd1WCaRBCsuT6G-wu6maEwn0W5jjFEJKFRK4OFCCuRm8acFP2wFG4~UoAsHnZ6vySPfke-5vO5vHVzWGZEVWymldcT2a0-a-0LM1kJeHWw__&Key-Pair-Id=APKAJINUZDMKZJI5I6DA)
and here's the table in Learner View:
Table Header | Table Header | Table Header |
---|---|---|
Table cell | Table cell | Table cell |
Table cell | Table cell | Table cell |
Table cell | Table cell | Table cell |
Table cell | Table cell | Table cell |
Table cell | Table cell | Table cell |
![](https://cdn.exceedlms.com/uploads/resource_images/targets/1449630/page_regular/hr4.jpeg?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uZXhjZWVkbG1zLmNvbS91cGxvYWRzL3Jlc291cmNlX2ltYWdlcy90YXJnZXRzLzE0NDk2MzAvcGFnZV9yZWd1bGFyL2hyNC5qcGVnIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzI1NzYxMjc1fX19XX0_&Signature=fsZCGR4adFuPMZK-AvnpE8Ln6iF6W-6~8yFhJqb056BnTfNVVWFTm4H95BuS16I3JDw7NTloWZvEKe-lNc2T9WMrw3~fEnf96InvMp5WMwGF0BFnZEzTN2GIpgqXgbKJXNrwJa8v7HePpYA15SMttvB3roGlzDRrht4x8Kl1oruJrT328lwU9ieJtof4pNSWhxMPtRMQY6d1RK6vT0-40jfY6fB-9Zo60DSbjUpcW9wTKgKGB0Os2HRMdO~Ej~spqqW1pV2067Chi4kQBkpEIhLwRq9EaTTZ2w579mwLLIJBRnEW2bfMcXoM5KSCSCeHNh6kVkJW8GLdO39b1qEBBg__&Key-Pair-Id=APKAJINUZDMKZJI5I6DA)
Responsive Images
Adding a responsive image in Admin View:
![](https://cdn.exceedlms.com/uploads/resource_images/targets/1449631/page_regular/responsive.png?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uZXhjZWVkbG1zLmNvbS91cGxvYWRzL3Jlc291cmNlX2ltYWdlcy90YXJnZXRzLzE0NDk2MzEvcGFnZV9yZWd1bGFyL3Jlc3BvbnNpdmUucG5nIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzI1NzYxMjc1fX19XX0_&Signature=QLDogSv5cHLSUeepGl5nusox-0TiVLcw4CnHTL0jvcpQ7zXHgon6C~bu7Qu-nP8eoNr6sdtZ2nIF1qnt3b2Q-UqX7EFEOV23kV13MFoajHjhJjwXib5rxBvl6bjVd6pY52NOYND~VtMhLOgFCiAyyz4mS7kcyjYh8Jo5GEOg6pvVymllniBGN7yydgNHXNsVyJO38MpIKL~BUfDf4YOJ6rJrMcao-MmJiGQXHl0gnk7fbEB2Q8ahBK6cyE9t3hayc0GHqkNAMVsZKZ1eg-XYMOl9UgkCFF4ISQejCyh~KDs-JBxoM7fJbFr-g1smexMLCfC-ginv-LmlM7Uz32xcMw__&Key-Pair-Id=APKAJINUZDMKZJI5I6DA)
and here's the responsive image in Learner View:
Heads Up!
Responsive images will resize to the viewport size if they're too wide to fit.
Non-responsive images do not, and may result in horizontal scrolling.