質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

Q&A

解決済

1回答

2156閲覧

Wordpress : Twitter Card画像のぼやけ

Naokoro

総合スコア19

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

0グッド

0クリップ

投稿2018/04/05 13:15

こんばんは、Wordpress初心者です。

ブログ(Wordpress)のサムネイル画像をTwitterで表示させる際に画像がぼやけてしまいます。
(Card validator上でもぼやけてしまいます。)
解決方法をご存知の方がいらっしゃいましたらご教授いただけますと幸いです。

対象ブログ:http://availability89.com/
header.phpのコードは以下の通りです。

下記画像の最終行で画像が自動的に150×150にリサイズされていることがわかりました。
Wordpressにアップロードしたままの画像サイズでサムネイルに使用するには
どのようにコードを追記すればよいでしょうか?

イメージ説明

お手数おかけいたしますがよろしくお願いいたします。

【header.php】

<html <?php language_attributes(); ?>> <head> <?php ////////////////////////////////// //ウェブマスターツール用のID表示 ////////////////////////////////// if ( get_webmaster_tool_id() ): ?> <meta name="google-site-verification" content="<?php echo get_webmaster_tool_id() ?>" /> <?php endif;//ウェブマスターツールID終了 ?> <meta charset="<?php bloginfo('charset'); ?>"> <?php //ビューポート //モバイルもしくはページキャシュモードの時 if ( is_mobile() || is_responsive_enable() || is_page_cache_enable() ): ?> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <?php else: ?> <meta name="viewport" content="width=1280, maximum-scale=1, user-scalable=yes"> <?php endif ?> <link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" /> <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> <?php //AMPの案内タグを出力 if ( has_amp_page() ): ?> <link rel="amphtml" href="<?php echo get_amp_permalink(); ?>"> <?php endif ?> <?php //Wordpressのバージョンが4.1以下のとき if ( get_wordpress_version() < 4.1 ): get_template_part('header-title-tag'); endif; ?> <?php get_template_part('header-seo');//SEOの設定テンプレート?> <?php //wp_enqueue_script('jquery');//jQueryの読み込み?> <?php wp_head(); ?> <?php the_apple_touch_icon_tag();//Appleタッチアイコンの呼び出し ?> <?php if ( is_facebook_ogp_enable() ) //Facebook OGPタグ挿入がオンのとき get_template_part('header-ogp');//Facebook OGP用のタグテンプレート?> <?php if ( is_twitter_cards_enable() ) //Twitterカードタグ挿入がオンのとき get_template_part('header-twitter-card');//Twitterカード用のタグテンプレート?> <?php get_template_part('header-insert');//ユーザーが子テーマからヘッダーに何か記述したい時に利用するテンプレート?> <?php get_template_part('head-custom-field');//カスタムフィールドの挿入(カスタムフィールド名:head_custom)?> </head> <body <?php body_class(); ?> itemscope itemtype="http://schema.org/WebPage"> <div id="container"> <!-- header --> <header itemscope itemtype="http://schema.org/WPHeader"> <div id="header" class="clearfix"> <div id="header-in"> <?php if(is_single()): ?> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@naosukenya" /> <meta name="twitter:title" content="<?php the_title(); ?>" /> <meta name="twitter:description" content="<?php echo get_post_meta($post->ID, _aioseop_description, true); ?>" /> <meta name="twitter:image" content="<//php echo catch_that_image(); ?>" /> <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 ""; endif; ?>" /> <?php endif; ?> <?php //カスタムヘッダーがある場合 // $h_top_style = ''; // if (get_header_image()){ // $h_top_style = ' style="background-image:url('.get_header_image().')"'; // } ?> <div id="h-top"<?php //echo $h_top_style; ?>> <?php get_template_part('button-menu'); //モバイルメニューボタンの呼び出し?> <div class="alignleft top-title-catchphrase"> <?php get_template_part('header-logo');?> </div> <div class="alignright top-sns-follows"> <?php if ( is_top_follows_visible() ): //トップのフォローボタンを表示するか?> <?php get_template_part('sns-pages'); //SNSフォローボタンの呼び出し?> <?php endif; ?> </div> </div><!-- /#h-top --> </div><!-- /#header-in --> </div><!-- /#header --> </header> <?php if (is_navi_visible())://ナビゲーションが表示のとき get_template_part('navi');//グローバルナビのためのテンプレート endif; ?> <!-- 本体部分 --> <div id="body"> <div id="body-in" class="cf"> <?php get_template_part('before-main'); //メインカラムの手前に挿入するテンプレート(3カラム作成カスタマイズ時などに) ?> <!-- main --> <main itemscope itemprop="mainContentOfPage"> <div id="main" itemscope itemtype="http://schema.org/Blog">

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

PHP

1// $thumbnail_img = wp_get_attachment_image_src( $thumbnail_id , 'thumbnail' ); 2// ↓ 3 $thumbnail_img = wp_get_attachment_image_src( $thumbnail_id , 'large' );

【wp_get_attachment_image_src – WordPress私的マニュアル】
https://elearn.jp/wpman/function/wp_get_attachment_image_src.html

投稿2018/04/05 15:26

kei344

総合スコア69400

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Naokoro

2018/04/06 11:12

お答えいただきありがとうございました! 無事に修正することができました。 本当にありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問