2017-06-07 9 views
1

私はワードプレスのウェブサイトにビジュアルコンポーザーをインストールしました。ビジュアルコンポーザーの要素としてカスタムの投稿タイプを追加する必要があり、テンプレートファイルをビジュアルコンポーザーの作成したカスタム投稿タイプ要素にマップする必要があります。カスタム投稿でビジュアルコンポーザーを要素として拡張する方法

<?php 
add_action('vc_before_init', 'vc_extend_func'); 
function vc_extend_func() { 
    vc_map(array(
     "name" => __("Testing", "my-text-domain"), 
     "base" => "test", 
     "class" => "", 
     "category" => __("Content", "my-text-domain"), 
    )); 
} 
?> 

このコードは、ビジュアルコンポーザーに要素を作成しました。私の質問は、この要素にテンプレートをマップする方法です。

<?php 
$dir = get_stylesheet_directory() . '/vc_templates'; 
vc_set_shortcodes_templates_dir($dir); 
?> 

デフォルトのショートコードテンプレートパスも上書きします。しかし、私は望みの結果を得ていませんでした。親切にも、作成されたポストタイプのテンプレートをマップするソリューションを提供してください。 ありがとうございました。

答えて

1

私はこのテーマを正確に実行しました。私は "ポートフォリオ"のカスタム投稿を作成し、それを要素としてVisual Composerに追加しました。また、いくつかのオプションがあり、 "カテゴリ"に基づいて投稿を表示することができます。以下は完全な作業コードです。

ステップ1 - PHPファイルを作成し、このコードを貼り付けます。

add_action('vc_before_init', 'agr_portfolio_integrateWithVC'); 
function agr_portfolio_integrateWithVC() { 
$taxonomy = 'portfolio_categories'; 
$categories_array = array(); 
$categories = get_terms(array(
    'taxonomy' => $taxonomy, 
    'hide_empty' => false, 
)); 
$categories_array[] = 'All'; 
foreach($categories as $category){ 
    $categories_array[] = $category->name; 
} 

vc_map(array(
    "name" => __("Portfolio", THEME_TEXT_DOMAIN) , 
    "base" => "agr_portfolio", 
    "category" => __("Adina Addons", THEME_TEXT_DOMAIN), 
    'icon' => get_template_directory_uri().'/visual_composer/agr-portfolio/agr-portfolio.png', 
    'description' => __('Displays Portfolio items with many styles & options.', THEME_TEXT_DOMAIN) , 
    "params" => array(
     array(
      "type" => "dropdown", 
      "heading" => __("Style", THEME_TEXT_DOMAIN) , 
      "param_name" => "agr_portfolio_style", 
      "value" => array(
       "Modern" => "modern", 
       "Classic" => "classic", 
       "Newspaper" => "newspaper", 
       "Masonry" => "masonry" 
      ) , 
      "description" => __("Select Portfolio loop style to use.", THEME_TEXT_DOMAIN) 
     ) , 
     array(
      "type" => "dropdown", 
      "heading" => __("Category", THEME_TEXT_DOMAIN) , 
      "param_name" => "agr_portfolio_category", 
      "value" => $categories_array , 
      "description" => __("Select Portfolio category to display.", THEME_TEXT_DOMAIN) 
     ) , 
     array(
      "type" => "dropdown", 
      "heading" => __("Image Size", THEME_TEXT_DOMAIN) , 
      "param_name" => "agr_portfolio_image_size", 
      "value" => array(
       "Cover" => "cover", 
       "Contain" => "contain" 
      ) , 
      "description" => __("Select Portfolio image style.", THEME_TEXT_DOMAIN) 
     ) , 
     array(
      "type" => "dropdown", 
      "heading" => __("How many columns", THEME_TEXT_DOMAIN) , 
      "param_name" => "agr_portfolio_nr_columns", 
      "value" => array(
       "Default" => "col-md-6 col-xs-12", 
       "1 column" => "col-md-12 col-xs-12", 
       "2 columns" => "col-md-6 col-xs-12", 
       "3 columns" => "col-md-4 col-xs-12", 
       "4 columns " => "col-md-3 col-xs-12", 
       "6 columns " => "col-md-2 col-xs-12" 
      ) , 
      "description" => __("Select Portfolio image style.", THEME_TEXT_DOMAIN) 
     ) , 
     array(
      'type' => 'textfield', 
      'heading' => __('How many posts', THEME_TEXT_DOMAIN), 
      'param_name' => 'agr_portfolio_nr_posts', 
      'value' => '10', 
      'admin_label' => true, 
      'description' => __('Enter the number of posts to be displayed.', THEME_TEXT_DOMAIN), 
     ), 
     array(
      "type" => "dropdown", 
      "heading" => __("Order", THEME_TEXT_DOMAIN) , 
      "param_name" => "agr_portfolio_order", 
      "value" => array(
       "DESC (descending order)" => "DESC", 
       "ASC (ascending order)" => "ASC" 
      ) , 
      "description" => __("Portfolio items will be displayed in DESC or ASC order", THEME_TEXT_DOMAIN) 
     ) , 
     array(
      "type" => "dropdown", 
      "heading" => __("Order By", THEME_TEXT_DOMAIN) , 
      "param_name" => "agr_portfolio_order_by", 
      "value" => array(
       "Date" => "date", 
       "Title name" => "title" 
      ) , 
      "description" => __("Sort Portfolio items by selected parameter.", THEME_TEXT_DOMAIN) 
     ) , 
     array(
      "type" => "textfield", 
      "heading" => __("Extra class name", THEME_TEXT_DOMAIN) , 
      "param_name" => "agr_portfolio_class", 
      "value" => "", 
      "description" => __("If you wish to style particular content element differently, then use this field to add a class name and then refer to it in your Custom CSS.", THEME_TEXT_DOMAIN) 
     ) 
    ) 
)); 

}

//これは、カスタムページネーション機能です。それを同じファイルに入れてください。

function agr_portfolio_pagination($pages = '', $range = 2) { 

$showitems = ($range * 2)+1; 
$paginationData = ''; 

global $paged; 
if(empty($paged)) $paged = 1; 

if($pages == '') { 
    global $wp_query; 
    $pages = $wp_query->max_num_pages; 
    if(!$pages) { 
     $pages = 1; 
    } 
} 

if(1 != $pages) { 
    $paginationData = '<div class="pagination">'; 
    if($paged > 2 && $paged > $range+1 && $showitems < $pages) { 
     $paginationData .= '<a href="' .get_pagenum_link(1). '">&laquo;</a>'; 
    } 
    if($paged > 1 && $showitems < $pages) { 
     $paginationData .= '<a href="' .get_pagenum_link($paged - 1). '">&laquo;</a>'; 
    } 

    for ($i=1; $i <= $pages; $i++) { 
     if (1 != $pages &&(!($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems)) { 
      if($paged == $i){ 
       $paginationData .= "<span class='current'>".$i."</span>"; 
      } else { 
       $paginationData .= "<a href='".get_pagenum_link($i)."' class='inactive' >".$i."</a>"; 
      } 
     } 
    } 

    if ($paged < $pages && $showitems < $pages) { 
     $paginationData .= "<a href='".get_pagenum_link($paged + 1)."'>&rsaquo;</a>"; 
    } 
    if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) { 
     $paginationData .= "<a href='".get_pagenum_link($pages)."'>&raquo;</a>"; 
    } 
    $paginationData .= '</div>'; 
} 

return $paginationData; 

}

//次の関数は、ページにポートフォリオの要素が表示されます。再度、同じファイルに貼り付けます。

