Follow

Karousel Block

Instruction for Karousel block

The Karousel block is used to add add a rotating banner (carousel banner) to an LMS page. This block requires a basic knowledge of Twig templating engine syntax and Flexslider for the initial configuration. Please lodge a support ticket if you are not familiar with either of them.

Turn on Karousel block

  • Select Manage blocks from Site administration > Plugins > Blocks.
  • Here you will see the list of available blocks.
  • Find Karousel
  • The eye icon on the 4th row allows you to alter if this plugin is hidden or visible.
    • Hidden, greyed out with a cross through it
    • Visible, eye icon without a cross through it

Adding a Karousel block to a page

  • Select Turn editing on
  • Select Karousel from the list of blocks form the Add a block select box
  • Configure the Karousel block by clicking on the cog icon on the newly added block
  • Here click the Manage Karousel link
  • On that page you should see the following tabs
    • Settings
    • Image Properties
    • Images
    • Templates
    • Import / Export
    • Return to Block
  • To set up a basic rotating image banner, click on the Templates tab
  • Copy the below code and paste on a notepad, then from the notepad copy the text again and paste it in the input field Twit Codeand save changes.
<div class="flexslider kineo-carousel">
<ul class="slides">
{% for image in images %}
<li>
<img src="{{ image.image }}" />
</li>
{% endfor %}
</ul>
</div>

  • Click the images tab
  • Click add image and upload the new banner image in the form.

The rotating banner should now be working.

 

 

 

 

 

 

 

 

Have more questions? Submit a request

Comments

Powered by Zendesk