Create Event Process - Himanshu Nanda

Create an event

1. Add Event Title

2. add content (Click "Type/ to choose a block")

3. Click "+" and select or search "Costume HTML"

4. Add different block as per requirement

Blocks

1. Add Heading

<h2 class="text-start">h2. Bootstrap heading</h2>

<h2 class="text-center">h2. Bootstrap heading</h2>

<h2 class="text-end">h2. Bootstrap heading</h2>

2. Add Contents

<p class="text-start">Start aligned text on all viewport sizes.</p>
<p class="text-center">Center aligned text on all viewport sizes.</p>
<p class="text-end">End aligned text on all viewport sizes.</p>

Note: For "Text Left" use 1st link, For "Text Center" use 2nd link, For "Text Right: use 3rd link

3. Add buttons

<a href="#" class="btn btn-primary btn-lg disabled" tabindex="-1" role="button" aria-disabled="true">Primary link</a>

Note:Instead of "#" add Redirection Link and Instead of Primary Link add Button Name

4. Place two container side by side with Border

<div class="row">
  <div class="border col-sm-6">Add Content 1</div> 
  <div class="border col-sm-6">Add Content 2</div>
</div>

4. Place two container side by side without Border

<div class="row">
  <div class="col-sm-6">Add Content 1</div> 
  <div class="col-sm-6">Add Content 2</div>
</div>

5. Place three container side by side with Border

<div class="row">
  <div class="border col-sm-6">Add Content 1</div> 
  <div class="border col-sm-6">Add Content 2</div>
  <div class="border col-sm-6">Add Content 3</div>
</div>

6. Place three container side by side without Border

<div class="row">
  <div class="col-sm-6">Add Content 1</div> 
  <div class="col-sm-6">Add Content 2</div>
  <div class="col-sm-6">Add Content 3</div>
</div>

7. add list inside container

8. Add Testimonial

<!– Carousel wrapper –>
<div id=”carouselMultiItemExample” class=”carousel slide carousel-dark text-center” data-mdb-ride=”carousel”>
<!– Controls –>
<div class=”d-flex justify-content-center mb-4″>
<button class=”carousel-control-prev position-relative” type=”button”
data-mdb-target=”#carouselMultiItemExample” data-mdb-slide=”prev”>
<span class=”carousel-control-prev-icon” aria-hidden=”true”></span>
<span class=”visually-hidden”>Previous</span>
</button>
<button class=”carousel-control-next position-relative” type=”button”
data-mdb-target=”#carouselMultiItemExample” data-mdb-slide=”next”>
<span class=”carousel-control-next-icon” aria-hidden=”true”></span>
<span class=”visually-hidden”>Next</span>
</button>
</div>
<!– Inner –>
<div class=”carousel-inner py-4″>
<!– Single item –>
<div class=”carousel-item active”>
<div class=”container”>
<div class=”row”>
<div class=”col-lg-4″>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(1).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>Anna Deynah</h5>
<p>UX Designer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod eos id
officiis hic tenetur quae quaerat ad velit ab hic tenetur.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
</ul>
</div>

<div class=”col-lg-4 d-none d-lg-block”>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(32).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>John Doe</h5>
<p>Web Developer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis
suscipit laboriosam, nisi ut aliquid commodi.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li>
<i class=”fas fa-star-half-alt fa-sm”></i>
</li>
</ul>
</div>

<div class=”col-lg-4 d-none d-lg-block”>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(10).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>Maria Kate</h5>
<p>Photographer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis
praesentium voluptatum deleniti atque corrupti.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”far fa-star fa-sm”></i></li>
</ul>
</div>
</div>
</div>
</div>

<!– Single item –>
<div class=”carousel-item”>
<div class=”container”>
<div class=”row”>
<div class=”col-lg-4″>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(3).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>John Doe</h5>
<p>UX Designer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod eos id
officiis hic tenetur quae quaerat ad velit ab hic tenetur.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
</ul>
</div>

<div class=”col-lg-4 d-none d-lg-block”>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(4).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>Alex Rey</h5>
<p>Web Developer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis
suscipit laboriosam, nisi ut aliquid commodi.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li>
<i class=”fas fa-star-half-alt fa-sm”></i>
</li>
</ul>
</div>

<div class=”col-lg-4 d-none d-lg-block”>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(5).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>Maria Kate</h5>
<p>Photographer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis
praesentium voluptatum deleniti atque corrupti.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”far fa-star fa-sm”></i></li>
</ul>
</div>
</div>
</div>
</div>

<!– Single item –>
<div class=”carousel-item”>
<div class=”container”>
<div class=”row”>
<div class=”col-lg-4″>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(6).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>Anna Deynah</h5>
<p>UX Designer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod eos id
officiis hic tenetur quae quaerat ad velit ab hic tenetur.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
</ul>
</div>

<div class=”col-lg-4 d-none d-lg-block”>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(8).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>John Doe</h5>
<p>Web Developer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis
suscipit laboriosam, nisi ut aliquid commodi.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li>
<i class=”fas fa-star-half-alt fa-sm”></i>
</li>
</ul>
</div>

<div class=”col-lg-4 d-none d-lg-block”>
<img class=”rounded-circle shadow-1-strong mb-4″
src=”https://mdbcdn.b-cdn.net/img/Photos/Avatars/img%20(7).webp” alt=”avatar”
style=”width: 150px;” />
<h5 class=”mb-3″>Maria Kate</h5>
<p>Photographer</p>
<p class=”text-muted”>
<i class=”fas fa-quote-left pe-2″></i>
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis
praesentium voluptatum deleniti atque corrupti.
</p>
<ul class=”list-unstyled d-flex justify-content-center text-warning mb-0″>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”fas fa-star fa-sm”></i></li>
<li><i class=”far fa-star fa-sm”></i></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!– Inner –>
</div>
<!– Carousel wrapper –>