- This topic has 9 replies, 2 voices, and was last updated 8 years, 2 months ago by
.
-
Posts
-
-
Hi. I cannot find the template for product grid.
1. Is it possible to change the order of the product grid to be chronologically displayed (right now it’s showing the newest products first.. I want it show the oldest products first).
2. I’d like to add a subtitle class in between tmvs-grid-title and tmvs-grid-subtitle. Thanks.
-
Hi
The EDD Product grid template is included in the themevan-shortcodes plugin (themevan-shortcodes/elements/edd_product_grid.php), but I’m not suggest you to modify the plugin, so you can customize the plugin functions as the following steps:
1) Download the latest version of themevan shortcodes plugin here: http://www.themevan.com/repo/plugins/themevan-shortcodes.zip remove the old version, and reinstall this v1.1.0. I’ve updated it for you, make some plugins pluggable that allow you to copy and modify the function directly in your theme, to override the original function.
2) I suggest you activate the DGWork Child theme (Included in the package you downloaded from themeforest.net).
3) As I said above, you can find the product grid function in plugins/themevan-shortcodes/elements/edd_product_grid.php, open this file, copy the following function to your theme functions.php
function custom_vc_edd_product_grid( $atts) { static $tmvs_custom_loop; global $post; wp_enqueue_script( 'imagesLoaded'); wp_enqueue_script( 'isotope'); wp_enqueue_script( 'masonry' ); if( !isset($tmvs_custom_loop) ) $tmvs_custom_loop = 1; else $tmvs_custom_loop ++; $atts = shortcode_atts( array( 'paging' => 'paginate'. $tmvs_custom_loop, 'post_type' => 'download', 'posts_per_page' => '10', 'post_status' => 'publish', 'download_category' => '', 'columns' => 3, 'template' => 'item-grid', 'pagination' => 'no', 'filter_type' => 'no', 'orderby' => 'date', 'extra_class' => '', 'css_animation' => '', ), $atts ); $paging = $atts['paging']; unset( $atts['paging'] ); $pagination = $atts['pagination']; unset( $atts['pagination'] ); $template = $atts['template']; unset( $atts['template'] ); $template_class=''; $gutter=15; $thumbnail_size=array(800,500); if($template=='picture-masonry'){ $template_class='tmvs-masonry'; $thumbnail_size='large'; $gutter=0; }elseif($template=='picture-grid'){ $template_class='tmvs-picture-grid'; } $columns = $atts['columns']; unset( $atts['columns'] ); $column_class='three_columns'; if($columns==2){ $column_class='two_columns'; } $filter_type = $atts['filter_type']; unset( $atts['filter_type'] ); if( isset($_GET[$paging]) ) $atts['paged'] = $_GET[$paging]; else $atts['paged'] = 1; $product_grid_object_id=tmvs_random_string(10); $custom_query = new WP_Query( $atts ); $pagination_base = add_query_arg( $paging, '%#%'); $html =''; if( $custom_query->have_posts() ): if($filter_type=='filter'){ $html = tmvs_category_filter($product_grid_object_id,'download_category',$atts['download_category'],false); }elseif($filter_type=='category'){ $html = tmvs_categories('download_category','',false); }else{ $html=''; } $html .= '<div id="tmvs-products-grid-'.$product_grid_object_id.'" class="tmvs-grid '.$template_class.' '.$column_class.'">'; while( $custom_query->have_posts()) : $custom_query->the_post(); $terms = get_the_terms($post->ID,'download_category'); $slug=array(); if ( $terms && ! is_wp_error( $terms ) ){ foreach($terms as $term) { $slug[] = $term->slug; } } $on_slug = join( " ", $slug); $price=esc_attr(get_post_meta($post->ID, "edd_price", true)); $preview=esc_attr(get_post_meta($post->ID, "_dgwork_preview_url", true)); $short_description=esc_attr(get_post_meta($post->ID, "_dgwork_short_description", true)); if(intval($price)==0){ $freelabel = '<div class="freeLabel">'.esc_attr__('Free!','tvms').'</div>'; }else{ $freelabel = ''; } $html .= '<div class="post '.$on_slug.'">'.$freelabel.' <div class="tmvs-grid-item"> <div class="image-box"> '.get_the_post_thumbnail($post->ID,$thumbnail_size,array('alt'=>esc_attr(get_the_title()))).' </div>'; if($template=='item-grid'){ $html .= '<div class="text-desc"> '.edd_price($post->ID,false).' <span class="divider"></span> <a href="'.esc_url(get_permalink()).'" class="button details"><i class="fa fa-eye"></i>'.esc_attr__('Details','tmvs').'</a> <a href="checkout?edd_action=add_to_cart&download_id='.$post->ID.'" class="button add_to_cart"><i class="fa fa-shopping-cart"></i> '.esc_attr__('Buy Now','tmvs').'</a> </div>'; }else{ $html .= '<div class="text-desc"> <a href="'.esc_url(get_permalink()).'" class="title">'.esc_attr__(get_the_title()).'</a> <span class="divider"></span> <a href="'.esc_url(get_permalink()).'" class="icon"><i class="fa fa-search-plus"></i></a> </div>'; } $html.='</div>'; if($template=='item-grid'){ $html.='<h3 class="tmvs-grid-title"><a href="'.esc_url(get_permalink()).'" title="'.esc_attr(get_the_title()).'">'.esc_attr(get_the_title()).'</a></h3> <p class="tmvs-grid-subtitle">'.tmvs_truncate($short_description,120).'</p>'; } $html.='</div>'; endwhile; $html.='</div><div class="clear"></div>'; if($pagination=='yes'): $html .= '<div class="tmvs_pagenavi">'; $html .= paginate_links( array( 'type' => '', 'base' => $pagination_base, 'format' => '?'. $paging .'=%#%', 'current' => max( 1, $custom_query->get('paged') ), 'total' => $custom_query->max_num_pages )); $html.='</div>'; endif; $html.="<script type='text/javascript'> jQuery(document).ready(function($){ $('#nav-filter-".$product_grid_object_id." li').on('click',function(){ var selector = $(this).attr('data-filter'); var product_grid_container=$('#tmvs-products-grid-".$product_grid_object_id."'); product_grid_container.isotope({ animationEngine: 'css', filter: selector, masonry: { gutter: ".$gutter." } }); $(this).attr('class','active'); $(this).siblings().removeAttr('class'); return false; }); }); </script>"; endif; $html = apply_filters( 'custom_vc_edd_product_grid_output', $html); return $html; }4) The function length looks a bit long, but don’t worry, only edit the part which you want to customize.
For example, change the order of the product grid, just change the following part:$atts = shortcode_atts( array( 'paging' => 'paginate'. $tmvs_custom_loop, 'post_type' => 'download', 'posts_per_page' => '10', 'post_status' => 'publish', 'download_category' => '', 'columns' => 3, 'template' => 'item-grid', 'pagination' => 'no', 'filter_type' => 'no', 'orderby' => 'date', 'extra_class' => '', 'css_animation' => '', ), $atts );to:
$atts = shortcode_atts( array( 'paging' => 'paginate'. $tmvs_custom_loop, 'post_type' => 'download', 'posts_per_page' => '10', 'post_status' => 'publish', 'download_category' => '', 'columns' => 3, 'template' => 'item-grid', 'pagination' => 'no', 'filter_type' => 'no', 'orderby' => 'date', 'extra_class' => '', 'css_animation' => '', 'orderby' => 'date', 'order' => 'ASC' ), $atts );You can see I added ‘orderby’ => ‘date’ and order’ => ‘ASC’ to the array, then it will show the oldest posts first.
For your second issue, you can add your Class to this part:
if($template=='item-grid'){ $html.='<h3 class="tmvs-grid-title"><a href="'.esc_url(get_permalink()).'" title="'.esc_attr(get_the_title()).'">'.esc_attr(get_the_title()).'</a></h3> <p class="tmvs-grid-subtitle">'.tmvs_truncate($short_description,120).'</p>'; }Hope this makes sense.
Thanks
-
-
-
-
Yes, you will lost the changed codes after upgraded the plugin. Nevermind, I changed the plugins again, now you can move custom_vc_edd_product_grid() function to your child theme’s functions.php, it will work as normal.
Sorry that I still don’t understand the second issue, so I made a picture to descript your need, is that correct? https://www.dropbox.com/s/jiubt6amy0afiem/insert-title.jpg?dl=0
-
-
Copy custom_vc_edd_product_grid( $atts) function to your child theme’s functions.php, as I said above, find the following codes:
if($template=='item-grid'){ $html.='<h3 class="tmvs-grid-title"><a href="'.esc_url(get_permalink()).'" title="'.esc_attr(get_the_title()).'">'.esc_attr(get_the_title()).'</a></h3> <p class="tmvs-grid-subtitle">'.tmvs_truncate($short_description,120).'</p>'; }You can insert esc_attr(get_post_meta($post->ID, “_dgwork_product_header_subtitle”, true)) into anywhere you want, for example:
if($template=='item-grid'){ $html.='<h3 class="tmvs-grid-title"><a href="'.esc_url(get_permalink()).'" title="'.esc_attr(get_the_title()).'">'.esc_attr(get_the_title()).'</a></h3> <p class="product-subtitle">'.esc_attr(get_post_meta($post->ID, "_dgwork_product_header_subtitle", true)).'</p> <p class="tmvs-grid-subtitle">'.tmvs_truncate($short_description,120).'</p>'; }Because the free support doesn’t include customization, this the general idea that you can adjust the details by yourself.
Thanks!
-
-
-
- You must be logged in to reply to this topic.