Site icon Hip-Hop Website Design and Development

Working Bootstrap Carousel Conversion to WP – Technical Questions

I’ve coded a working Bootstrap carousel, it must be transformed to WP. It is a small chunk of the location, however as a WordPress beginner, am caught in understanding the technical challenge.

So this is what I’m attempting to do:

To point out all these posts which have a featured picture uploaded to indicate as part of the Bootstrap carousel, then to restrict the posts per web page as wanted.

As a primary step, I assumed to not use WP_Query for this objective. And take a look at the common posts loop.

<?php if(have_posts()) {
          ?>
            <div class="carousel-inner" position="listbox">
              <?php
                $postNumber = 0;
                    whereas(have_posts()) {

                          the_post(); ?>
  <!-- 1st Slide  -->
  <div class="carousel-item <?php echo $postNumber == 0 ? 'lively' : ''; ?>">

    <!-- Part Featured Posts Begin -->
    <div class="featured">
      <div class="container">
        <div class="row text-center">
          <div class="col-12 m-auto pt-5">

            <?php if(has_post_thumbnail()) {  ?>

So I take advantage of has_post_thumbnail() as a verify to solely embrace these posts which has a featured thumbnail connected to indicate these in carousel. If I connect an lively class to carousel-item div, all of those posts show directly in carousel.

And if I take advantage of flag, similar to $postNumber to provoke it at 1 and for the whereas loop, verify to see if $postNumber is 1 then use a situation so as to add ‘lively’ to carousel-item div. And reset the $postNumber to 0 on the finish of first loop. It does not fairly work accurately. So I attempted utilizing current_post with utilizing a customized question however that does not work. Both no content material is proven within the carousel or in any other case carousel shows however it neither strikes routinely however solely on clicking again arrow, it strikes as soon as.

One other challenge, is find out how to dynamically set indicators of carousel to show as per the variety of posts. It is simple if we restrict no. of posts in question and use the identical quantity right here but when we are able to make this dynamic.

As a WordPress beginner, I’ve discovered a variety of totally different factor from utilizing shortcodes, to child-themes and utilizing Choices API together with various different issues for each themes and plugins. It was vital to place these learnings in to motion.

So I’ve designed an internet site from scratch in Photoshop, coded it in Bootstrap and now changing it to WordPress. So this was one of many points the place I’m caught to progress additional. Hope somebody will help.

Thanks!