タグ

ブックマーク / techmemo.biz (184)

  • WordPressでis_front_pageやis_homeなどの条件分岐タグが効かない時の対処法 | TechMemo

    footer.php内でis_front_page()を使って、トップページのみ読み込むコンテンツを設置したかったのですが、なぜか条件分岐タグが効かなくてうまく表示されないという事象に遭遇しました。 結構ハマってしまったのですが、無事解決したので、条件分岐タグが効かない時の対処法についてご紹介したいと思います。 WordPressで条件分岐タグが効かない時の対処法 footer.phpに以下のような条件分岐を記述していました。 <?php if(is_front_page()): ?> トップページだけに表示するコンテンツ <?php endif; ?> 最初はちゃんと動作していたのですが、テーマのトップページを作成中に急に表示されなくなりました。そこで、トップページ内の記述を少しずつ削除しながら確認したら、トップページ内に記事一覧のループ処理があると条件分岐タグが効かなくなるようでした。

    WordPressでis_front_pageやis_homeなどの条件分岐タグが効かない時の対処法 | TechMemo
  • [WordPress]wp_head()のいらないタグを削除してをスッキリさせる方法 | TechMemo

    WordPressを使ってサイトを作成すると、自動的に<head>に追加される項目がいくつかあります。自動で追加されるメタ情報などのタグは、テーマファイルのheader.phpをみてもらうとわかりますが、wp_head()というWordPressの関数で呼び出しています。 header.phpを見ると、以下のような記述がありませんか?この部分がタグの情報を呼び出しているんです。 <?php wp_head(); ?> でも、追加されるタグの中にはいらないものも結構あるんですよね。 今回はいらないタグを削除してヘッダーをすっきりさせる方法をご紹介いたします。 wp_headの情報はどこから読み込んでいるのか wp_head()で呼び出されるタグは、/wp-includes/default-filters.php に記述されています。default-filters.phpを開くと、以下のような

    [WordPress]wp_head()のいらないタグを削除してをスッキリさせる方法 | TechMemo
  • YouTubeなどのiframe埋め込み動画をレスポンシブにする方法 | TechMemo

    YouTubeなどのiframeで埋め込む動画をレスポンシブに対応させる方法を紹介します。 以前、「たった1行追加するだけでYouTubeの埋め込み動画をレスポンシブに対応させる方法」という非常に簡単な方法を紹介しましたが、あくまで簡易的な対応方法なので、横幅が小さくなるにつれて高さが間延びしてしまいます。 今回は、高さもしっかりとレスポンシブに対応する方法を紹介したいと思います。 ステップ1. 埋め込みコードにクラスを付与する まずは、埋め込みコードにクラスを付与してあげます。 通常は、以下のような埋め込みコードになっているかと思います。 <iframe width="560" height="315" src="//www.youtube.com/embed/vyGiIZkPjiI" frameborder="0" allowfullscreen></iframe> これをdiv要素で

    YouTubeなどのiframe埋め込み動画をレスポンシブにする方法 | TechMemo
  • たった1行追加するだけでYouTubeの埋め込み動画をレスポンシブに対応させる方法

    ブログに YouTube の動画を埋め込んでいる人は多いと思います。また、最近ではサイトにレスポンシブデザインを採用している人も多いと思います。WordPress でもレスポンシブに対応したテーマが多くリリースされていますね。 レスポンシブデザインのブログに YouTube 動画を埋め込むと、スマートフォンでサイトを見た時に動画が画面からはみ出てしまうことがあります。 埋め込みコードを使って YouTube の動画を埋め込んだ場合、iframe を使って動画を表示します。この iframe の幅が 560px などに指定されているためスマートフォンで表示した時に画面からはみ出してしまうのです。 そんな YouTube 動画をレスポンシブに対応させる方法として、div などで動画のコードを囲って CSS クラスを付与して調整する方法がよく紹介されていますが、毎回 HTML ソースを書き換える

    たった1行追加するだけでYouTubeの埋め込み動画をレスポンシブに対応させる方法