Wordpress custom post loop for slider - wordpress

How can i make looping for this slider :
My Slider looks like : http://www.awesomescreenshot.com/image/969867/a3a51b333881ca762739151dae8b16f9
First li consist of top image and second one comes with below one. each single image must be a single post
Html Code :
<div class="row cycle-slideshow" data-cycle-fx=carousel data-cycle-timeout=0 data-cycle-carousel-visible=3 data-cycle-carousel-fluid=true data-cycle-slides="li" data-cycle-next="#next" data-cycle-prev="#prev" data-cycle-pager="#pager">
<ul>
<li class="span2">
<a href="#journeymodel">
<img src="http://lorempixel.com/200/200/">
<h3>Barobudur Temple, java</h3>
<div></div>
</a>
<a href="#journeymodel">
<img src="http://lorempixel.com/200/200/">
<h3>Barobudur Temple, java</h3>
<div></div>
</a>
</li>
<li class="span2">
<a href="#journeymodel">
<img src="http://lorempixel.com/200/200/">
<h3>Uluvatu Temple, Bali</h3>
<div></div>
</a>
<a href="#journeymodel">
<img src="http://lorempixel.com/200/200/">
<h3>Uluvatu Temple, Bali</h3>
<div></div>
</a>
</li>
Php code :
<?php
$loop = new WP_Query(array('post_type'=>'realisation','sort_column' => 'post_date','posts_per_page'=> -1);//'order' => 'DESC');
if ( $loop->have_posts() )
{
while ( $loop->have_posts() )
{
$loop->the_post();
$cat=get_post_meta($post->ID,'category',true);
if ($cat=='privae') // post catagory
{
//li section should comes here by based on list of post added
Can someone guide me how can i update the looping for this section .

You can do something like this:
$arr = array("post_type" => "post_type", 'posts_per_page' => -1, 'orderby' => 'post_title', 'order' => 'ASC');
$posts= get_posts($arr);
echo '<ul>';
foreach($posts as $post) {
$img= get_post_meta($post->ID, 'meta_field', true);
echo "<li><img src='" . $img . "' /></li>";
}
echo '</ul>';

Related

How can I wrap the content using a permalink in a foreach loop

How can I wrap the content in the overlay div with a permalink that corresponds to the category. I want the image to be clickable and also pull the category name with the matching image. I want this to be dynamic in the event new categories are added.
<?php
/**
*
* Catergory Display
*
*/
$categories = get_categories( array(
'orderby' => 'name',
'order' => 'ASC',
'hide_empty' => false,
) );
?>
<div class="container">
<div class="row">
<?php
foreach( $categories as $category ) {
$image = get_field('category_image', 'category_' . $category->term_id);
$size = 'featured-thumbnail'; // (thumbnail, medium, large, full or custom size)
$cat_link = get_category_link($category->cat_ID);
?>
<div class="category-holder col-lg-4 col-md-6 col-sm-12 ">
<div class="category-display-img">
<?php echo wp_get_attachment_image( $image, $size ); ?>
<a href="<?php echo esc_url( get_permalink($cat_link) )?>">
<div class="overlay"><?php echo '<a class="" href="'.$cat_link.'">'.$category->name.'</a>'; // category link ?></div>
</a>
</div>
</div>
<?php
// echo '<pre>';
// print_r($cat_link);
// wp_die();
} ?>
</div>
</div>
You can wrap the anchor tag around the div with the overlay class.
Delete this part
<a href="<?php echo esc_url( get_permalink($cat_link) )?>">
<div class="overlay"><?php echo '<a class="" href="'.$cat_link.'">'.$category->name.'</a>'; // category link ?></div>
</a>
And use this in its place
<a href="<?php echo $cat_link ?>">
<div class="overlay">
<?php echo $category->name ?>
</div>
</a>

How to link pagination results with Bootstrap nav tabs

I have 3 nav tabs (created using bootstrap) for sorting results using wp_query on my Library page.
The pagination works well, the problem I have is: when i click next or second on my pagination the active tab on Library page reverts to the first default sorting tab (recent).
My code is:
<?php
/**
* displays archive Library page
*/
get_header();
?>
<div id="page-header">
<section class="wrapper">
<div class="breadcrumbs">
You are here: Home / <span class="current">Library</span>
</div>
<h1 class="page-title half">Library</h1>
<div id="item-nav">
<div id="object-nav" class="item-list-tabs" role="navigation">
<ul class="tabs-nav tabs">
<li class="nav-three " data-tab="origin">Book origin</li>
<li class="nav-two " data-tab="year">Book release date</li>
<li class="nav-one current" data-tab="recent">Recent </li>
</ul>
</div><!-- /.item-list-tabs -->
</div><!-- /#item-nav -->
<div class="clear"></div>
</section>
</div><!-- /#page-header -->
<section class="wrapper">
<main class="tab-content current vocab-container" id="recent">
<ul class="blog-1 blog-1-full-width col-3 list-unstyled">
<div class='row'>
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'post_type' => 'library',
'post_type' => 'library',
'orderby' => 'meta_value',
'posts_per_page' => 9,
'paged' => $paged
);
$wp_query = new WP_Query( $args );
if ($wp_query->have_posts() ) : while( $wp_query->have_posts() ) : $wp_query->the_post();
get_template_part( 'template-parts/content/content', 'lib' );
endwhile; else:
// nothing was found
endif;
wp_reset_postdata(); /* Restore original Post Data */
twentynineteen_the_posts_navigation();
?>
</div>
</ul>
</main>
<main class="tab-content vocab-container" id="year">
<ul class="blog-1 blog-1-full-width col-3 list-unstyled">
<div class='row'>
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'post_status' => 'published',
'post_type' => 'library',
'orderby' => 'meta_value_num',
'meta_key' => 'year',
'posts_per_page' => 9,
'paged' => $paged
);
$wp_query = new WP_Query( $args );
if ($wp_query->have_posts() ) : while( $wp_query->have_posts() ) : $wp_query->the_post();
get_template_part( 'template-parts/content/content', 'lib' );
endwhile; else:
// nothing was found
endif;
wp_reset_postdata(); /* Restore original Post Data */
twentynineteen_the_posts_navigation();
?>
</div>
</ul>
</main>
<main class="tab-content vocab-container" id="origin">
<ul class="blog-1 blog-1-full-width col-3 list-unstyled">
<div class='row'>
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'post_status' => 'published',
'post_type' => 'library',
'orderby' => 'meta_value',
'meta_key' => 'origin',
'posts_per_page' => 9,
'paged' => $paged
);
$wp_query = new WP_Query( $args );
if ($wp_query->have_posts() ) : while( $wp_query->have_posts() ) : $wp_query->the_post();
get_template_part( 'template-parts/content/content', 'lib' );
endwhile; else:
// nothing was found
endif;
wp_reset_postdata(); /* Restore original Post Data */
twentynineteen_the_posts_navigation();
?>
</div>
</ul>
</main>
</section><!-- /.wrapper -->
<?php
get_footer();
?>
Link to my website Library page is: http://elluse.com/library/
I really appreciate you help. Lana :)
If someone has similar issue I found similar answered question on stackexchange website. Here is link.
https://wordpress.stackexchange.com/questions/151596/sorting-custom-posts-on-archive-page-with-pagination?newreg=a1f2074307b347d5aecc0b666dcff3be
<script>
function submitform(val) {
document.getElementById('sort-option').value = val;
document.getElementById('form-sort').submit();
}
</script>
<form id="form-sort" action="<?php echo get_permalink(); ?>" method="post">
<ul>
<li>Sort By:</li>
<li>Newest rating
</li>
<li>Highest rating
</li>
<li>Lowest rating
</li>
</ul>
<input type='hidden' id='sort-option' name='sort-option' value=''>
</form>
_____________________________________________________________________________
if($wp_query->get('page') == 0 && empty($_POST) && !empty($_SESSION)) session_unset();
if(!empty($_POST) || !empty($_SESSION)) {
switch($_POST['sort-option']) {
case 'newest':
$_SESSION["sort"] = SORT_DESC;
$_SESSION["sort_by"] = 'review_date';
break;
case 'highest':
$_SESSION["sort"] = SORT_DESC;
$_SESSION["sort_by"] = 'rating';
break;
case 'lowest':
$_SESSION["sort"] = SORT_ASC;
$_SESSION["sort_by"] = 'rating';
break;
}
foreach($reviews as $k => $v) {
$column_id[$k] = $v[$_SESSION["sort_by"]];
}
array_multisort($column_id, $_SESSION["sort"], SORT_NUMERIC, $reviews);
}

Show parent child taxonomy in nested tabs with its post

I want to show parent taxonomy in tab section and the under parent taxonomy i want to display child taxonomy in nested tab. On selection of child taxonomy i want to show its post. I am getting every time child taxonomy with with its post which i don't want.
Here is what i want:
TAB1(parent active) TAB2(parent)
ALL_TAB1(child active) SUB1_TAB1 SUB2_TAB1
(posts for all, sub1_tab1, sub2_tab1 and respectively whichever is active)
What i tried
<?php
/*
Template Name: Prac
*/
get_header();
// Get list of 'categories' for tabs -->
$args = array(
'hide_empty' => false,
'parent' => 0
);
$preferences = get_terms( 'preferences', $args );
?>
<div class="row">
<div class="col-md-12">
<?php
while ( have_posts() ) : the_post();
the_content();
endwhile; ?>
<ul class="nav nav-tabs" id="myTab" role="tablist">
<!-- Create the tabs -->
<?php
// Use counter so that 'active' class is only applied to first tab
$counter = 0;
foreach ($preferences as $preference) { ?>
<li class="nav-item">
<a class="nav-link <?= ($counter == 0) ? 'active' : '' ?>" id="<?php echo $preference->slug;?>-tab" data-toggle="tab" href="#<?php echo $preference->slug; ?>" role="tab" aria-controls="<?php echo $preference->slug;?>" aria-selected="<?= ($counter == 0) ? 'true' : 'false' ?>"><?php echo $preference->name; ?></a>
</li>
<?php $counter++; } ?>
</ul>
<div class="tab-content" id="nav-tabContent">
<!-- Get the content for each tab -->
<?php
$counter2 = 0;
foreach ($preferences as $preference) { ?>
<div role="tabpanel" class="tab-pane fade <?= ($counter2 == 0) ? 'show active' : '' ?>" id="<?php echo $preference->slug; ?>" aria-labelledby="<?php echo $preference->slug; ?>-tab">
<div class="row">
<?php
$args = array(
'post_type' => 'project',
'tax_query' => array(
array(
'taxonomy' => $preference->taxonomy,
'field' => $preference->slug,
'terms' => $preference->term_id
)
)
);
$loop = new WP_Query( $args );
?>
<div class="col-md-6" id="<?php echo $preference->slug . '-clauses' ?>">
<?php
?>
<?php
if ( $loop->have_posts() ) : while ( $loop->have_posts() ) : $loop->the_post(); ?>
<?php
//Do something if a specific array value exists within a post
$term_list = wp_get_post_terms($post->ID, $preference->taxonomy, array("fields" => "all"));
?>
<?php foreach($term_list as $term_single) {
$category_children = get_terms(array(
'parent' => $term_single->term_id,
'hide_empty' => false
) );
$category_children_count = count($category_children);
?>
<?php } ?>
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<?php echo $term_single->name; ?>
</li>
</ul>
<a class="col-md-6" href="<?php echo the_permalink();?>"><?php the_post_thumbnail();?><?php echo the_title(); ?></a>
<?php endwhile; endif; wp_reset_query(); ?>
</div>
</div> <!-- end row -->
</div> <!-- end tab-pane -->
<?php $counter2++; } ?>
</div> <!-- end tab-content -->
</div> <!-- end col -->
</div> <!-- end row -->
<!-- end content -->
<?php get_footer(); ?>
I am getting like this
TAB1 TAB2
SUB1_TAB1
post
SUB1_TAB1
post
SUB1_TAB2
Can anyone help ? Thanks.

