PlusOne Blog

「WordPress」に関する記事

【wordpress】投稿ページにiframeタグを挿入する

wordpressの投稿ページに他のHTMLを埋め込むために <ifarme> タグを挿入しても、
タグが挿入できません。
これは、権限によって<ifarme> にフィルターをかけているため、管理者・編集者・寄稿者の投稿ページには<ifarme> タグを挿入できません。
 
これをどの権限者でもiframeのフィルターを外すために、下記記述をfunction.phpに追記します。

add_filter('content_save_pre','test_save_pre');

function test_save_pre($content){
	global $allowedposttags;

	// iframeとiframeで使える属性を指定する
        $allowedposttags['iframe']=array('class'=>array(),'src'=>array(),
            'width'=>array(),'height'=>array(),'frameborder'=>array(),
            'scrolling'=>array(),'marginheight'=>array(),'marginwidth'=>array());

	return $content;
}

 
これで、管理者・編集者・寄稿者の投稿ページでも、 <ifarme> タグを挿入することができます。

この記事を読む

【wordpress】twitterカード ~設定編2~

前回はtwitterカードを設定する方法を紹介しました。
これは、ますは基本ということで、固定ページの場合の設定方法を紹介しました。
今回は、投稿ページの場合の設定方法を紹介します。
 

 
 
twitterカードを利用するには、以下のmetaをhead内に記述するので、
これを投稿ページ用に変更していきます。
=====================
<meta name=”twitter:card” content=”●●●●●●●●●” /> —①
<meta name=”twitter:site” content=”●●●●●●●●●”> —②
<meta name=”twitter:title” content=”●●●●●●●●●”> —③
<meta name=”twitter:description” content=”●●●●●●●●●”> —④
<meta name=”twitter:image” content=”●●●●●●●●●”> —⑤
=====================
 
①表示するtwitterカードの形式
 ★→これは、投稿内容に依存しないので、そのまま「summary」または「summary_large_image」を記述します。
 =====================
 (例)
 <meta name=”twitter:card” content=”summary” />
 =====================
 
②Twitterのユーザー名
 ★→これも、投稿内容に依存しないので、そのままtwitterにユーザー名を記述します。
 =====================
 (例)
 <meta name=”twitter:site” content=”@p1tweet1″>
 =====================
 
③Twitterカードに表示されるタイトル
 ★→投稿ページのタイトルを表示させたいので、テンプレートタグ「the_title()」を使って投稿ページのタイトルを取得して記述します。
 =====================
 (例)
 <?php if ( have_posts() ) : ?>
   <meta name=”twitter:title” content=”<?php the_title(); ?>” />
 <?php endif; ?>
 =====================
 
④Twitterカードに表示される説明文
 ★→投稿ページの内容を表示させたいので、テンプレートタグ「get_the_excerpt()」を使って投稿ページの内容を抜粋して取得して記述します。(テンプレートタグ「the_excerpt() 」を使用すると、pタグが付いてくるので、Pタグが付いてない「get_the_excerpt()」を使用します。)
 ★→テンプレートタグ「get_the_excerpt()」の使いかたに注意が必要です。
  ・ループの中で使用する必要があります。
  ・echo で取得内容を表示する必要があります。
 =====================
 (例)
 <?php if ( have_posts() ) : ?>
  <?php while( have_posts() ) : the_post(); ?>
   <meta property=”twitter:description” content=”<?php echo get_the_excerpt(); ?>” />
  <?php endwhile;?>
 <?php endif; ?>
 =====================
 
⑤Twitterカードに表示される画像
 ★→投稿ページのアイキャッチ画像を表示させたいので、次のように記述します。
 ★→アイキャッチ画像を設定したない場合は、指定の画像が表示されるようにします。
 =====================
 (例)
 <?php if ( have_posts() ) : ?>
  <meta name=”twitter:image” content=”<?php
   if(has_post_thumbnail( $post->ID )):
    $thumbnail_id = get_post_thumbnail_id();
    $thumbnail_img = wp_get_attachment_image_src( $thumbnail_id , ‘thumbnail’ );
    echo $thumbnail_img[0];
   else:
    echo bloginfo(‘template_url’) . “/img/noimage.png”;
   endif;
  ?>” />
 <?php endif; ?>
 =====================
 
 
