Saturday, October 8, 2022
HomeWordPress Developmentposts - Working Bootstrap Carousel Conversion to WP - Technical Questions

posts – 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 here is what I’m attempting to do:

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

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

<?php if(have_posts()) {
          ?>
            <div class="carousel-inner" function="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 examine to solely embody these posts which has a featured thumbnail connected to point out 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, akin to $postNumber to provoke it at 1 and for the whereas loop, examine 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 would not fairly work appropriately. 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 nevertheless it neither strikes routinely however solely on clicking again arrow, it strikes as soon as.

One other challenge, is the right way 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 realized a variety of totally different factor from utilizing shortcodes, to child-themes and utilizing Choices API together with a lot of 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!

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments