Skip to content

Instantly share code, notes, and snippets.

@viramgamijignesh

viramgamijignesh/date wise post filter as portfolio type

Last active January 16, 2018 07:37
Show Gist options
  • Save viramgamijignesh/0dd7af5acda53f9b0f51ced2769c2169 to your computer and use it in GitHub Desktop.
Save viramgamijignesh/0dd7af5acda53f9b0f51ced2769c2169 to your computer and use it in GitHub Desktop.
Download ZIP
date wise post filter as portfolio type
Raw
date wise post filter as portfolio type
=============custom css===============
#portfolio {
margin: 1rem 0;
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-gap: 1rem;
-moz-column-gap: 1rem;
column-gap: 1rem;
-webkit-column-width: 33.33333333333333%;
-moz-column-width: 33.33333333333333%;
column-width: 33.33333333333333%;
}
.tile {
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: all 350ms ease;
transition: all 350ms ease;
}
.tile:hover {
}
.scale-anm {
transform: scale(1);
}
p{
padding:10px;
border-bottom: 1px #ccc dotted;
text-decoration: none;
font-family: lato;
text-transform:uppercase;
font-size: 12px;
color: #333;
display:block;
float:left;
}
p:hover {
cursor:pointer;
background: #333;
color:#eee; }
.tile img {
max-width: 100%;
width: 100%;
height: auto;
margin-bottom: 1rem;
}
.btn {
font-family: Lato;
font-size: 1rem;
font-weight: normal;
text-decoration: none;
cursor: pointer;
display: inline-block;
line-height: normal;
padding: .5rem 1rem;
margin: 0;
height: auto;
border: 1px solid;
vertical-align: middle;
-webkit-appearance: none;
color: #555;
background-color: rgba(0, 0, 0, 0);
}
.btn:hover {
text-decoration: none;
}
.btn:focus {
outline: none;
border-color: var(--darken-2);
box-shadow: 0 0 0 3px var(--darken-3);
}
::-moz-focus-inner {
border: 0;
padding: 0;
}
================= custom js ==========
jQuery(function() {
var selectedClass = "";
jQuery(".fil-cat").click(function(){
selectedClass = jQuery(this).attr("data-rel");
jQuery("#portfolio").fadeTo(100, 0.1);
jQuery("#portfolio div").not("."+selectedClass).fadeOut().removeClass('scale-anm');
setTimeout(function() {
jQuery("."+selectedClass).fadeIn().addClass('scale-anm');
jQuery("#portfolio").fadeTo(300, 1);
}, 300);
});
});
========== function.php code=========
function setPostViews($postID) {
$countKey = 'post_views_count';
$viewdate = 'post_views_date';
$count = get_post_meta($postID, $countKey, true);
$date = get_post_meta($postID, $viewdate, true);
if($count==''){
$count = 0;
delete_post_meta($postID, $countKey);
add_post_meta($postID, $countKey, '1');
}else{
$count++;
update_post_meta($postID, $countKey, $count);
}
if($date==''){
$today = date("Y-m-d");
delete_post_meta($postID, $viewdate);
add_post_meta($postID, $viewdate, $today);
}else{
$today = date("Y-m-d");
update_post_meta($postID, $viewdate, $today);
}
}
remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);
========== single.php code=========
add this line in while loop before template call
setPostViews(get_the_ID());
=========== custompaget1.php (Template file)============
<?php
/* Template Name: CustomPageT1 */
function wptuts_scripts_with_the_lot_temp1()
{
if ( is_page_template( 'custompaget1.php' ) ) {
wp_enqueue_script('jquery');
wp_enqueue_style( 'custom-style', get_template_directory_uri() . '/css/custom-style.css' );
wp_enqueue_style( 'owl-carousel-css', get_template_directory_uri() . '/css/owl.carousel.min.css' );
wp_enqueue_script( 'custom-script', get_template_directory_uri() . '/js/custom-script.js', array(), '1.0.0', true );
wp_enqueue_script( 'owl-carousel-js', get_template_directory_uri() . '/js/owl.carousel.min.js', array(), '1.0.0', true );
}
}
add_action( 'wp_enqueue_scripts', 'wptuts_scripts_with_the_lot_temp1' );
get_header(); ?>
<div class="container">
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<div class="entry-content" style="width:90%; text-align: center;float: none;">
<div class="toolbar mb2 mt2">
<button class="btn fil-cat" href="" data-rel="yearly">Yearly</button>
<button class="btn fil-cat" data-rel="sixmonth">Six Month</button>
<button class="btn fil-cat" data-rel="quarterly">Quarterly</button>
<button class="btn fil-cat" data-rel="monthly">Monthly</button>
<button class="btn fil-cat" data-rel="webeekly">Weekly</button>
</div>
<div style="clear:both;"></div>
<div id="portfolio">
<?php
/* ============ Week =========== */
$today = date("Y-m-d");
$week = date('Y-m-d', strtotime('-7 days'));
$args = array(
'post_type' => 'post',
'meta_key' => 'post_views_date',
'posts_per_page' => -1,
'orderby' => 'post_views_count',
'order' => 'DESC',
'meta_query' => array(
array(
'key' => 'post_views_date',
'value' => array($week, $today),
'compare' => 'BETWEEN',
'type' => 'DATE',
)
)
);
$the_query = new WP_query($args);
if ( $the_query->have_posts() ) {
while ( $the_query->have_posts() ) {
$the_query->the_post();
$post_id = get_the_ID();
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post_id ), 'single-post-thumbnail' );
$one_month_image_url = $image['0'];
echo '<div class="tile scale-anm webeekly">';
echo '<img class="item" src="'.$one_month_image_url.'" alt="" />';
echo $post_id;
echo '</div>';
}
wp_reset_postdata();
} else {
// no posts found
}
$today = date("Y-m-d");
$month = date('Y-m-d', strtotime('-30 days'));
$args = array(
'post_type' => 'post',
'meta_key' => 'post_views_date',
'posts_per_page' => -1,
'orderby' => 'post_views_count',
'order' => 'DESC',
'meta_query' => array(
array(
'key' => 'post_views_date',
'value' => array($month, $today),
'compare' => 'BETWEEN',
'type' => 'DATE',
)
)
);
$the_query = new WP_query($args);
if ( $the_query->have_posts() ) {
while ( $the_query->have_posts() ) {
$the_query->the_post();
$post_id = get_the_ID();
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post_id ), 'single-post-thumbnail' );
$one_month_image_url = $image['0'];
echo '<div class="tile scale-anm monthly">';
echo '<img class="item" src="'.$one_month_image_url.'" alt="" />';
echo $post_id;
echo '</div>';
}
wp_reset_postdata();
} else {
// no posts found
}
/* ============ 3 - Monlth =========== */
$today = date("Y-m-d");
$threemonth = date('Y-m-d', strtotime('-90 days'));
$args = array(
'post_type' => 'post',
'meta_key' => 'post_views_date',
'posts_per_page' => -1,
'orderby' => 'post_views_count',
'order' => 'DESC',
'meta_query' => array(
array(
'key' => 'post_views_date',
'value' => array($threemonth, $today),
'compare' => 'BETWEEN',
'type' => 'DATE',
)
)
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) {
while ( $the_query->have_posts() ) {
$the_query->the_post();
$post_id = get_the_ID();
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post_id ), 'single-post-thumbnail' );
$three_month_image_url = $image['0'];
echo '<div class="tile scale-anm quarterly">';
echo '<img class="" src="'.$three_month_image_url.'" alt="" />';
echo $post_id;
echo '</div>';
}
wp_reset_postdata();
} else {
// no posts found
}
/* ============ 6 - Monlth =========== */
$today = date("Y-m-d");
$sixmonth = date('Y-m-d', strtotime('-180 days'));
$args = array(
'post_type' => 'post',
'meta_key' => 'post_views_date',
'posts_per_page' => -1,
'orderby' => 'post_views_count',
'order' => 'DESC',
'meta_query' => array(
array(
'key' => 'post_views_date',
'value' => array($sixmonth, $today),
'compare' => 'BETWEEN',
'type' => 'DATE',
)
)
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) {
while ( $the_query->have_posts() ) {
$the_query->the_post();
$post_id = get_the_ID();
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post_id ), 'single-post-thumbnail' );
$six_month_image_url = $image['0'];
echo '<div class="tile scale-anm sixmonth">';
echo '<img class="" src="'.$six_month_image_url.'" alt="" />';
echo $post_id;
echo '</div>';
}
wp_reset_postdata();
// } else {
}
/* ============ Yearly =========== */
$today = date("Y-m-d");
$oneyear = date('Y-m-d', strtotime('-364 days'));
$args = array(
'post_type' => 'post',
'meta_key' => 'post_views_date',
'posts_per_page' => -1,
'orderby' => 'post_views_count',
'order' => 'DESC',
'meta_query' => array(
array(
'key' => 'post_views_date',
'value' => array($oneyear, $today),
'compare' => 'BETWEEN',
'type' => 'DATE',
)
)
);
$the_query = new WP_Query( $args );
//print_r($the_query);
if ( $the_query->have_posts() ) {
while ( $the_query->have_posts() ) {
$the_query->the_post();
$post_id = get_the_ID();
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post_id ), 'single-post-thumbnail' );
$yearly_image_url = $image['0'];
echo '<div class="tile scale-anm yearly">';
echo '<img class="" src="'.$yearly_image_url.'" alt="" />';
echo $post_id;
echo '</div>';
}
wp_reset_postdata();
} else {
// no posts found
}
?>
</div>
<div style="clear:both;"></div>
</div><!-- #post-## -->
</main><!-- #main -->
</div><!-- #primary -->
</div><!-- .wrap -->
<?php get_footer();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment