WordPress.org

Forums

Custom Theme Development, Bootstrap Carousel Not Appearing (4 posts)

  1. laichejl
    Member
    Posted 1 year ago #

    Hello,

    I am currently developing my first custom theme; I'm transferring a website I made in class using Bootstrap into a theme with custom WordPress content. I'm using a static homepage. In my original website, I used a Bootstrap carousel I found on Google, which was just some custom CSS and corresponding HTML based on the Bootstrap framework. I've tried implementing that into my front-page.php file but the slider will not show up.

    I've checked my source code and both the CSS and JS files are appearing on my page, so thats not the issue. Here is the code I've used to make the slider appear:

    <div id="myCarousel" class="carousel slide">
    			<div class="carousel-inner">
    				<?php $args = array(
    					'category_name' => 'Slider'
    					); ?>
    				<?php
    				$the_query = new WP_Query($args);
    				?>
    				<?php if( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
    				<div class="item">
    					<?php the_post_thumbnail(); ?>
    				</div>
    			<?php endwhile; endif; ?>
    
    			<a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a>
    			<a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>
    		</div>
    	</div>

    You can find my webpage at http://www.testing.jaylaiche.com. Thanks for the help in advance!

  2. Are you able to share your front-page file?

    Use pastebin or gist, please.

  3. laichejl
    Member
    Posted 1 year ago #

  4. Was able to poke around a little more and noticed that you are loading bootstrap twice? At least to a certain extent. One is bootstrap.css and the other is bootstrap-theme.css which may be causing some of the issue.

    Downside is I'm not too familiar with how bootstrap is coded/works enough to tell you how to fix it.

Topic Closed

This topic has been closed to new replies.

About this Topic