1  <?php get_header(); ?>
 2  
 3  <main>
 4      <img class="w-full object-cover" alt="Fassade von Bibliothek Schmerikon" style="height: 660px;" src="<?php echo get_the_post_thumbnail_url(); ?>">
 5      <div class="mx-auto max-w-7xl py-8 px-4 xl:px-0 ">
 6          <div>
 7              <div class="flex flex-row justify-between items-center pb-4">
 8                  <h2 class=" text-lg font-semibold">Neuheiten</h2>
 9                  <p class="text-sm font-semibold hover:underline"><a href="/neuheiten">Alle Neuheiten</a></p>
10              </div>
11              <div class="flex flex-row flex-wrap items-center gap-8">
12                  <?php
13                  $events = new WP_Query(array(
14                      "posts_per_page" => 4,
15                      "post_type" => "neuheit",
16                      "order" => "ASC",
17                      "orderby" => "menu_order"
18                  ));
19                  while ($events->have_posts()) {
20                      $events->the_post(); ?>
21                      <div class="w-full sm:w-72">
22                          <img class="object-contain h-80 w-full" src="<?php echo get_the_post_thumbnail_url(); ?>">
23                          <p class="text-nowrap pt-2 font-semibold"><?php the_title(); ?></p>
24                          <p class="text-nowrap pt-1 overflow-hidden text-ellipsis"><?php echo wp_trim_words(get_the_content(), 7); ?></p>
25                          <p class="pt-4 text-slate-500"><a class="hover:underline" href="<?php the_permalink(); ?>">mehr -></a></p>
26                      </div>
27                  <?php } ?>
28              </div>
29          </div>
30      </div>
31      <div class="bg-slate-200 px-4 xl:px-0">
32          <?php wp_reset_postdata(); ?>
33          <div class="prose max-w-7xl pb-4 w-full mx-auto">
34              <?php the_content(); ?>
35          </div>
36      </div>
37      <div class="mx-auto max-w-7xl py-8 px-4 pb-16 xl:px-0 ">
38          <div class="flex flex-row justify-between items-center pb-4">
39              <h2 class=" text-lg font-semibold">Veranstaltungen</h2>
40              <p class="text-sm font-semibold hover:underline"><a href="/events">Alle Veranstaltungen</a></p>
41          </div>
42          <div class="flex flex-row flex-wrap items-center gap-8">
43              <?php
44              $events = new WP_Query(array(
45                  "posts_per_page" => 4,
46                  "post_type" => "event",
47                  "order" => "ASC",
48                  "orderby" => "menu_order"
49              ));
50              while ($events->have_posts()) {
51                  $events->the_post(); ?>
52                  <div class="w-full sm:w-72">
53                      <img class="object-contain h-80 w-full" src="<?php echo get_the_post_thumbnail_url(); ?>">
54                      <p class="text-nowrap pt-2 font-semibold"><?php the_title(); ?></p>
55                      <p class="text-nowrap pt-1 overflow-hidden text-ellipsis"><?php echo wp_trim_words(get_field("event_description"), 7); ?></p>
56                      <p class="pt-4 text-slate-500"><a class="hover:underline" href="<?php the_permalink(); ?>">mehr -></a></p>
57                  </div>
58              <?php } ?>
59          </div>
60      </div>
61      </div>
62  </main>
63  
64  <?php get_footer(); ?>