How to use

The "More Block Templates" add-on will install a set of custom templates for some of the built-in blocks: Content, FAQ, Image, Image Slider, Page List, Topic List, Youtube...

All templates are prefixed with Mbt ("More block templates"): "Mbt Lightbox", "Mbt Background Video", "Mbt Background Slider", etc.

To apply a template, simply click on a block, select "Design & Custom template" and choose the appropriate custom template from the dropdown. 

More information on how to use custom templates:

http://documentation.concrete5.org/editors/in-page-editing/block-areas/custom-templates


CONTENT BLOCK

How to open a Content Block in a lightbox?

To open a Content Block in a lightbox, add a Content Block to your page and select the "Mbt Lightbox" custom template.

Next, click on the block and choose "Design & Custom Template" to select a background image or a background color.

Finally, click on the block and choose "Advanced". Enter the title into the Block Name field.

How to change the size of the Content Block thumbnail?

By default, the Content Block thumbnail (when using the Mtb Lightbox template) will have a 16:9 aspect ratio.

To change the size of the Content Block thumbnail, you have two options:

A) Go to Dashboard > System & Settings > Files > Thumbnails, and create a new thumbnail type with the handle "mbt_content". The width and height of the new thumbnail type will be used for the Content Block thumbnail. (PLEASE NOTE: You'll need to go to the File Manager to rescan any images you have already uploaded).

B) If you want the thumbnail to use the original aspect ratio of the background image you have selected, click on the block and enter the following Custom Class: "format-original".


FAQ BLOCK

How to add a smooth scroll effect to a FAQ block?

You simply need to apply the "Smooth Scroll" custom template to your FAQ block.


IMAGE BLOCK

How to open a fileset as a lightbox gallery?

To create a lightbox gallery from a fileset, follow these steps:

1. Create a file set and include some images in it.

More info: http://documentation.concrete5.org/editors/dashboard/files/sets

2. Add an image block to a page. Then click on design & custom template, and choose the "lighbox gallery" custom template.

3. Click on the block again and choose "Advanced". Enter the fileset name into the "Block Name" field.

 

IMAGE SLIDER BLOCK

How to add a background slider to the entire page?

Once you have added the Image Slider block, select the "Background Slider" custom template.

Some themes (such as Elemental) use a solid color as the page background. You'll need to remove that color or make it semi-transparent, or the background slider will not be visible.

If you're using Elemental, go to Design > Theme > Customize, click on the "Page Background" color and adjust the opacity slider.

How to add a background slider to a specific area or layout?

Once you have added the Image Slider block to the area or layout, select the "Background Slider" custom template. Next enter the following custom class: "element-background".


PAGE LIST BLOCK - CAROUSEL

How to change the number of items in the carousel?

After applying the "Mbt Carousel" custom template, you can change the number of items in the carousel by entering one of the following Custom Classes: items-to-show-1, items-to-show-2, items-to-show-3, items-to-show-4, items-to-show-5, items-to-show-6.

How to hide the navigation arrows in the carousel?

Click on the block and enter the following Custom Class: "hide-arrows"

How to hide the navigation dots/bullets in the carousel?

Click on the block and enter the following Custom Class: "hide-dots"

 

PAGE LIST BLOCK - EXPANDING GRID

How to change the number of columns of the grid?

After applying the "Mbt Expanding Grid" custom template, you can change the number of columns of the grid by entering one of the following Custom Classes: items-per-row-1, items-per-row-2, items-per-row-3, items-per-row-4, items-per-row-5, items-per-row-6.

How to change the size of the Page List thumbnails?

By default, the Page List thumbnails (when using the Mbt Expanding Grid template) will have a 16:9 aspect ratio.

To change the size of the thumbnail, you have two options:

A) Go to Dashboard > System & Settings > Files > Thumbnails, and create a new thumbnail type with the handle "mbt_page_list". The width and height of the new thumbnail type will be used for all Page List thumbnails. (PLEASE NOTE: You'll need to go to the File Manager to rescan any images you have already uploaded).

B) If you want the thumbnails to use the original aspect ratio of the images, click on the block and enter the following Custom Class: "format-original".

How to show a different image when the page thumbnail is expanded?

You need a Page Attribute with the handle "mbt_thumbnail_expanded". To create it, go to Dashboard > Pages & Themes > Attributes. Simply add a new "File/Image" attribute with the handle "mbt_thumbnail_expanded". Next, edit your pages, select the newly created attribute, and add the image you want to display when the page thumbnail is expanded.

 

PAGE LIST BLOCK - THUMBNAIL GRID

How to change the number of columns of the thumbnail grid?

After applying the "Mbt Thumbnail Grid" custom template, you can change the number of columns of the grid by entering one of the following Custom Classes: items-per-row-1, items-per-row-2, items-per-row-3, items-per-row-4, items-per-row-5, items-per-row-6.

How to change the size of the Page List thumbnails?

By default, the Page List thumbnails (when using the Mbt Thumbnail Grid template) will have a 16:9 aspect ratio.

To change the size of the thumbnail, you have two options:

A) Go to Dashboard > System & Settings > Files > Thumbnails, and create a new thumbnail type with the handle "mbt_page_list". The width and height of the new thumbnail type will be used for all Page List thumbnails. (PLEASE NOTE: You'll need to go to the File Manager to rescan any images you have already uploaded).

B) If you want the thumbnails to use the original aspect ratio of the images, click on the block and enter the following Custom Class: "format-original".

 

PAGE LIST BLOCK + TOPIC LIST BLOCK

How to build an animated portfolio?

To build an animated portfolio, you'll need a Page List block to display the projects and a Topic List block to filter them.

You can find the documentation on how to use these features at:

http://documentation.concrete5.org/tutorials/how-to-using-topics-and-the-topic-list-block-in-concrete5-5-7

Once you have this set up, you only need to apply the "Mbt Thumbnail Grid" template to the Page List block and the "Mbt Animated Filter" to the Topic List block.

 

TESTIMONIAL BLOCK

How to open a Testimonial Block in a lightbox?

To open a Testimonial Block in a lightbox, add a Testimonial Block to your page and select the "Mbt Lightbox" custom template.

 

VIDEO PLAYER BLOCK 

How to add a background video to the entire page?

Once you have added the Video Player block, select the "Background Video" custom template.

Some themes (such as Elemental) use a solid color as the page background. You'll need to remove that color or make it semi-transparent, or the background slider will not be visible.

If you're using Elemental, go to Design > Theme > Customize, click on the "Page Background" color and adjust the opacity slider.

How to add a background video to a specific area or layout?

Once you have added the Video Player block to the area or layout, select the "Background Video" custom template. Next enter the following custom class: "element-background".

 

YOUTUBE BLOCK 

How to add a background video to the entire page?

Once you have added the Youtube block, select the "Background Video" custom template.

Some themes (such as Elemental) use a solid color as the page background. You'll need to remove that color or make it semi-transparent, or the background slider will not be visible.

If you're using Elemental, go to Design > Theme > Customize, click on the "Page Background" color and adjust the opacity slider.

How to add a background video to a specific area or layout?

Once you have added the Youtube block to the area or layout, select the "Background Video" custom template. Next enter the following custom class: "element-background".