How to add image carousel to any blogger website?


How to add image carousel to any blogger website?

In this article, I am going to tell you how you can add an image carousel to any blogger website. This process is very easy. So, just follow the steps I have told below and you can add them to your website.

First of all, there is no option in blogger to add an image carousel. You have to use another trick to add the image carousel to your website. 

What is an image carousel?

An image carousel is a type of rotating banners of the slideshow. You can add up to 5 images and it can also consist of text. The images in the carousel can also repeat in intervals.

Steps to add carousel to your blogger website:

1. I will use the bootstrap framework to add a carousel to your website. First, add this CSS and javascript to your blogger website. Just head to your blogger dashboard then click on a theme. You must also keep a backup of the theme. After clicking theme, click the three dots then click on edit HTML. Copy the CSS and js script from down then paste it on the <head> section of your website. After pasting it click on save.

CSS

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-wEmeIV1mKuiNpC+IOBjI7aAzPcEZeedi5yW5f2yOq55WWLwNGmvvx4Um1vskeMj0" crossorigin="anonymous">

Java script

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-p34f1UUtsS3wqzfto5wAAmdvj+osOnFyQFpp4Ua3gs/ZVWx6oOypYoCJhGGScy+8" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.min.js" integrity="sha384-lpyLfhYuitXl2zRZ5Bn2fqnhNAKOAaM/0Kr9laMspuaMiZfGmfwRNFh8HlMy49eQ" crossorigin="anonymous"></script>


2. After you complete the above step go to the layout option of your blogger dashboard. Click on add a widget option and select custom HTML/js option. After that paste the following code:

<div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Next</span>
  </button>
</div>

3. In place of  "..." Paste the link of your image. Then it is done. Congratulations you have successfully added the custom carousal to your blogger website.

        Thank you for reading this article. I hope this article will help you.

Comments

Post a Comment

Popular posts from this blog

Jardinains 2 game cheats

Image
Jardinians 2 game cheats Hi there , this is Bigsan, In this article,  I  am going to tell you about the cheats of Jardins 2 game. This is a very interesting block breaking game. This is also one of the most popular block breaking game. There are two versions of this game. Jardians 1 and Jardians 2 .  Today we are going to discuss how you can enable cheats in jardians 2 game. I will write the steps and I will also give the pictures so the you can understand better.  Steps to enable Cheats in Jardinians 2 game: 1. Download the game by clicking the download  . 2.This will download a zip file. Now,  extract the zip file. In the zip file you will find the game exe, cheats.txt. 3. First of all,  install the game by double clicking on it. Don't run the game.  4.Now open the cheats.txt and read it. You will find that if you press the 'C' key on your keyboard the cheats will be activated. Also,  remember the key's to enable fire ball, lightning ball e...
Read more

In which episode of Pokemon XYZ Froggy evolve into greninja?

Image
In Pokemon  xyz season 19 Episode 7 frogadier evolve into greninja In the kalaos region. It is a adventure of pokemon. The main character of this xyz series is ash. You will also get to see many kinds of pokemon. You can also play a game named Pokemon x and y with citra emulator.  You can download this game from pokemoner.com And also in my website.You can see his friends serena, bony, clemont gym leader of lumious city.Ash and greninja get stronger with each other and greninja evolve into ashgreninja.Pokemon kalaos region adventure is divided into three seasons and they are pokemon xy,pokemon kalaos quest, Pokemon xyz.Ash catches many Pokemon and his teammates are Pikachu,  Greninja,Talonflame,Hawlucha,Noivern,Goodra.You Can see all episodes of Pokemon in this websites raretoonindia , deadtoonindia , toonkiduniya , puretoon , toonworld4all .
Read more

5 best websites to download games in 2021

Image
You must have real in the title that I will tell you 5 websites to download games. So through this article, I will tell you about this. One of the websites which I have told is a  software downloading website. 1. Ocean of games The first website which I suggest downloading games is an ocean of games. All the games you download from this website are in the crack version. If you want to download high-level games means of higher GB then you can download from this website. All the latest games are available on this website. There are many duplicates of the ocean of games so choose the official website. Just click on the ocean of game and you will go to the website. You can download the latest games like Call of Duty Need for Speed heat and many more games. 2.Downloadpcgames88 The second website which I suggest in a downloading game download games 88. the games downloaded from this website are also in the crack version. Through this website, you can also download the latest games. Sea...
Read more