Video/Image Slider Help Plz
I'm trying to apply the Video / Image Slider to the home page, but I couldn't get one type of question. It did not happen like in KingFire Theme, I would be glad if you help me.
This is the code we want to implement
<html>
<head>
<title>{$mybb->settings['bbname']}</title>
{$headerinclude}
<script type="text/javascript">
<!--
lang.no_new_posts = "{$lang->no_new_posts}";
lang.click_mark_read = "{$lang->click_mark_read}";
// -->
</script>
</head>
<body id="index">
{$header}
<div class="headCustomADS">
<div class="aLinks">
<div class="aLinks_title">Forum Duyuruları</div>
<ul>
<li><a href="/" rel="nofollow" target="_self">Forum Kuralları ! Herkes Okundu Sayılacak !</a></li>
<li><a href="/" rel="nofollow" target="_self">Moderatör Olmak İsteyenler, İstekler Buradan.</a></li>
<li><a href="/" rel="nofollow" target="_self">İşini İyi Yapmayan Yetkilileri Buradan Bildirebilirsiniz.</a></li>
<li><a href="/" rel="nofollow" target="_self">Kişisel Rütbe Değiştirmek İsteyenler, İstekler Buradan.</a></li>
</ul>
</div>
<div class="aServers">
<div class="aLinks_title">Advertising Zone</div>
<ul>
<li>
<a href="#" target="_blank" rel="nofollow"><img src="images/wk/reklam.gif" alt="reklam ver"/></a>
</li>
</ul>
</div>
</div>
{$forums}
{$boardstats}
{$footer}
</body>
</html>This is the code we want to implement
Video/Image Slider is located within these lines of codes on Index Page Template:
<!-- BEGIN Slider -->
<div class="panel panel-primary">
<div class="thead">
<div class="panel-title">
<span class="white">Video/Image Slider</span>
<a class="col-lg-2 accordion-toggle no-padding pull-right" data-toggle="collapse" href="#cat_{$forum['fid']}"></a> <br />
</div>
</div>
<div id="cat_" class="panel-collapse collapse in" style="background: transparent;">
<div class="panel-body no-padding">
<div id="slider" style="margin-top: -20px;">
<div class="slides">
<div id="myCarousel" class="carousel slide" data-ride="carousel" style="padding-bottom:15px;padding-top:15px;">
<!-- Carousel indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
<li data-target="#myCarousel" data-slide-to="4"></li>
<li data-target="#myCarousel" data-slide-to="5"></li>
</ol>
<!-- Wrapper for carousel items -->
<div class="carousel-inner">
<div class="item active">
<iframe class="embed-responsive-item play-1" width="832" height="262" src="https://www.youtube.com/embed/sEcDmU5DQek"></iframe>
</div>
<div class="item">
<iframe class="embed-responsive-item play-1" width="832" height="262" src="https://www.youtube.com/embed/Bx4tO-ptmuQ"></iframe>
</div>
<div class="item">
<iframe class="embed-responsive-item play-1" width="832" height="262" src="https://www.youtube.com/embed/Quc7__iZAbQ"></iframe>
</div>
<div class="item">
<a target="_blank" href="#"><img src="{$theme['imgdir']}/slide-1.jpg"></a>
</div>
<div class="item">
<a target="_blank" href="#"><img src="{$theme['imgdir']}/slide-2.jpg"></a>
</div>
<div class="item">
<a target="_blank" href="#"><img src="{$theme['imgdir']}/slide-3.jpg"></a>
</div>
</div>
<!-- Carousel controls -->
<a class="carousel-control left" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END Slider -->
Youshould only chnage "iframe" or "<img src="" />" part of the code, depending do you want to have videos or images in your slides.
For Video, just replace src="URL" within <iframe></iframe> tag. Just copy ONLY URL from generated embed code on YouTube.
----------------------------------
Of course, if you want to completely remove Slider, just delete everything within:
<!-- BEGIN Slider -->
...
<!-- END Slider -->