Unanswered

Carousel Banner Portal Landing Page

(0) Share

Report

Posted on by Community Power Pla...

Hi!

I have an requirement to establish a carousel banner on portal start page. Currently it looks like this:

I want to replace that "heroimage" with an carousel banner. In this Article its is explained, BUT it its created within the Home/Subtitle Content Snippet. I want it to be displayed over the whole Page as the heroimage. Can anyone advice me how to achieve this?

Categories:

Power Apps portals

I have the same question (0)

All responses (3)

Answers (1)

Verified answer

H V 1,510 on at

Like (2)

Report
Hi @Anonymous

Please go to HOME Web Template.
Replace below code with your "heroimage" inside the HOME Web Template.
<div id="myCarousel" class="carousel slide" data-ride="carousel">  <ol class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="active"></li> <li data-target="#myCarousel" data-slide-to="1"></li> <li data-target="#myCarousel" data-slide-to="2"></li> </ol>  <div class="carousel-inner"> <div class="item active"> <img src="https://www.w3schools.com/bootstrap/la.jpg" alt="Chania"> <div class="carousel-caption"> <h3>Los Angeles</h3> <p>LA is always so much fun!</p> </div> </div> <div class="item"> <img src="https://www.w3schools.com/bootstrap/chicago.jpg" alt="Chicago"> <div class="carousel-caption"> <h3>Chicago</h3> <p>Thank you, Chicago!</p> </div> </div> <div class="item"> <img src="https://www.w3schools.com/bootstrap/ny.jpg" alt="New York"> <div class="carousel-caption"> <h3>New York</h3> <p>We love the Big Apple!</p> </div> </div> </div>  <a class="left carousel-control" href="#myCarousel" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#myCarousel" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> <span class="sr-only">Next</span> </a> </div>

--------------------------
If you like this post, give a Thumbs up. Where it solved your query, Mark as a Solution so it can help other people!

Was this reply helpful? Yes No
Community Power Pla... on at

Like (0)

Report

@hardikv Thanks! It looks like this:

My question is how we get the carousel banner to be full width to replace the other image in the background

Was this reply helpful? Yes No
Community Power Pla... on at

Like (0)

Report

I solved it, I wrongly put the carousel banner within a container which did limit the size!

Was this reply helpful? Yes No