「表示」タグアーカイブ

SANGOで、投稿のカテゴリーを複数登録し、ちゃんと複数カテゴリー表示させる方法 WordPress BuddyPressカスタマイズメモ

WordPressのサンゴテンプレートで記事投稿のカテゴリーを複数選択しても、1個しか表示されない件

サンゴのテンプレートでカテゴリーを複数個選択しても…

左上のオレンジの楕円の部分がカテゴリ名だが、
↓こんな感じで、1個目のカテゴリーしか投稿記事の画面では表示されない

これを、↓こんな風に、ちゃんと複数個表示させる。


 

functions.phpへの記述

色々な記述方法が考えらえるが、元々のSANGOの記述をできるだけ踏襲する形で書く。

//カテゴリーを記事一覧に複数表示
function output_catogry_link() {
 $cat = get_the_category();
 if (!$cat) {
  return false;
 }
 if ($cat) {
 $i = 0;
 foreach( $cat as $category) {
 $catId = $category->cat_ID;
 $catName = esc_attr($category->cat_name);
 $catLink = esc_url(get_category_link($catId));
 if ($catLink && $catName) {
  echo '<a class="dfont cat-name catid' . $catId . ' cat-multi' . $i . '" href="' . $catLink . '">' . $catName . '</a>' ;
  }
  $i = $i + 1;
  if ( $i >= 8 ) {
   break;
  }
  }//foreach
 }//if($cat)
 }

カテゴリーがある分だけ取得して、ソースとして吐き出されるので、ソースはこんな感じ。

<a class="dfont cat-name catidXX1 cat-mult0" href="カテゴリー1へのリンクURL">1のカテゴリー名</a>
<a class="dfont cat-name catidXX5 cat-mult1" href="カテゴリー5へのリンクURL">5のカテゴリー名</a>
<a class="dfont cat-name catidXX6 cat-mult2" href="カテゴリー6へのリンクURL">6のカテゴリー名</a>
...

classにclass に “cat-multi$i” ($iは変数でカテゴリのー数0から数字が順番に入る)

cat-multi数字 にCSSで配置を指定してやればいい。

なお、スペースの関係上、今回は上限を8個としている。
 

CSS (管理画面→外観→CSS編集→追加CSS)への記述

.cat-multi0{
 top: 3px !important;
}
.cat-multi1{
 top: 27px !important;
}
.cat-multi2{
 top: 51px !important;
}
.cat-multi3{
 top: 75px !important;
}
.cat-multi4{
 top: 99px !important;
}
.cat-multi5{
 top: 123px !important;
}
.cat-multi6{
 top: 147px !important;
}
.cat-multi7{
 top: 171px !important;
}

で、こんな風になる。

今回は上から下に並べているが、色を変えたり、横にずらしたりと色々できるはず。

この記事も読まれています

Sangoの著者ページ「author/…」でその著者の投稿が無いと、アバターが正しく表示されないバグ修正 WordPress BuddyPressカスタマイズメモ

サンゴのバグ修正、著者ページで投稿がないとアバターやプロフィールが表示されない

そのユーザー(著者)の投稿した記事があれば、記事一覧の上に、アバターの写真とユーザー名、プロフィールの詳細が表示されるが…

投稿した記事がない場合は、アバターもデフォルトのものになるし、プロフィールの詳細が表示されない…


 

修正するファイル

wp-content/themes/sango-theme/parts/archive に入っている

archive-header.php

がこれにあたる。

これを同じ階層で子テーマにコピペで突っ込む。
 

修正する箇所

元の4行目あたり

 <p class="author_page_img">
  <?php
   //著者画像
   $iconimg = get_avatar( get_the_author_meta( 'ID' ), 125 );
   if($iconimg) echo $iconimg;
  ?>
 </p>

 ↓↓↓

 <p class="author_page_img">
   <?php
   //著者画像
   $iconimg = get_avatar( get_the_author_meta('ID',$author) );
   if($iconimg) echo $iconimg;
  ?>
 </p>

get_avatar( get_the_author_meta( ‘ID’ ), 125 );

だと、その記事の著者になってしまうので、

$iconimg = get_avatar( get_the_author_meta(‘ID’,$author) );

