Slider added
This commit is contained in:
parent
4a6b9c8446
commit
63435ce27d
9 changed files with 123 additions and 10 deletions
|
|
@ -4,13 +4,17 @@ _hidden: no
|
||||||
---
|
---
|
||||||
title: Video Conference Call
|
title: Video Conference Call
|
||||||
---
|
---
|
||||||
subtitle: Free, Open Source and sustainable Video Conference
|
subtitle:
|
||||||
|
|
||||||
|
Free, Open Source and sustainable Video Conference
|
||||||
---
|
---
|
||||||
image: /u/image/cards/videoconf.jpg
|
image: /u/image/cards/videoconf.jpg
|
||||||
---
|
---
|
||||||
headline1: Secure & Free
|
headline1: Secure & Free
|
||||||
---
|
---
|
||||||
headline2: Video Conference
|
headline2:
|
||||||
|
|
||||||
|
Video Conference
|
||||||
---
|
---
|
||||||
header_background_color: #095fce
|
header_background_color: #095fce
|
||||||
---
|
---
|
||||||
|
|
@ -36,3 +40,29 @@ Use our free video conference to call the ones you need to talk to. Wherever you
|
||||||
---
|
---
|
||||||
content1_image: /u/image/jitsi-ungleich.jpg
|
content1_image: /u/image/jitsi-ungleich.jpg
|
||||||
---
|
---
|
||||||
|
slide:
|
||||||
|
|
||||||
|
#### slide ####
|
||||||
|
title: Online Video Conferencing
|
||||||
|
----
|
||||||
|
description: We would provide you excellent open source tools that would help you get started with online video conferencing
|
||||||
|
----
|
||||||
|
button_text: Click Me
|
||||||
|
----
|
||||||
|
button_link: https://www.google.com
|
||||||
|
----
|
||||||
|
background_image:
|
||||||
|
----
|
||||||
|
video_mp4: video-chat.mp4
|
||||||
|
#### slide ####
|
||||||
|
title: Online Video Conferencing For Education
|
||||||
|
----
|
||||||
|
description: Whether, you are a Student or a Teacher, with our remote video conferencing you can collaborate easily
|
||||||
|
----
|
||||||
|
button_text: Click Me
|
||||||
|
----
|
||||||
|
button_link: http://www.google.com
|
||||||
|
----
|
||||||
|
background_image: video-call.jpg
|
||||||
|
----
|
||||||
|
video_mp4:
|
||||||
|
|
|
||||||
BIN
content/u/products/video-conference/video-call.jpg
Normal file
BIN
content/u/products/video-conference/video-call.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 288 KiB |
BIN
content/u/products/video-conference/video-chat.mp4
Normal file
BIN
content/u/products/video-conference/video-chat.mp4
Normal file
Binary file not shown.
27
flowblocks/slide.ini
Normal file
27
flowblocks/slide.ini
Normal file
|
|
@ -0,0 +1,27 @@
|
||||||
|
[block]
|
||||||
|
name = Slide
|
||||||
|
button_label = Slide
|
||||||
|
|
||||||
|
[fields.title]
|
||||||
|
label = Title
|
||||||
|
type = string
|
||||||
|
|
||||||
|
[fields.description]
|
||||||
|
label = Description
|
||||||
|
type = string
|
||||||
|
|
||||||
|
[fields.button_text]
|
||||||
|
label = Button Text
|
||||||
|
type = string
|
||||||
|
|
||||||
|
[fields.button_link]
|
||||||
|
label = Button Link
|
||||||
|
type = url
|
||||||
|
|
||||||
|
[fields.background_image]
|
||||||
|
label = Background Image
|
||||||
|
type = text
|
||||||
|
|
||||||
|
[fields.video_mp4]
|
||||||
|
label = Video MP4
|
||||||
|
type = text
|
||||||
|
|
@ -18,6 +18,3 @@ type = markdown
|
||||||
label = Image
|
label = Image
|
||||||
type = url
|
type = url
|
||||||
|
|
||||||
[fields.slider]
|
|
||||||
type = flow
|
|
||||||
flow_blocks = slider
|
|
||||||
|
|
|
||||||
|
|
@ -181,3 +181,7 @@ type = url
|
||||||
[fields.image]
|
[fields.image]
|
||||||
label = Index Image
|
label = Index Image
|
||||||
type = url
|
type = url
|
||||||
|
|
||||||
|
[fields.slide]
|
||||||
|
type = flow
|
||||||
|
flow_blocks = slide
|
||||||
21
templates/blocks/slide.html
Normal file
21
templates/blocks/slide.html
Normal file
|
|
@ -0,0 +1,21 @@
|
||||||
|
<!-- active -->
|
||||||
|
<div class="carousel-item">
|
||||||
|
{% if this.video_mp4 %}
|
||||||
|
<video autoplay muted loop>
|
||||||
|
<source src="{{ this.video_mp4 }}" type="video/mp4">
|
||||||
|
</video>
|
||||||
|
{% elif this.background_image %}
|
||||||
|
<img src="{{ this.background_image }}" class="d-block w-100" alt="...">
|
||||||
|
{% endif %}
|
||||||
|
<div class="carousel-caption d-none d-md-block">
|
||||||
|
<h3 class="display-4">{{ this.title }}</h5>
|
||||||
|
<p class="lead">
|
||||||
|
{{ this.description }}
|
||||||
|
<br>
|
||||||
|
<a href="{{ this.button_link }}" class="btn btn-primary btn-lg" role="button" aria-pressed="true">
|
||||||
|
{{ this.button_text }}
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
@ -1,3 +0,0 @@
|
||||||
<div class="text-block text-block-{{ this.class }}">
|
|
||||||
{{ this.text }}
|
|
||||||
</div>
|
|
||||||
|
|
@ -41,6 +41,18 @@
|
||||||
</script>
|
</script>
|
||||||
<!-- End Google Analytics -->
|
<!-- End Google Analytics -->
|
||||||
|
|
||||||
|
<style>
|
||||||
|
video{
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel-caption {
|
||||||
|
right: 5%;
|
||||||
|
text-align: right;
|
||||||
|
left: auto;
|
||||||
|
padding:5px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{% if this.header_background_color %}
|
{% if this.header_background_color %}
|
||||||
|
|
@ -105,7 +117,29 @@
|
||||||
Else default to boxed title + subtitle
|
Else default to boxed title + subtitle
|
||||||
#}
|
#}
|
||||||
|
|
||||||
{% if this.headline1 or this.headline2 or this.headline3 %}
|
{% if this.slide %}
|
||||||
|
<!-- Start of Slider -->
|
||||||
|
<div id="head-carousel" class="carousel slide" data-ride="carousel">
|
||||||
|
<ol class="carousel-indicators">
|
||||||
|
<li data-target="#head-carousel" data-slide-to="0" class="active"></li>
|
||||||
|
<li data-target="#head-carousel" data-slide-to="1"></li>
|
||||||
|
<!-- <li data-target="#head-carousel" data-slide-to="2"></li> -->
|
||||||
|
</ol>
|
||||||
|
<div class="carousel-inner">
|
||||||
|
{{ this.slide }}
|
||||||
|
</div>
|
||||||
|
<a class="carousel-control-prev" href="#head-carousel" role="button" data-slide="prev">
|
||||||
|
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||||
|
<span class="sr-only">Previous</span>
|
||||||
|
</a>
|
||||||
|
<a class="carousel-control-next" href="#head-carousel" role="button" data-slide="next">
|
||||||
|
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||||
|
<span class="sr-only">Next</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<!-- End of Slider-->
|
||||||
|
|
||||||
|
{% elif this.headline1 or this.headline2 or this.headline3 %}
|
||||||
<div class="jumbotron jumbotron-fluid" style="background-color: {{this.header_background_color}};">
|
<div class="jumbotron jumbotron-fluid" style="background-color: {{this.header_background_color}};">
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<h1 class="display-1 generic-header {{this.header_text_color}}" style="font-weight: bolder;">
|
<h1 class="display-1 generic-header {{this.header_text_color}}" style="font-weight: bolder;">
|
||||||
|
|
@ -154,5 +188,8 @@
|
||||||
src="/u/static/popper.js-1.16.0/dist/esm/popper.min.js"></script>
|
src="/u/static/popper.js-1.16.0/dist/esm/popper.min.js"></script>
|
||||||
<script type="text/javascript"
|
<script type="text/javascript"
|
||||||
src="/u/static/bootstrap-4.4.1-dist/js/bootstrap.min.js"></script>
|
src="/u/static/bootstrap-4.4.1-dist/js/bootstrap.min.js"></script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$("div.carousel-item")[0].classList += " active";
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue