I need a slider working inside a loop for that I am using the below code
while ( have_posts() ) : the_post(); ?>
<div id="content">
<?php
$attachments = get_children( array(
'post_parent' => $post->ID,
'post_type' => 'attachment',
'order' => '',
'post_mime_type' => 'image')
);
echo "aaaaa".count($attachments);
?>
<?php if(count($attachments)!=0){ ?>
<div id="portfolio-gallery">
<ul id="slideshow_detail">
<?php
foreach ( $attachments as $att_id => $attachment ) {
$getimage = wp_get_attachment_image_src($att_id, 'room-gallery', true);
$roomimage = $getimage[0];
echo '<li>
<h3></h3>
<span>'.$roomimage.'</span>
<p></p>
<img src="'.$roomimage.'" alt="" class="thumb-slide" />
</li>';
}
?>
</ul>
<div id="wrapper1">
<div id="fullsize">
<div id="imgprev" class="imgnav" title="Previous Image"></div>
<div id="imglink"></div>
<div id="imgnext" class="imgnav" title="Next Image"></div>
<div id="image"></div>
<div id="information">
<h3></h3>
<p></p>
</div>
</div>
<div id="thumbnails">
<div id="slideleft" title="Slide Left"></div>
<div id="slidearea">
<div id="slider-room"></div>
</div>
<div id="slideright" title="Slide Right"></div>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
<!--
$('slideshow_detail').style.display='none';
$('wrapper1').style.display='block';
var slideshow_detail=new TINY.slideshow_detail("slideshow_detail");
window.onload=function(){
slideshow_detail.auto=true;
slideshow_detail.speed=5;
slideshow_detail.link="linkhover";
slideshow_detail.info="information";
slideshow_detail.thumbs="slider-room";
slideshow_detail.left="slideleft";
slideshow_detail.right="slideright";
slideshow_detail.scrollSpeed=4;
slideshow_detail.spacing=25;
slideshow_detail.active="#fff";
slideshow_detail.init("slideshow_detail","image","imgprev","imgnext","imglink");
}
//-->
</script>
</div>
<?php endwhile;?>
By using this code slider is working only once;I need a slider that working under a loop .
ie I have to add multiple post,each post having multiple images .I have to show details of each post and showing images of each post using a slider
I feel maybe the while loop, beginning at the top could be the problem. Why not use an if statement. I'm not familiar with your "while" syntax. I've only ever seen the following:
<?php while( someCondition() ): ?>
//statements in here
<?php endwhile; ?>
Or maybe try an if statement instead:
<?php if ( have_posts() ): ?>
//all slider code here
<?php } else { ?>
//give a 'there are no posts' message
<?php endif; ?>
also what wordpress plugin are you running? Without knowing that, it's a bit difficult to trouble shoot this problem.
Related
I have built a slider using html and css. I want to integrate it into wordpress. My slider works fine. I have added the css and JS code in custom css and JS snippet plugin. While I am placing below php code inside my theme's function.php file. Now the first image gets displayed but others are not. Also slider is kind of messed up.
I hardcoded the html in functions.php file and the slider works fine. Can someone please check my php code below to see what am i doing wrong? (css and JS are working fine. im unable to integrate html in wordpress properly).
Also Im displaying the slider on page by putting below code inside a shortcode which is working.
I am using Custom Post Type UI plugin to get images. I have created 2 posts with featured images. Now im trying to get those two featured images into my slider.
<?php //functions.php file
function mySlider(){
$args = array(
'post_type' => array('mx-slides'),
'post_status' => array('publish'),
'posts_per_page' => array('-1'),
'order' => array('DESC'),
);
$query = new WP_Query( $args );
if($query-> have_posts()){
?>
<!-- Container for the image gallery -->
<div class="container">
<div class="mySlides">
<div class="numbertext">6 / 6</div>
<?php while ( $query->have_posts() ) {
$query->the_post();
$img = the_post_thumbnail();
?>
<?php For($i=0;$i<=2;$i++) {
?>
<img src="<?php $img; ?>" style="width:100%;">
<?php } ?>
<?php } ?>
</div>
<!-- Next and previous buttons -->
<a class="prev" onclick="plusSlides(-1)">❮</a>
<a class="next" onclick="plusSlides(1)">❯</a>
<!-- Image text -->
<div class="caption-container">
<p id="caption"></p>
</div>
<!-- Thumbnail images -->
<div class="row">
<?php while ( $query->have_posts() ) {
$query->the_post();
$img = the_post_thumbnail();
?>
<?php // foreach ($img as $imgx)
For($i=0;$i<=5;$i++)
{
?>
<div class="column">
<img class="demo cursor" src="<?php echo $img; ?>" style="width:100%" onclick="currentSlide(1)" alt="No Image">
</div>
<?php } ?>
<?php } ?>
</div>
</div>
<?php
}
wp_reset_postdata();
}
add_shortcode('mx-slider', 'mySlider');
?>
?>
Please check with my fixed $arg. the format of posts_per_page is integer.
<?php //functions.php file
function mySlider() {
$args = array(
'post_type' => 'mx-slides',
'post_status' => 'publish',
'posts_per_page' => -1,
'order' => 'DESC',
);
$query = new WP_Query($args);
if ($query->have_posts()) {
?>
<!-- Container for the image gallery -->
<div class="container">
<div class="mySlides">
<div class="numbertext">6 / 6</div>
<?php while ($query->have_posts()) {
$query->the_post();
$img = get_the_post_thumbnail_url();
?>
<?php for ($i = 0; $i <= 2; $i++) {
?>
<img src="<?php echo $img; ?>" style="width:100%;">
<?php } ?>
<?php } ?>
</div>
<!-- Next and previous buttons -->
<a class="prev" onclick="plusSlides(-1)">❮</a>
<a class="next" onclick="plusSlides(1)">❯</a>
<!-- Image text -->
<div class="caption-container">
<p id="caption"></p>
</div>
<!-- Thumbnail images -->
<div class="row">
<?php while ($query->have_posts()) {
$query->the_post();
$img = get_the_post_thumbnail_url();
?>
<?php // foreach ($img as $imgx)
for ($i = 0; $i <= 5; $i++) {
?>
<div class="column">
<img class="demo cursor" src="<?php echo $img; ?>" style="width:100%" onclick="currentSlide(1)" alt="No Image">
</div>
<?php } ?>
<?php } ?>
</div>
</div>
<?php
}
wp_reset_postdata();
}
add_shortcode('mx-slider', 'mySlider');
I have this website that I'm working on for a client. I jumped into the project and I have to create the accordion on the template file for specific pages. I just started getting deeper into PHP so I found a solution online in this article https://wpbeaches.com/create-an-acf-repeater-accordion-in-wordpress/
Now, my problem is this:
I created the repeater field with two subfields https://prnt.sc/xfg3lv and I choose that it only shows on this page template https://prnt.sc/xfg6lw
Then I created the fields on the actual page with that template https://prnt.sc/xfgdhp and inserted that piece of code from the article into the template file. Of course, I modified the names with my field names. The problem is that on the front it is not showing the rows even if they exist and just skips to the else statement. I will paste the complete code of that template page so if anyone can help it would be awesome. I'm busting my head for two days now on this issue.
The code (I marked where my code starts and ends):
<?php
/**
* Template Name: Services
*
**/
global $post;
$post_slug = $post->post_name;
$grandParent_title=get_page(get_ancestors($post->ID,'page')[0] )->post_title;
$grandParent_Image=wp_get_attachment_url( get_post_thumbnail_id(get_ancestors($post->ID,'page')[0] )) ;
get_header();
global $wp;
$current_slug = add_query_arg( array(), $wp->request );
$url_slug=explode('/', $current_slug);
$uri_string=$url_slug[1];
$_SESSION['current_url']=$uri_string;
function find_string_in_array ($arr, $string) {
return array_filter($arr, function($value) use ($string) {
return strpos($value, $string) !== false;
});
}
if(find_string_in_array ($url_slug, 'poly')==true)
{
$nav_theme_location='polystyrene';
$BannerClass='';
$post_type='polystyrene';
$galleryClass='';
}elseif(find_string_in_array ($url_slug, 'fiber')==true){
$nav_theme_location='fiberglass';
$BannerClass='fiberbanner';
$post_type='fiberglass_type';
$galleryClass='fiber';
}elseif (find_string_in_array ($url_slug, 'wood')==true) {
$nav_theme_location='woodwork';
$BannerClass='woodworkbanner';
$post_type='woodworks';
$galleryClass='wood';
}
elseif (find_string_in_array ($url_slug, 'creative')==true) {
$nav_theme_location='creative_production';
$BannerClass='creativebanner';
$post_type='creative_services';
$galleryClass='creative';
}elseif (find_string_in_array ($url_slug, 'f-and-b')==true) {
$nav_theme_location='fb';
$BannerClass='fandbbanner';
$post_type='creative_services';
$galleryClass='';
}else{
$nav_theme_location='';
$BannerClass='';
$post_type='';
$galleryClass='';
}
?>
<section class="banner inner-banner <?= $BannerClass;?>">
<!-- <div class="bannerBox" style="background-image: url(<?php // echo get_the_post_thumbnail_url())?get_the_post_thumbnail_url():;?>)"> -->
<div class="bannerBox" style="background-image: url(<?= (get_the_post_thumbnail_url()!='')?get_the_post_thumbnail_url():$grandParent_Image;?>)">
<div class="bannerContent">
<div class="overlay"></div>
<h1><?= $grandParent_title;?></h1>
</div>
</div>
</section>
<section class="secondrynavigation">
<div class="container">
<div class="innerMenu">
<?php
$args=array(
'theme_location'=>$nav_theme_location,
'container' =>false,
'menu_class' =>'',
);
wp_nav_menu($args);
?>
</div>
</div>
</section>
<section class="pad">
<div class="container-fluid">
<div class="innerHeading">
<h3><?php the_title();?></h3>
<p><?php
$content_post = get_post($post->ID);
echo $content = $content_post->post_content;?></p>
</div>
</div>
<div class="gallery <?= $galleryClass?>">
<div class="container">
<div class="row">
<?php
// echo $post_type;exit;
$loops = new WP_Query(array('posts_per_page'=> -1,
'post_type' => $post_type,
'orderby' => 'id',
'order' => 'asc',
'category_name'=>$uri_string));
// echo "<pre>";
// print_r($loops);exit;
if($loops->have_posts()):
while ($loops->have_posts()) :
$loops->the_post();
global $post;
$post_slug = $post->post_name;
?>
<div class="col-lg-4">
<a href="<?= get_permalink();?>">
<div class="galleryBox">
<div class="overlay">
<p><i>Read More</i></p>
</div>
<div class="image" style="background-image: url(<?= get_the_post_thumbnail_url();?>)"></div>
<div class="galleryText">
<h5><?php the_title();?></h5>
</div>
</div>
</a>
</div>
<?php endwhile;
endif;?>
</div>
</div>
</div>
</section>
<!--MY CODE-->
<?php
if( have_rows('services_accordion') ):
// loop through the rows of data for the tab header
while ( have_rows('services_accordion') ) : the_row();
// $title = get_sub_field('services_title');
// $description = get_sub_field('servises_description');
?>
<button class="accordion"><?php echo get_field('services_title'); ?></button>
<div class="panel">
<p><?php echo get_field('services_description'); ?></p>
</div>
<?php
endwhile;
else :
echo 'In progress';
endif; ?>
<!--MY CODE END-->
<?php get_footer();?>
In the end this is the result on the page https://prnt.sc/xfh0z7.
Thanks in advance!
Try wrapping your content into:
<?php while (have_posts()) : the_post(); ?>
// all your content related to the post including repeater code.
<?php endwhile; // End of the loop.?>
This way repeater will be in scope of your current post/page. Alternatively you can indicate post id as an argument in the repeater function.
Here's the page template code I'm working with, defined into sections...
<?php
//* Template Name: Partnerships Archive
?>
<!-- Header =========================================== -->
<?php get_header(); ?>
<!-- Homepage Header Video =========================================== -->
<div class="subpage-video-sca">
<!-- VIDEO -->
<div class="subpage-desktop-vid-sca">
<video title="<?php the_field('seo_video_title'); ?>" autoplay loop muted playsinline>
<source src="<?php the_field('vimeo_link'); ?>" type="video/mp4">
</video>
</div>
<!-- GRAD-OVERLAY -->
<div class="subpage-overlay-image-sca">
</div>
<!-- OVERLAID TEXT -->
<div class="subpage-text-over-video-sca">
<div>
<h1><?php the_field('sub_page_title'); ?></h1>
<p><?php the_field('paragraph'); ?></p>
</div>
</div>
</div>
<!-- Breadcrumbs =========================================== -->
<?php echo do_shortcode("[breadcrumbs]"); ?>
<!-- Main Content =========================================== -->
<div class="wrap">
<?php
$args = array(
'post_type' => 'partnerships',
'orderby' => 'title',
'order' => 'ASC'
);
$the_query = new WP_Query( $args );
?>
<?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<a class="one-third partnership-block" href="<?php the_permalink(); ?>">
<img src="<?php the_field('logo'); ?>" alt="<?php the_title();?> graphic">
</a>
<?php $products_count = $the_query->current_post + 1; ?>
<?php if ( $products_count % 4 == 0): ?>
</div><div class="row">
<?php endif; ?>
<?php endwhile; endif; ?>
</div>
<!-- Testimonials =========================================== -->
<div class="wrap">
<div class="page-section-headers pt-testimonials-container txt-right">
<h1>WHAT <span class="red">OUR PARTNERS</span><br>HAVE TO SAY</h1>
</div>
<?php if( have_rows('testimonial') ): ?>
<div class="testimonial-slider-container slick-slider">
<?php while( have_rows('testimonial') ): the_row();
// vars
$text = get_sub_field('testimonial_text');
$client = get_sub_field('client_name');
$company = get_sub_field('client_company');
?>
<div class="testimonial-slider-single">
<p><?php echo $text; ?></p>
<h2><?php echo $client; ?></h2>
<h3><?php echo $company; ?><h3>
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>
</div>
The code in the main content area is pulling through custom post types I have.
The code in the Testimonials area is pulling through data from an ACF Repeater field for this page specifically.
They both work independently but when I have them both on the page at the same time, the testimonials doesn't pull through.
That said, Ive just noticed that when I put the testimonials first and the main content after, they both work!!
Can anyone help? Is there something I haven't closed properly in the Main content or something? I don't get it...
It's wordpress, using Genesis Framework, latest versions of both. The page is here: http://staging.seedcreativeacademy.co.uk/partnerships/
add wp_reset_postdata(),after while :
<div class="wrap">
<?php
$args = array(
'post_type' => 'partnerships',
'orderby' => 'title',
'order' => 'ASC'
);
$the_query = new WP_Query( $args );
?>
<?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<a class="one-third partnership-block" href="<?php the_permalink(); ?>">
<img src="<?php the_field('logo'); ?>" alt="<?php the_title();?> graphic">
</a>
<?php $products_count = $the_query->current_post + 1; ?>
<?php if ( $products_count % 4 == 0): ?>
</div><div class="row">
<?php endif; ?>
<?php endwhile; wp_reset_postdata(); endif; ?>
</div>
I have managed to get recent posts showing on my homepage which is working well. They only problem i have is that the full post and not the excerpt is showing.
<div id="home-news-container">
<?php query_posts('cat=#&posts_per_page=3'); ?>
<?php while (have_posts()) : the_post(); ?>
<div class="home-post-container">
<div class="home-post-thumb">
<a href="<?php echo get_permalink(); ?>">
<?php the_post_thumbnail('large_wide'); ?>
</a>
</div>
<div class="home-post-copy">
<h4>
<a href="<?php echo get_permalink(); ?>">
<?php the_title(); ?>
</a>
</h4>
<h5>
<?php the_date(); ?>
</h5>
<?php echo the_excerpt(); ?>
<div class="home-news-readmore">
read more
</div>
</div>
</div> <!-- end home-post-container -->
<?php endwhile; ?>
<?php wp_reset_query(); ?>
<div class="home-news-readmore news-extra">
more news
</div>
</div> <!--- end home-post-container -->
I don't understand what the problem is to be honest. I created a new full width template for the homepage which i thought might be causing it but its not. Bit stumped to be honest. Any help would be greatly appreciated
Use wp_get_recent_posts to get recent post
Use substr to display some limeted character of post character
<?php
$args = array (
'numberposts' => 3,
'post_type' => 'your post type name'
);
// the query
$recent_posts = new wp_get_recent_posts( $args );
foreach( $recent_posts as $recent ){
echo '<li>' . $recent["post_title"].' </li> ';
echo substr($recent["post_content"],0,100);
}
?>
In a custom WordPress theme, I am using WP_Query to pull custom post type info on the home page. I am storing some data in variables, ending the custom query and loop, resetting the query, and then calling the variables later in the page.
oEmbed is working for the custom post types on the single post pages. On the home page, though, if I include a YouTube link for instance, oEmbed does not work when I get the custom post type content through the variable.
Does storing content in this way bypass oEmbed? I haven't been able to find a specific conversation on this.
You can see the home page template here:
<?php
/*
Template Name: Home
*/
get_header();
?>
<!-- Row for main content area -->
<section id="top">
<div class="row">
<article id="npo-info" class="small-12 small-centered large-6 large-uncentered columns">
<?php // loop for latest weekly NPO to store info for later use
$args = array( 'post_type' => 'weeklyNPO', 'posts_per_page' => 1 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
$NPOtitle = get_the_title();
$NPOcontent = get_the_content();
$NPOexcerpt = get_the_excerpt();
$NPOthumbnail = get_the_post_thumbnail();
$NPOid = get_the_ID();
endwhile;
?>
<header>
<h4>Karmasapien presents</h4>
<h1><?php echo $NPOtitle; ?></h1>
</header>
<section>
<p><?php echo $NPOexcerpt; ?></p>
<hr/>
<label><p>Because Giving Feels Good</p></label>
<?php dynamic_sidebar( 'Donation Progress Bar' ); ?>
<?php the_meta(); ?>
<?php wp_reset_query(); ?>
</section>
<footer>
<em id="ks-clock" src=""></em>
<?php echo do_shortcode( '[fergcorp_cdt max=1]' ); ?>
</footer>
</article>
</div>
</section> <!-- end top -->
...other magical things happen, and then...
<section id="weekly-npo">
<div class="image-bg"></div>
<div class="row">
<article <?php post_class('small-12 small-centered large-10 columns') ?>>
<header>
<h2>More About <?php echo $NPOtitle; ?></h2>
</header>
<section>
<?php echo $NPOcontent; ?>
</section>
<hr/>
<footer class="row">
<div class="small-5 small-centered large-3 columns">
<?php echo $NPOthumbnail; ?>
</div>
</footer>
</article>
</div>
</section>
<?php get_footer(); ?>
Cheers,
Sounds like you have filter/shortcode in the_content, try one of these and I believe the problem will be solved, apply_filters
$NPOcontent = apply_filters('the_content', get_the_content());
Or use do_shortcode
$NPOcontent = do_shortcode(get_the_content());