function agr_portfolio_func($atts) { 
extract(shortcode_atts(array(
    'agr_portfolio_style' => 'modern', 
    'agr_portfolio_category' => '', 
    'agr_portfolio_image_size' => 'cover', 
    'agr_portfolio_nr_columns' => 'col-md-6 col-xs-12', 
    'agr_portfolio_nr_posts' => '12', 
    'agr_portfolio_order' => 'DESC', 
    'agr_portfolio_order_by' => 'date', 
    'agr_portfolio_class' => '', 
), $atts)); 


if (get_query_var('paged')) { 
    $paged = get_query_var('paged'); 
} elseif (get_query_var('page')) { 
    $paged = get_query_var('page'); 
} else { 
    $paged = 1; 
} 
$type = 'portfolio-posts'; 
$post_per_page = $agr_portfolio_nr_posts; 


if ($agr_portfolio_category == '') { 
    $args = array(
     'post_type' => $type, 
     'post_status' => 'publish', 
     'posts_per_page' => $post_per_page, 
     'order' => $agr_portfolio_order, 
     'orderby' => $agr_portfolio_order_by, 
     'paged' => $paged 
    ); 
} else { 
    $args = array(
     'tax_query' => array(
      array(
       'taxonomy' => 'portfolio_categories', 
       'field' => 'slug', 
       'terms' => $agr_portfolio_category 
      ) 
     ), 
     'post_type' => $type, 
     'post_status' => 'publish', 
     'posts_per_page' => $post_per_page, 
     'order' => $agr_portfolio_order, 
     'orderby' => $agr_portfolio_order_by, 
     'paged' => $paged 
    ); 
} 

$wp_query = null; 
$wp_query = new WP_Query($args); 

$dataToReturn = '<div class="portoflio-list ' . $agr_portfolio_class . '">'; 
if ($wp_query->have_posts()) { 
    $totalPages = $wp_query->max_num_pages; 
    while ($wp_query->have_posts()) { 

     $wp_query->the_post(); 
     $title = get_post(get_post_thumbnail_id())->post_title; //The Title 
     $caption = get_post(get_post_thumbnail_id())->post_excerpt; //The Caption 
     $description = get_post(get_post_thumbnail_id())->post_content; // The Description 


     switch ($agr_portfolio_style) { 
      case "modern": 
       if (has_post_thumbnail()) { 
        $dataToReturn .= '<div id="post-' . get_the_ID() . '" class="' . join(' ', get_post_class($agr_portfolio_nr_columns)) . '">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" alt="' . $description . '" title="' . $title . '">'; 
        $dataToReturn .= '<div class="image-container" style="background-image: url(' . get_the_post_thumbnail_url() . ');background-size: ' . $agr_portfolio_image_size . '"></div>'; 
        $dataToReturn .= '</a>'; 
        $dataToReturn .= '<div class="content-container">'; 
        $dataToReturn .= '<h4 class="portfolio-title">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '">' . get_the_title() . '</a>'; 
        $dataToReturn .= '</h4>'; 
        $dataToReturn .= '</div>'; 
        $dataToReturn .= '</div>'; 
       } else { 
        $dataToReturn .= '<div id="post-' . get_the_ID() . '" class="' . join(' ', get_post_class($agr_portfolio_nr_columns)) . '">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" alt="' . $description . '" title="' . $title . '">'; 
        $dataToReturn .= '<div class="image-container border-img"><h5 class="no-image-available text-center">No Img Available</h5></div>'; 
        $dataToReturn .= '</a>'; 
        $dataToReturn .= '<div class="content-container">'; 
        $dataToReturn .= '<h4 class="portfolio-title">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" class="text-center">' . get_the_title() . '</a>'; 
        $dataToReturn .= '</h4>'; 
        $dataToReturn .= '</div>'; 
        $dataToReturn .= '</div>'; 
       } 
       break; 
      case "classic": 
       $content = get_the_content(); 
       $trimmed_content = wp_trim_words($content, 60, ' ...'); 
       $vcElementsToRemove = array(
        '[vc_row]', 
        '[/vc_row]', 
        '[vc_column]', 
        '[/vc_column]', 
        '[vc_column_text]', 
        '[/vc_column_text]', 
        '[vc_row_inner]', 
        '[/vc_row_inner]', 
        '[vc_column_inner width="1/2"]', 
        '[vc_column_inner width="1/3"]', 
        '[vc_column_inner width="1/4"]', 
        '[vc_column_inner width="1/6"]' 
       ); 
       $trimmed_content = str_replace($vcElementsToRemove, "", $trimmed_content); 

       if (has_post_thumbnail()) { 
        $dataToReturn .= '<div id="post-' . get_the_ID() . '" class="' . join(' ', get_post_class($agr_portfolio_nr_columns)) . '">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" alt="' . $description . '" title="' . $title . '">'; 
        $dataToReturn .= '<div class="image-container" style="background-image: url(' . get_the_post_thumbnail_url() . ');background-size: ' . $agr_portfolio_image_size . '"></div>'; 
        $dataToReturn .= '</a>'; 
        $dataToReturn .= '<div class="content-container">'; 
        $dataToReturn .= '<h4 class="portfolio-title">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '">' . get_the_title() . '</a>'; 
        $dataToReturn .= '</h4>'; 
        $dataToReturn .= '<p class="mt20">' . $trimmed_content . '</p>'; 
        $dataToReturn .= '</div>'; 
        $dataToReturn .= '</div>'; 
       } else { 
        $dataToReturn .= '<div id="post-' . get_the_ID() . '" class="' . join(' ', get_post_class($agr_portfolio_nr_columns)) . '">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" alt="' . $description . '" title="' . $title . '">'; 
        $dataToReturn .= '<div class="image-container border-img"><h5 class="no-image-available text-center">No Img Available</h5></div>'; 
        $dataToReturn .= '</a>'; 
        $dataToReturn .= '<div class="content-container">'; 
        $dataToReturn .= '<h4 class="portfolio-title">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '">' . get_the_title() . '</a>'; 
        $dataToReturn .= '</h4>'; 
        $dataToReturn .= '<p class="mt20">' . $trimmed_content . '</p>'; 
        $dataToReturn .= '</div>'; 
        $dataToReturn .= '</div>'; 
       } 
       break; 
      case "newspaper": 
       if (has_post_thumbnail()) { 
        $dataToReturn .= '<div id="post-' . get_the_ID() . '" class="' . join(' ', get_post_class($agr_portfolio_nr_columns)) . '">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" alt="' . $description . '" title="' . $title . '">'; 
        $dataToReturn .= '<div class="image-container" style="background-image: url(' . get_the_post_thumbnail_url() . ');background-size: ' . $agr_portfolio_image_size . '"></div>'; 
        $dataToReturn .= '</a>'; 
        $dataToReturn .= '<div class="content-container">'; 
        $dataToReturn .= '<h4 class="portfolio-title">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '">' . get_the_title() . '</a>'; 
        $dataToReturn .= '</h4>'; 
        $dataToReturn .= '</div>'; 
        $dataToReturn .= '</div>'; 
       } 
       break; 
      case "masonry": 
       if (has_post_thumbnail()) { 
        $dataToReturn .= '<div id="post-' . get_the_ID() . '" class="' . join(' ', get_post_class($agr_portfolio_nr_columns)) . '">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" alt="' . $description . '" title="' . $title . '">'; 
        $dataToReturn .= '<div class="image-container" style="background-image: url(' . get_the_post_thumbnail_url() . ');background-size: ' . $agr_portfolio_image_size . '"></div>'; 
        $dataToReturn .= '</a>'; 
        $dataToReturn .= '<div class="content-container">'; 
        $dataToReturn .= '<h4 class="portfolio-title">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '">' . get_the_title() . '</a>'; 
        $dataToReturn .= '</h4>'; 
        $dataToReturn .= '</div>'; 
        $dataToReturn .= '</div>'; 
       } 
       break; 
      default: 
       if (has_post_thumbnail()) { 
        $dataToReturn .= '<div id="post-' . get_the_ID() . '" class="' . join(' ', get_post_class($agr_portfolio_nr_columns)) . '">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '" alt="' . $description . '" title="' . $title . '">'; 
        $dataToReturn .= '<div class="image-container" style="background-image: url(' . get_the_post_thumbnail_url() . ');background-size: ' . $agr_portfolio_image_size . '"></div>'; 
        $dataToReturn .= '</a>'; 
        $dataToReturn .= '<div class="content-container">'; 
        $dataToReturn .= '<h4 class="portfolio-title">'; 
        $dataToReturn .= '<a href="' . esc_url(get_permalink()) . '">' . get_the_title() . '</a>'; 
        $dataToReturn .= '</h4>'; 
        $dataToReturn .= '</div>'; 
        $dataToReturn .= '</div>'; 
       } 
     } 
    } 
    $dataToReturn .= '<div class="col-md-12 col-xs-12 navigation text-center">'; 
    $dataToReturn .= agr_portfolio_pagination($totalPages); 
    $dataToReturn .= '</div>'; 
} else { 
    $dataToReturn .= '<div id="post-404" class="noposts text-center">'; 
    $dataToReturn .= '<p>' . _e('No Portfolio Item found.', THEME_TEXT_DOMAIN) . '</p>'; 
    $dataToReturn .= '</div>'; 
} 

wp_reset_postdata(); 

$dataToReturn .= '</div>'; 
return $dataToReturn; 

}

ステップ2 - のfunctions.phpにPHPファイルをロードし

include_once 'custom-portfolio.php'; 
ものfunctions.phpに、私は複数のビジュアルコンポーネント要素をロードする機能を作成しました//

function register_vc_shortcodes(){ 
     add_shortcode('custom_portfolio', 'agr_portfolio_func'); 
     add_shortcode('other_element', 'other_element_func'); 
     add_shortcode('other_element2', 'other_element_func2'); 
    } 
    add_action('init', 'register_vc_shortcodes'); 

重要な情報:このコードは動作するためには 1、カスタムポスト「register_post_type」は「ポートフォリオ・ポスト」でなければなりません 2.カテゴリ名「register_taxonomy」「portfolio_categories」 3でなければなりません自分の分類法でこれを変更することができます。

関連する問題