Hallo, leider habe ich ein Problem mit den Jquery Tabs.
Und zwar habe ich in den Tabs einen Jquery unterstützten Slider und eine Google Maps Karte. Leider werden die Sachen nicht korrekt angezeigt. Die Karte sieht zerhackt aus und die Galerie hat nicht die richtige Größe.
PHP
<div id="tabs"> <ul>
<li><a href="#beschreibung">Beschreibung</a></li>
<li><a href="#fotos">Fotos</a></li>
<li><a href="#karte">Karte</a></li>
<li><a href="#preise">Preise</a></li>
<li><a href="#kalender">Verfügbarkeit</a></li>
<li><a href="#kommentare">Kommentare</a></li>
</ul>
<div id="beschreibung">
<p><?php the_content(); ?></p>
<hr />
<br />
<ul>
<h3>Aufteilung der Unterkunft</h3>
<li><?php the_field('anzahl_zimmer'); ?> Zimmer</li>
<li><?php the_field('anzahl_schlafzimmer'); ?> Schlafzimmer</li>
<li><?php the_field('anzahl_wohnzimmer'); ?> Wohnzimmer</li>
<br />
<hr />
<h3>Aussenbereich</h3>
<p><?php the_field('aussen'); ?></p>
<br />
<hr />
<h3>Küche</h3>
<p><?php the_field('kuchenausstattung'); ?></p>
<br />
<hr />
<h3>Bad</h3>
<p><?php the_field('bad'); ?></p>
<br />
<hr />
<h3>Sonstiges</h3>
<p><?php the_field('sonstiges'); ?></p>
<br />
<hr />
</ul>
</div>
<div id="fotos">
<?php
$image_ids = get_field('bildert', false, false);
$shortcode = '
[gallery ids="' . implode(',', $image_ids) . '"]';
echo do_shortcode( $shortcode );
?>
</div>
<div id="karte">
<?php
$location = get_field('location');
if( !empty($location) ):
?>
<div class="acf-map">
<div class="marker" data-lat="<?php echo $location['lat']; ?>" data-lng="<?php echo $location['lng']; ?>"></div>
</div>
<?php endif; ?>
</div>
<div id="preise">
<?php include("preise.php") ?>
</div>
<div id="kalender">
<?php
$belegung = get_post_meta( $post->ID, 'belegungsplan', $single = true );
if ($belegung)
echo do_shortcode('' . $belegung . '');
?>
</div>
Alles anzeigen
In meiner functions.php steht folgendes:
Code
//Javasript Tabs function my_scripts_method() {
if ( !is_admin() ) {
wp_enqueue_script(
'custom-script',
get_template_directory_uri() . '/js/tabs.js',
array('jquery')
);
wp_enqueue_script('jquery-ui-tabs');
}
}
add_action('wp_enqueue_scripts', 'my_scripts_method');
Alles anzeigen
Die Inhalte werden mittels Advanced Custom post types erstellt. und die Galerie wird mit einem Royal Slider betrieben.