First attempt to services section

- base.py: add settings to load GlasfaserServicesPlugin by default
    - glasfaser_cms_page.html: create a placeholder for services
    - cms_plugins.py: add the plugin code
    - models.py: add UngelichTextSectionWithImage model

dynamicweb/settings/base.py

@@ -321,6 +321,15 @@ CMS_PLACEHOLDER_CONF = {
             },
         ]
     },
+    'glasfaser_services': {
+        'name': "Services",
+        'plugins': ['GlasfaserServicesPlugin'],
+        'default_plugins': [
+            {
+                'plugin_type': 'GlasfaserServicesPlugin',
+            },
+        ]
+    },
 }
 
 CACHES = {

ungleich_page/cms_plugins.py

@@ -2,7 +2,8 @@ from cms.plugin_base import CMSPluginBase
 from cms.plugin_pool import plugin_pool
 
 from .models import (
-    UngelichPicture, UngelichContactUsSection, UngelichTextSection
+    UngelichPicture, UngelichContactUsSection, UngelichTextSection,
+    UngelichTextSectionWithImage
 )
 
 
@@ -40,3 +41,18 @@ class SectionTextParagraphGlasfaser(CMSPluginBase):
     model = UngelichTextSection
     render_template = "ungleich_page/glasfaser/section_text_glasfaser.html"
     cache = False
+
+
+@plugin_pool.register_plugin
+class GlasfaserServicesPlugin(CMSPluginBase):
+    model = UngelichTextSectionWithImage
+    render_template = "ungleich_page/glasfaser/section_services.html"
+    cache = False
+
+    def render(self, context, instance, placeholder):
+        context.update({
+            'image': instance.image,
+            'object': instance,
+            'placeholder': placeholder
+        })
+        return context

ungleich_page/models.py

@@ -21,3 +21,12 @@ class UngelichContactUsSection(CMSPlugin):
 class UngelichTextSection(CMSPlugin):
     title = models.CharField(max_length=200)
     description = HTMLField()
+
+
+class UngelichTextSectionWithImage(UngelichTextSection):
+    image = FilerImageField(
+        null=True,
+        blank=True,
+        related_name="utswi_image",
+        on_delete=models.SET_NULL
+    )

ungleich_page/templates/ungleich_page/glasfaser_cms_page.html

@@ -80,48 +80,7 @@
 
    {% placeholder 'Middle Section' %}
 
-
+   {% placeholder 'Glasfaser Services' %}
-
-    <section id="services">
-      <div class="container">
-        <div class="text-center wow fadeInDown">
-          <h2 class="section-heading">Technische Details</h2>
-          <h3 class="section-subheading text-muted">Im Angebot enthalten sind</h3>
-        </div>
-        <div class="row text-center">
-          <div class="col-sm-4">
-            <div class="team-member wow fadeInUp" data-wow-delay="0.25s">
-              <img src="{% static 'ungleich_page/img/glasfaser/business.svg' %}" class="img-responsive img-circle" alt="">
-              <div class="team-member-caption inline-block">
-                <h4 class="portfolio-caption">Business-Internet</h4>
-                <p class="text-muted">Symmetrische Internetleitung 100 Mbit/s upload und 100 Mbit/s download</p>
-                <p class="text-muted">Glasfaser-Installation bis ins Haus (keine Hausverkabelung)</p>
-              </div>
-            </div>
-          </div>
-          <div class="col-sm-4">
-            <div class="team-member wow fadeInUp" data-wow-delay="0.5s">
-              <img src="{% static 'ungleich_page/img/glasfaser/ip.svg' %}" class="img-responsive img-circle" alt="">
-              <div class="team-member-caption inline-block">
-                <h4 class="portfolio-caption">Erreichbarkeit im Internet</h4>
-                <p class="text-muted">1 öffentliches IPv6-Netzwerk (/64)</p>
-                <p class="text-muted">1 öffentliche IPv4-Adresse</p>
-              </div>
-            </div>
-          </div>
-          <div class="col-sm-4">
-            <div class="team-member wow fadeInUp" data-wow-delay="0.75s">
-              <img src="{% static 'ungleich_page/img/glasfaser/switch.svg' %}" class="img-responsive img-circle" alt="">
-              <div class="team-member-caption inline-block">
-                <h4 class="portfolio-caption">Einfach zu nutzen</h4>
-                <p class="text-muted">2 vorkonfigurierte Endgeräte (benötigt zwei Steckdosen auf Ihrer Seite)</p>
-                <p class="text-muted">Einfach einstecken und los!</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </section>
 
     <!-- About Section -->
     <section id="about">