①~⑤をまとめると下記のようになります。
 =====================
 <meta name=”twitter:card” content=”summary” />
 <meta name=”twitter:site” content=”@p1tweet1″>
 <?php if ( have_posts() ) : ?>
  <?php while( have_posts() ) : the_post(); ?>
   <meta name=”twitter:title” content=”<?php the_title(); ?>” />
   <meta property=”twitter:description” content=”<?php echo get_the_excerpt(); ?>” />
   <meta name=”twitter:image” content=”<?php
    if(has_post_thumbnail( $post->ID )):
     $thumbnail_id = get_post_thumbnail_id();
     $thumbnail_img = wp_get_attachment_image_src( $thumbnail_id , ‘thumbnail’ );
     echo $thumbnail_img[0];
    else:
     echo bloginfo(‘template_url’) . “/img/noimage.png”;
    endif;
   ?>” />
  <?php endwhile;?>
 <?php endif; ?>
=====================
 
 
実際にどのようにtwitterカードが表示されるかを、次のサイトで確認します。
Card validator

この記事を読む

【wordpress】twitterカード ~設定編~

前回はtwitterカードについて紹介しました。
今回は、そのtwitterカードを設定する方法を紹介します。
 
 
head内にmetaタグとして、下記の記述を追加する。
=====================
<meta name=”twitter:card” content=”●●●●●●●●●” /> —①
<meta name=”twitter:site” content=”●●●●●●●●●”> —②
<meta name=”twitter:title” content=”●●●●●●●●●”> —③
<meta name=”twitter:description” content=”●●●●●●●●●”> —④
<meta name=”twitter:image” content=”●●●●●●●●●”> —⑤
=====================
 

表示するtwitterカードの形式を設定します。
カードの種類ごとに下記値を入れます。
Summary Card(画像が小さいカード)は「summary」を、summary_large_image(画像が大きいカード)は「summary_large_image」を設定します。
=====================
(例)
<meta name=”twitter:card” content=”summary” />
=====================
 

Twitterのユーザー名を指定します。
=====================
(例)
<meta name=”twitter:site” content=”@p1tweet1″>
=====================
 

Twitterカードに表示されるタイトルを設定します。
=====================
(例)
<meta name=”twitter:title” content=”株式会社プラスワン”>
=====================
 

Twitterカードに表示される説明文を設定します。
文字数制限はありませんが、実際にtwitterカードに表示される文字数までしか表示されません。
=====================
(例)
<meta name=”twitter:description” content=”株式会社プラスワンは介護保険業務支援ソフトウェア「SmileOneシリーズ」の開発、販売を行っています。”>
=====================
 

Twitterカードに表示される画像を設定します。
=====================
(例)
<meta name=”twitter:image” content=”/img/SmileLauncher.jpg”>
=====================
 
①~⑤をまとめると下記のようになります。
=====================
<meta name=”twitter:card” content=”summary” />
<meta name=”twitter:site” content=”@p1tweet1″>
<meta name=”twitter:title” content=”株式会社プラスワン”>
<meta name=”twitter:description” content=”株式会社プラスワンは介護保険業務支援ソフトウェア「SmileOneシリーズ」の開発、販売を行っています。”>
<meta name=”twitter:image” content=”/img/SmileLauncher.jpg”>
=====================
 
★→これをhead内に記述します。
 
 
実際にどのようにtwitterカードが表示されるかを、次のサイトで確認できます。
Card validator

この記事を読む

【Microsoftから Internet Explorer 11 サポート終了までのスケジュールが発表】

Microsoftから、IE11(Internet Explorer 11)サポート終了までのスケジュールが発表されました。
https://techcommunity.microsoft.com/t5/microsoft-365-blog/microsoft-365-apps-say-farewell-to-internet-explorer-11-and/ba-p/1591666

===================================
2020年11月30日、Microsoft TeamsのWebアプリはIE11をサポートしなくなります。
2021年3月9日、Microsoft Edge Legacy(Windows10のデフォルトブラウザ)をサポートしなくなります。
2021年8月17日、Microsoft 365のアプリとサービスはIE11をサポートしなくなります。
===================================

 

 

★→弊社は、従来よりWEBアプリ、ホームページともにモダンブラウザ(chrome,safari等)を推奨しており、
Internet Explorer 11やMicrosoft Edge Legacyは推奨しておりませんが
今回のMicrosoftからの発表により、より積極的にモダンブラウザへの切り替えを勧めて参ります。

この記事を読む
記事一覧に戻る