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
|
||||
---
|
||||
subtitle: Free, Open Source and sustainable Video Conference
|
||||
subtitle:
|
||||
|
||||
Free, Open Source and sustainable Video Conference
|
||||
---
|
||||
image: /u/image/cards/videoconf.jpg
|
||||
---
|
||||
headline1: Secure & Free
|
||||
---
|
||||
headline2: Video Conference
|
||||
headline2:
|
||||
|
||||
Video Conference
|
||||
---
|
||||
header_background_color: #095fce
|
||||
---
|
||||
|
@ -35,4 +39,30 @@ Use our free video conference to call the ones you need to talk to. Wherever you
|
|||
|
||||
---
|
||||
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
|
||||
type = url
|
||||
|
||||
[fields.slider]
|
||||
type = flow
|
||||
flow_blocks = slider
|
||||
|
|
|
@ -181,3 +181,7 @@ type = url
|
|||
[fields.image]
|
||||
label = Index Image
|
||||
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>
|
||||
<!-- End Google Analytics -->
|
||||
|
||||
<style>
|
||||
video{
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.carousel-caption {
|
||||
right: 5%;
|
||||
text-align: right;
|
||||
left: auto;
|
||||
padding:5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
{% if this.header_background_color %}
|
||||
|
@ -104,8 +116,30 @@
|
|||
If headline1/2/3 given, take the headline.
|
||||
Else default to boxed title + subtitle
|
||||
#}
|
||||
|
||||
{% 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-->
|
||||
|
||||
{% if this.headline1 or this.headline2 or this.headline3 %}
|
||||
{% elif this.headline1 or this.headline2 or this.headline3 %}
|
||||
<div class="jumbotron jumbotron-fluid" style="background-color: {{this.header_background_color}};">
|
||||
<div class="container-fluid">
|
||||
<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>
|
||||
<script type="text/javascript"
|
||||
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>
|
||||
</html>
|
||||
|
|
Loading…
Reference in a new issue