I'm using the code below to display an Owl Carousel of pages that have the same parent page as the current page, it works but the first item in the loop is blank.
Any Ideas? Thanks
<?php
// [service_page_carousel]
function service_page_carousel_func() {
global $post;
$direct_parent = $post->post_parent;
$args = array(
'post_type' => 'page',
'posts_per_page' => -1,
'post_parent' => $direct_parent,
'order' => 'ASC',
'orderby' => 'menu_order',
'post__not_in' => array( $post->ID ),
);
$query = new WP_Query( $args );
if ( $query->have_posts() ) : ?>
<div class="service-page-owl-carousel owl-carousel owl-theme owl-loaded owl-drag">
<?php while ( $query->have_posts() ) : $query->the_post();
// Featured image
$feat_image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), "full", true);
?>
<div class="item">
<div class="service">
<a href="<?php the_permalink(); ?>">
<div class="featured-img" style="background-image: url(<?php echo $feat_image[0]; ?>);"></div>
</a>
<a href="<?php the_permalink(); ?>">
<h3 class="brand-secondary"><?php the_title(); ?></h3>
</a>
<div class="text"><?php the_excerpt(); ?></div>
<p class="learn-more"><a class="btn primary" href="<?php the_permalink(); ?>">Learn More</a></p>
</div>
</div>
<?php endwhile; wp_reset_query(); ?>
</div>
<?php endif;
}
add_shortcode( 'service_page_carousel', 'service_page_carousel_func' );
i think you missed to add active class if only one page/post in owl carousel
<?php
// [service_page_carousel]
function service_page_carousel_func() {
global $post;
$direct_parent = $post->post_parent;
$args = array(
'post_type' => 'page',
'posts_per_page' => -1,
'post_parent' => $direct_parent,
'order' => 'ASC',
'orderby' => 'menu_order',
'post__not_in' => array( $post->ID ),
);
$query = new WP_Query( $args );
if ( $query->have_posts() ) : ?>
<div class="service-page-owl-carousel owl-carousel owl-theme owl-loaded owl-drag">
<?php
$index = 0;
while ( $query->have_posts() ) : $query->the_post();
// Featured image
$feat_image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), "full", true);
?>
<div class="item <?php echo ($index == 0) ? 'active' : ''; ?>">
<div class="service">
<a href="<?php the_permalink(); ?>">
<div class="featured-img" style="background-image: url(<?php echo $feat_image[0]; ?>);"></div>
</a>
<a href="<?php the_permalink(); ?>">
<h3 class="brand-secondary"><?php the_title(); ?></h3>
</a>
<div class="text"><?php the_excerpt(); ?></div>
<p class="learn-more"><a class="btn primary" href="<?php the_permalink(); ?>">Learn More</a></p>
</div>
</div>
<?php endwhile;
$index++;
wp_reset_query(); ?>
</div>
<?php endif;
}
add_shortcode( 'service_page_carousel', 'service_page_carousel_func' );
Related
<?php
$args = array(
'post_type' => 'post',
'post_status' => 'publish',
'order' => 'DESC' ,
'cat' => '3',
);
$arr_posts = new WP_Query( $args );
if ( $arr_posts->have_posts() ) :
while ( $arr_posts->have_posts() ) :
$arr_posts->the_post();
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<a class="post-thumbnail" style="width: 250px;height: 147px;">
<?php
$attimages = get_attached_media('image', $post->ID);
foreach ($attimages as $image) {
?>
<img src="<?php echo wp_get_attachment_url($image->ID);?>" > <?php
}
?> </a>
<div class="entry-header">
<h3 class="entry-title"><a target="_self" href=<?php the_permalink(); ?>><?php the_title(); ?></a></h3></br>
<div class="entry-content">
<?php the_excerpt(); ?>
<a href="<?php the_permalink();
?>">Read More</a>
</div>
</div>
</li>
</br></ul>
</article>
<?php
endwhile;
I am trying to display all post from category 3 to a particular page.
I am getting the title and excerpt correctly.But I am not getting the image correctly.
I first Used :
the_post_thumbnail();
But it didnt worked.
Then I used
$attimages = get_attached_media('image', $post->ID);
Then For I post,I got image so I printed $attimages and found empty array.
Any help
<?php
$args = array(
'post_type' => 'post',
'post_status' => 'publish',
'order' => 'DESC' ,
'cat' => '3',
);
$arr_posts = new WP_Query( $args );
if ( $arr_posts->have_posts() ) :
while ( $arr_posts->have_posts() ) :
$arr_posts->the_post();
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<a class="post-thumbnail" style="width: 250px;height: 147px;">
<?php $attimages = get_attached_media('image', $post->ID);
foreach ($attimages as $image) { ?>
<img src="<?php echo wp_get_attachment_url($image->ID);?>" >
<?php } ?>
</a>
<div class="entry-header">
<h3 class="entry-title"><a target="_self" href=<?php the_permalink(); ?>><?php the_title(); ?></a></h3>
<div class="entry-content">
<?php the_excerpt(); ?>
Read More
</div>
</div>
</article>
<?php
endwhile;
endif;
?>
I'm fairly new with using WP shortcodes, and I've run into a problem. I have tried to make a shortcode, that shows 6 of my blog posts through a loop, but it doesn't work. When it loads, it just smashes the page. The loop code works in practice, just not with the shortcode.
The code
function myshort() { ?>
<?php
$args = array( 'post_type' => 'cases', 'posts_per_page' => 6 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
?>
<div class="col-sm-6 wow fadeInUp" data-wow-delay="0.1s">
<a class="content" href="<?php echo get_permalink( $post->ID ); ?>">
<div class="image">
<?php the_post_thumbnail(); ?>
</div>
<div class="text">
<span class="date"><?php echo rwmb_meta( 'rw_stitle' ); ?></span>
<h3><?php the_title(); ?></h3>
<p><?php echo rwmb_meta( 'rw_sdesc' ); ?></p>
</div>
</a>
</div>
<?php endwhile;
}
add_shortcode('doitman', 'myshort');
So, my question is, how do I write this the right way?
The result should be returned as a value,
you could try something like this :
function myshort() {
ob_start(); ?>
<?php
$args = array( 'post_type' => 'cases', 'posts_per_page' => 6 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
?>
<div class="col-sm-6 wow fadeInUp" data-wow-delay="0.1s">
<a class="content" href="<?php echo get_permalink( $post->ID ); ?>">
<div class="image">
<?php the_post_thumbnail(); ?>
</div>
<div class="text">
<span class="date"><?php echo rwmb_meta( 'rw_stitle' ); ?></span>
<h3><?php the_title(); ?></h3>
<p><?php echo rwmb_meta( 'rw_sdesc' ); ?></p>
</div>
</a>
</div>
<?php endwhile;
return ob_get_clean();
}
add_shortcode('doitman', 'myshort');
I am using the following to wrap through a list of posts as I want to display them within divs.
Despite using
global $post;
$currentPage = $post->ID;
and
'post_parent' => $currentPage,
Which has worked fine elsewhere. I can't get the page to only show children and grandchildren of this page.
<?php
global $post;
$currentPage = $post->ID;
// Get posts (tweak args as needed)
$args = array(
'post_parent' => $currentPage,
'post_type' => 'page',
'orderby' => 'menu_order',
'order' => 'ASC'
);
$posts = get_pages( $args );
?>
<?php foreach (array_chunk($posts, 1, true) as $posts) : ?>
<div class="column small-4 medium-4 large-4">
<?php foreach( $posts as $post ) : setup_postdata($post); ?>
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
<?php endforeach; ?>
</div>
<?php endforeach; ?>
I am using the code within a custom template.
I have also tried
<?php
global $post;
$currentPage = $post->ID;
$args=array(
'child_of' => $currentPage,
'post_type' => 'page'
);
$my_query = null;
$my_query = new WP_Query($args);
echo $currentPage;
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post(); ?>
<?php $img = wp_get_attachment_image_src( get_post_meta($post->ID, 'image_or_video', true)); ?>
<?php $alt_text_for_logo = get_post_meta($post->ID, 'article_name', true); ?>
<?php $short_description = get_post_meta($post->ID, 'article_short_description', true); ?>
<div class="column small-12 medium-6 large-4 box">
<div>
<a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>" itemprop="url">
<?php if( $img ): ?>
<img src="<?php echo $img[0]; ?>" alt="<?php echo $alt_text_for_logo; ?>" />
<?php endif; ?>
<span><?php the_title(); ?></span>
</a>
</div>
</div>
<?php endwhile; } ?>
<?php wp_reset_query();?>
but this lists the pages I want followed by what appears to be 10 other random pages from the site's root though it doesn't list every page from the site.
Originally posted this solution as a comment, because I wasn't sure it was the only change that was necessary. Turned out it is, so here's the solution:
<?php
global $post;
$currentPage = $post->ID;
// Get posts (tweak args as needed)
$args = array(
'child_of' => $currentPage,
'post_type' => 'page',
'orderby' => 'menu_order',
'order' => 'ASC'
);
$posts = get_pages( $args );
?>
<?php foreach (array_chunk($posts, 1, true) as $posts) : ?>
<div class="column small-4 medium-4 large-4">
<?php foreach( $posts as $post ) : setup_postdata($post); ?>
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
<?php endforeach; ?>
</div>
<?php endforeach; ?>
The function get_pages doesn't seem to have post_parent as a valid argument. So you need to use child_of instead.
Reference to Codex
<?php
global $post;
$currentPage = $post->ID;
// Get posts (tweak args as needed)
$args = array(
'child_of ' => $currentPage,
'post_type' => 'page',
'orderby' => 'menu_order',
'order' => 'ASC'
);
$posts = get_pages( $args );
?>
https://codex.wordpress.org/Function_Reference/get_pages
To list All sub pages of current page
<?php
global $post;
$currentPage = $post->ID;
$args=array(
'post_parent' => $currentPage,//change
'post_type' => 'page',
'orderby' => 'menu_order',
'order' => 'ASC'
);
$my_query = null;
$my_query = new WP_Query($args);
echo $currentPage;
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post(); ?>
<?php $img = wp_get_attachment_image_src( get_post_meta($post->ID, 'image_or_video', true)); ?>
<?php $alt_text_for_logo = get_post_meta($post->ID, 'article_name', true); ?>
<?php $short_description = get_post_meta($post->ID, 'article_short_description', true); ?>
<div class="column small-12 medium-6 large-4 box">
<div>
<a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>" itemprop="url">
<?php if( $img ): ?>
<img src="<?php echo $img[0]; ?>" alt="<?php echo $alt_text_for_logo; ?>" />
<?php endif; ?>
<span><?php the_title(); ?></span>
</a>
</div>
</div>
<?php endwhile; } ?>
<?php wp_reset_query();?>
only change on code
$args=array(
'post_parent' => $currentPage,//change
'post_type' => 'page',
'orderby' => 'menu_order',
'order' => 'ASC'
);
which display all child pages of current page with their Menu order
About Us
Contact Us
Gallery
Testimonial
Blog
I am making a custom loop for my site using Woocommerce, I am using sub categories as a additional text field for the products but I can't find a function to just show sub categories, all are showing main and sub categories.
Can anyone help ?
<?php echo $product->get_categories(); ?>
Much appreciated :)
Here is the full code
<ul class="row-fluid">
<?php
$args = array ( 'post_type' => 'product', 'stock' => 1, 'posts_per_page' => 4, 'product_cat' => 'news', 'orderby' => 'date','order' => 'DESC' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>
<li class="span">
<a id="id-<?php the_id(); ?>" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="65px" height="115px" />'; ?>
<h3><?php the_title(); ?></h3>
<?php echo $product->get_categories(); ?>
<p class="price"><?php echo $product->get_price_html();?></p>
<a class="button add_to_cart_button product_type_simple"href="<?php the_permalink(); ?>">More...</a>
</a>
<div class="wer"><?php the_excerpt(); ?></div>
<span class="Cart"><?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?></span>
</li>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</ul>
Can anybody help i need to add an image to the first post in this loop but can't figure it out, so i want to go through the loop and only have an image in the first post and just display the rest as normal. Below is the code, cheers
<div class="trinary-content content ten columns">
<?php
$catObj = get_category_by_slug('news-and-views');
$category_id = $catObj->term_id;
$args = array(
'sort_order' => 'DESC',
'sort_column' => 'post_date',
'hierarchical' => 0,
'exclude' => '',
'include' => '',
'meta_key' => '',
'meta_value' => '',
'authors' => '',
// 'parent' => $post->ID,
'category' => $category_id,
'post_type' => 'post',
'post_status' => 'publish',
'posts_per_page' => 3
);
$pages = get_posts($args);
?>
<div class="widget widget-newsandviews">
<h2><?php echo $catObj->name; ?></h2>
<img class="news-image" src="/wp-content/themes/quentin/images/motorbike-accident/biker-full.png" />
<div class="items">
<?php $i = 0; ?>
<?php foreach($pages as $page): ?>
<div class="item <?php if($i)echo 'last'; ?>">
<a class="item-title" href="<?php echo get_page_link( $page->ID ); ?>"><?php echo $page->post_title; ?></a>
<p class="summary"><?php echo $page->post_except; ?></p>
<a class="read-more" href="<?php echo get_page_link( $page->ID ); ?>">Find out more »</a>
<div class="clear"></div>
</div>
<?php $i++; ?>
<?php endforeach; ?>
</div>
</div>
</div>
Try an if statement, you can move that block to wherever you want in your code. Also you may want to use the_post_thumbnail() to retrieve the image from the post itself
<?php foreach($pages as $page): ?>
<?php if ($i==0){ ?>
<img class="news-image" src="/wp-content/themes/quentin/images/motorbike-accident/biker-full.png" />
<?php } ?>
<div class="item <?php if($i)echo 'last'; ?>">
<a class="item-title" href="<?php echo get_page_link( $page->ID ); ?>"><?php echo $page->post_title; ?></a>
<p class="summary"><?php echo $page->post_except; ?></p>
<a class="read-more" href="<?php echo get_page_link( $page->ID ); ?>">Find out more »</a>
<div class="clear"></div>
</div>
<?php $i++; ?>
<?php endforeach; ?>