Can't display custom post type categories on the page

I have a custom post type called "case_studies" and it has 3 categories: "seo", "website-design" and "facebook-advertising".
I have several posts in the main page, and for each post I want to output what categories the post has.
For example, the latest post has a category of "seo" and "facebook-advertising", and I want it to be displayed in the page.
I have tried the get_the_terms(); function but I think I am using it incorrectly.
Here is the code of the page:
<div class="container">
<!--
<div class="category_container">
<p class="category_item" id="all">All</p>
<p class="category_item" id="website">Websites</p>
<p class="category_item" id="facebook">Facebook Ads</p>
<p class="category_item" id="seo">SEO</p>
</div>
-->
<div class="row d-flex">
<?php
$args1 = array( 'post_type' => array('case_studies'), 'order' => 'DESC', 'posts_per_page' => 30, 'orderby' => 'date' );
$loop = new WP_Query( $args1 );
while ( $loop->have_posts() ) {
$loop->the_post();
$feat_image = wp_get_attachment_url( get_post_thumbnail_id($loop->ID));
?>
<div class="col-sm-4">
<div class="case-study-content">
<a href="<?php the_permalink() ?>" class="blog_blocks">
<div class="b_image">
<img src="<?php echo get_the_post_thumbnail_url(); ?>"/>
</div>
<div class="b_h_sec">
<h2><?php the_title(); ?></h2>
<p><?php echo wp_strip_all_tags( get_the_excerpt(), true ); ?></p>
<span class="r_m">Read More</span>
</div>
</a>
</div>
</div>
<?php } ?>
<?php wp_reset_postdata(); ?>
</div>
</div>
Here is how the output looks right now and where I want categories to be displayed.

how to write href Men Category link in wordpress?

For my WordPress theme I need help from an expert. Here is my nav-list html
Example:
//Here is my WP code:
<li>
<?php
$category_men = get_the_category_by_id($catmen['content-cat-one']);
$content_one =new WP_Query(array(
'post_type' => 'post',
'posts_per_page' => 1,
'category_name' => $category_men
));
while($content_one->have_posts()) : $content_one->the_post(); ?>
<a href="<?php echo get_category_link( $catmen['content-cat-one'] ); ?>#<?php echo get_cat_ID($category_men); ?>" >Men Category</a>
<?php endwhile; ?>
</li>
<ul class="nav nav-tabs">
<li>Men Category</li>
</ul>
<div class="tab-pane active" id="men">
</div>
<div class="tab-pane active" id="<?php echo get_cat_ID($category_men); ?>">
The result comes out: //localhost/my-themes/category/featured/#5
I do not want the result above, I want //localhost/my-themes/category/featured/
How to overcome these problems?
Replace this code,
<a href="<?php echo get_category_link( $catmen['content-cat-one'] ); ?>#<?php echo get_cat_ID($category_men); ?>" >Men Category</a>
with the code snippet bellow.
Men Category

Resources