This package (YourPackage.zip) is delivered with several Modern Page Templates, two of which contain the embedded carousel slider:
Both templates are intended for use as Home Pages or Welcome Pages within your sites. If the carousel slider is not displayed within the Modern Page Templates, see the Installation Instructions 01-SPFx.pdf file inckuded in your theme package for further instructions. You will find them under the heading "Important Note for embedding Carousel Slider and Footer."
Important Note for Carousel A*
To embed carousel slider on your pages, you need to upload the entire folder named MT-Embed_This_Folder from the extracted YourPackage.zip file to your preferred location within your SharePoint Online Tenant.
When the template is loaded, click Edit link on the right side of the command bar to make edits on the page.
Click the Edit icon located in the upper left corner of the carousel.
In the Website address or embed code field, update the URL to the new location of the MT-Embed_This_Folder folder:
<iframe name="mtCarousel" width="100%" height="39%" src="https://YourSite/MT-Embed_This_Folder/Embed-This-Carousel.aspx"></iframe>
Use the above code to embed the slider on the carousel at any of your Modern Sites.
If the following message appears below the Website address or embed code field, ask your admin to add your website URL to the list of websites from which the content can be displayed. For more info on this click Guidance on changing site settings.
The carousel slider is strictly based on carousel bootstrap. It is recommended that, as a starting point you will download one of our images that we use within the carousel. It will help you get started in setting the dimensions of your images for the carousel.
To save an image to your device:
Next, you need to modify the carousel source code:
Provide changes for each slide between sections <!-- Slide # B E G I N --> and <!-- Slide # E N D -->
After your changes are complete, save the Embed-This-Carousel.aspx file.
<!-- Slide # B E G I N -->
<div class="item">
<div class="item">
<img width="100%" height="100%" alt="Alternate Text" src="https://sharepointpackages.com/images/images-MT_WP/carousel/MT_Carousel_107.jpg" data-themekey="#"/></div>
<div class="container">
<div class="carousel-caption carousel-caption-left">
<h1>Layouts and Web Parts</h1>
<p class="lead">Get the predefined MT Layouts, web parts, and color palettes to quickly and effectively manage your SharePoint content.</p>
<a class="btn" role="button" href="http://www.sharepointpackages.com/index.php?main_page=page&id=52" target="_blank">Review Contents</a></div>
</div>
</div>
<!-- Slide # E N D -->
To embed accordion on your pages, you need to upload the entire folder named MT-Embed_This_Folder from the extracted YourPackage.zip file to your preferred location within your SharePoint On-Premises 2019.
Note:
Once the MT-Embed_This_Folder is uploaded to your preferred location, you can embed the accordion on any of your modern pages.
Depending on your needs, you can create multiple accordions with different content and embed them on your preferred pages simply by copying the Embed-This-Accordion.aspx file, and changing the name and content of each new copy of the file.
When the template is loaded, click Edit link on the right side of the command bar to make edits on the page.
Click the Edit icon located in the upper left corner of the accordion.
In the Website address or embed code field, update the URL to the new location of the MT-Embed_This_Folder folder:
<iframe name="mtAccordion" width="100%" height="580" src="https://YourSite/MT-Embed_This_Folder/Embed-This-Accordion.aspx"></iframe>
Use the above code to embed the accordion on any of your Modern Sites.
If the following message appears below the Website address or embed code field, ask your admin to add your website URL to the list of websites from which the content can be displayed. For more info on this click Guidance on changing site settings.
To modify the source code of the accordion:
Note*
You can use any editor to modify the accordion's source code. You can start by opening the Embed-This-Accordion.aspx file from the folder named MT-Embed_This_Folder located in the extracted YourPackage.zip file, making edits, and uploading it to the site.
Provide changes to each section between <!-- B E G in --> and <!-- E N D -->
After your changes are complete, save the Embed-This-Accordion.aspx file.
<!-- B E G in --> <div> Accordion Content </div> <!-- E N D -->