として、そのURL author/userID の userID 部分の人のアバターを取得するように変更。

次にプロフィールの詳細の部分で、記事投稿がない場合には、別途プロフィールの詳細を表示させる。(投稿がある場合は、従来のSANGOのテンプレのものがそのまま表示される)

 <h1 class="dfont">
  <?php echo esc_attr(get_the_author_meta('display_name',$author)); ?> <?php fa_tag("check-circle","check-circle",false) ?>
 </h1>
 <?php else : //著者ページ以外?>
 <h1>
  <?php
   if( output_archive_title() ){

 ↓↓↓

 <h1 class="dfont">
  <?php echo esc_attr(get_the_author_meta('display_name',$author)); ?> <?php fa_tag("check-circle","check-circle",false) ?>
 </h1>
 <?php 
  if( !have_posts() ) { //投稿がない場合以下を実行
   echo '<div class="taxonomy-description entry-content">'.strip_tags(get_the_author_meta( 'description', get_the_author_meta('ID',$author) )).'</div>'; // プロフィールの詳細を表示
  }
 ?>
 <?php else : //著者ページ以外?>
  <h1>
   <?php
    if( output_archive_title() ){

これで、記事がなくてもプロフィールアバターとプロフィールの詳細が表示される。

BuddyPressのメンバーのタイトルの名前(ユーザーID)に「さん」を追加したり、記事一覧の表示文を追加する方法(SANGOテーマ) WordPress カスタマイズメモ

自分が、人の記事に書いたコメントだけをまとめて表示するページを作る

WordPressのSNSプラグイン、BuddyPressを導入すると不特定多数のメンバーが参加することになる。

サンゴのテーマの「著者ページ」のタイトルでは、例えばユーザー名が「タツロウ」だとすると、「タツロウが書いた投稿 | ブログ名のような感じになる。

これに「さん」を追加して「タツロウさんが書いた投稿」にしたい。

ついでにカテゴリーページのタイトルなども変更しておく。
 

functions.php へ記述

//メンバーのタイトルに名前追加

function sango_document_title_parts( $title_part ) {
if (is_author()) {
$title_part['title'] .= 'さん'; //サンゴの「著者ページ」でタイトルに「さん」追加
} elseif (is_archive()) {
$title_part['title'] = '「' . $title_part['title'] . '」 記事一覧'; //カテゴリーやタグページでタイトルに「記事一覧」を追加
}
return $title_part;
}
add_filter( 'document_title_parts', 'sango_document_title_parts' );

この記事も読まれています

WordPress をAMP化した時に アドセンスのエラーで表示されないのを修正する手順

WordPress を公式プラグインでAMP対応にしてみた

公式プラグイン名はその名も AMP

公式プラグインだけあって、AMP化は概ね問題ないはず。

AMP化後24時間以内に、Googleから New AMP issues detected for site https://xxxx.net/ のようなタイトルで、AMPページの問題点が送られてくることがある。

まず広告を掲載する前に、このエラーを解決していく必要がある。

AMPページの問題を一つずつ解決していく

問題があると言われたページを下記のURLで張り付けてテストをすると。

https://search.google.com/test/amp

色々なエラーを教えてくれる。

WordPressで代表的なエラー(簡単に直せるもの)を2個程紹介。

Error in required structured data element
これは、ファビコンが無い場合に出るエラー。

エラー詳細を確認すると、logo 部分に、A value for the logo field is required と言われている。

管理画面→外観→カスタマイズ→サイト基本情報→サイトアイコンに適当な正方形の画像をアップロードすることで解決できる。

Image size smaller than recommended size
これは、AMPページ内に使っている画像ファイルの大きさ(容量ではなくサイズ)が小さい時にでるエラー。

該当ページの小さい画像を大きいものに差し替える必要がある。

Google的推奨サイズは横幅1200px以上でなかなかのハードルの高さ。

なお、画像の両サイドに白い部分を塗り足す等の対応でもOKだとGoogle公式ページで紹介されている。
 

AMP用 Googleアドセンスの追加

まずAMP用のGoogle Adsenseには大きく2種類ある。

自動広告と、従来のテキスト広告だ。

自動広告は、コードを、WordpressのAMP用テンプレートのヘッダーとフッターに記述しておくと、自動的に文中に広告を入れていってくれる。

自動広告貼り付け手順は Google Adsense の広告コード取得の画面で丁寧に説明してくれているので割愛。

WordPressのfunctions.phpを編集して、テンプレートのヘッダーとフッターにコードを入力させるのを忘れずに。
 

テキスト広告は、従来のアドセンスと同じように、自分で1つずつ、表示する場所にコードを貼り付けていく。

AMPのテンプレートファイルを編集する必要があるので、AMPテンプレートを子テーマ化しておかなければならない。

子テーマフォルダ(wp-content/themes/…)の中に amp フォルダを作ってその中に amp 用テンプレートを入れる。

記事部分に広告を挿入するなら
(wp-content/themes/子テーマフォルダ名/amp/single.php) のような形にする。

single.php の広告を表示したい場所に、Googleアドセンスで取得した、広告コードをコピペして完成。
 

広告を貼り付けたらまたエラーが来た場合

広告を入れてから表示されるまでに30分ぐらいと言われるが、実際には数時間必要な場合もある。

広告を入れた後にエラーが出る場合は、いつまでたっても表示されない(24時間以内にGoogleからAMPの問題点のメールが来る)。

The tag ‘amp-ad extension .js script’ is missing or incorrect, but required by ‘amp-ad’. This will soon be an error.
amp-ad 拡張タグのJSスクリプトが存在しないか正しくありませんが、amp-ad には必要です。これはまもなくエラーになるでしょう。

というエラーが出た場合。

これは広告タグを貼り付けているのに、必要なjsファイルをヘッダーに追加できていない場合に表示される。

この場合は、前述のfunctions.phpを編集するのと同じ要領で、

<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>

このコードをAMPテンプレートのヘッダーに挿入することで修正可能。

メディアからアップロードした画像は、ライブラリでもアップロードした投稿者本人しか見えないようにする WordPress BuddyPressカスタマイズメモ

ップロードした画像は、アップロードした投稿者本人しか見えないようにする

WordPressのSNSプラグイン、BuddyPressを導入すると不特定多数のメンバーが参加することになる。

管理者ではなく、参加するメンバーが記事を投稿した場合、誰でも全員の投稿を見れるようになっているのをカスタマイズして、自分の投稿のみ表示するようにした。

投稿者の「投稿画面」では、自分の投稿のみ表示させる方法で紹介した。

でも、そのままでは、アップロードした画像などのメディアが全て見えてしまうので、そこを修正。


 ↓↓↓

 

functions.php へ記述

//upした画像は自分のみ表示

function show_only_authorimage( $where ){
global $current_user;
if(is_admin()){ //管理画面
if(current_user_can('author') ){ //投稿者権限の場合のみ
if( isset( $_POST['action'] ) && ( $_POST['action'] == 'query-attachments' ) ){
$where .= ' AND post_author='.$current_user->data->ID; //UPした人のIDと今のIDが同じ場合のみ表示
}}}
return $where;
}
add_filter( 'posts_where', 'show_only_authorimage' );

これで自分でアップロードした画像のみ表示される(上の例では投稿者権限の場合のみ)。
 

合わせて変更が必要なカスタマイズ案

投稿者の「投稿画面」では、自分の投稿のみ表示させる方法

自分のもののみの投稿数を取得して、記事数に代入

こちらも参照。

投稿一覧の投稿数は、自分のもののみ表示にして、自分の投稿数を取得して表示する WordPress BuddyPressカスタマイズメモ

投稿一覧画面で、自分の投稿数のみカウントして表示する

WordPressのSNSプラグイン、BuddyPressを導入すると不特定多数のメンバーが参加することになる。

管理者ではなく、参加するメンバーが記事を投稿した場合、誰でも全員の投稿を見れるようになっているのをカスタマイズして、自分の投稿のみ表示するようにした。

投稿者の「投稿画面」では、自分の投稿のみ表示させる方法で紹介した。

でも、そのままでは、投稿数が変になるので、そこを修正。


 ↓↓↓

 

functions.php へ記述

wp_count_postsで、投稿一覧のページで表示される記事数

//自分の投稿のみの投稿数を取得してその数に代入して表示

function count_author_posts( $counts, $type = 'post', $perm = '' ) {
 if ( !is_admin() || current_user_can('administrator') ) {
  return $counts; //管理者や管理画面じゃない場合はそのまま出力
 }
 global $wpdb;
 if ( ! post_type_exists( $type ) )
  return new stdClass;
 $cache_key = _count_posts_cache_key( $type, $perm ) . '_author';
 $counts = wp_cache_get( $cache_key, 'counts' );
 if ( false !== $counts ) {
  return $counts;
 }
 $query = "SELECT post_status, COUNT( * ) AS num_posts FROM {$wpdb->posts} WHERE post_type = %s";
 $query .= $wpdb->prepare( " AND ( post_author = %d )", get_current_user_id() );
 $query .= ' GROUP BY post_status';
 $results = (array) $wpdb->get_results( $wpdb->prepare( $query, $type ), ARRAY_A );
 $counts = array_fill_keys( get_post_stati(), 0 );
 foreach ( $results as $row ) {
  $counts[ $row['post_status'] ] = $row['num_posts'];
 }
 $counts = (object) $counts;
 wp_cache_set( $cache_key, $counts, 'counts' );
 return $counts;
}
add_filter( 'wp_count_posts', 'count_author_posts', 10, 3 );

これで投稿数を、自分の投稿のみをカウントして出力できる。
 

合わせて変更が必要なカスタマイズ案

投稿者の「投稿画面」では、自分の投稿のみ表示させる方法

・upした画像は投稿者本人しか見えないようにする

こちらも参照。

投稿者の「投稿画面」では、自分の投稿のみ表示させる方法 WordPress BuddyPressカスタマイズメモ

投稿者の「投稿」では、自分の投稿のみ表示させる(他ユーザーの投稿は管理画面の投稿一覧では見えない)

WordPressのSNSプラグイン、BuddyPressを導入すると不特定多数のメンバーが参加することになる。

管理者ではなく、参加するメンバーが記事を投稿した場合、誰でも全員の投稿を見れるようになっているし、誰でも編集ができる。


 ↓↓↓

 

functions.php へ記述

pre_get_postで、投稿一覧を取得する時に、今ログインしている、ユーザーの投稿だけを格納するように変更する。

//投稿一覧に自分の投稿のみ表示させる

function pre_get_author_posts( $query ) {
 if ( is_admin() && !current_user_can('administrator') && $query->is_main_query() //管理画面で、管理者ではない場合
  && ( !isset($_GET['author']) || $_GET['author'] == get_current_user_id() ) ) {
  $query->set( 'author', get_current_user_id() ); //今の著者のものだけを格納する
  unset($_GET['author']);
 }
}
add_action( 'pre_get_posts', 'pre_get_author_posts' );

上記の例だと、administrator は除外していて、全員の投稿を見ることができる。

編集者の場合だと、 editor など、適宜変更可能。
 

合わせて変更が必要なカスタマイズ案

自分のもののみの投稿数を取得して、記事数に代入

・upした画像は投稿者本人しか見えないようにする

こちらも参照。

投稿一覧の画面にアイキャッチ画像を表示させるプラグイン – WordPress

WordPressのダッシュボードに、アイキャッチ画像/Featured imageを、投稿一覧/All Posts画面に表示させよう

 
Wordpressの管理画面の、投稿一覧のページには、通常は、タイトル、作成者、カテゴリー、タグ、コメント、日時のみが表示されている。

ここにアイキャッチ画像のサムネイルを追加しよう。
 

サムネイル追加の方法はたくさんあるが…プラグインが一番簡単

functions.phpに記述する方法もあり、それほど難しくないのだが、今回は最も簡単で、最もWordpressっぽい、プラグインによる方法を紹介。

 
plugin-new
WordPress管理画面の左メニュー「プラグイン」>「新規追加」をクリック。
 

plugin-3
画面右側の検索ボックスに「Featured image to All-Posts」と書いて検索。
 
プラグイン「Featured image to All-Posts」で、「いますぐインストール」をクリック。
 
インストール完了画面が表示されたら、「プラグインを有効化」をクリック。

これでおしまい。アイキャッチ画像追加表示に設定はありません。

eyecatch
管理画面の、投稿一覧にアイキャッチ画像のサムネイルが追加されます。