とあるweb屋の仕事術

10年以上現役のweb製作屋さん。web製作雑務全部やる。

絶対に役に立つ。Webデザイナーが知ってるとはかどるPHP「include」

絶対に役に立つ。 Webデザイナーが 知ってるとはかどるPHP 「include」

絶対に役に立つ、Webデザイナーが知ってると

はかどるPHPシリーズ。

本日は別のファイルを読み込むのに捗るPHPです。

 

Webサイトの開発・実装では

ソースコードの視認性が重要です。

視認性がよければ作業スピードも早くなり

みんなしあわせになれる。

 

PHPのincludeを駆使することで、

複雑なソースコードをパーツに切り出して

外部ファイル化し、読み込むということが

できるので積極的に使っていきたいPHPです。

 

僕はソースコードが長くなったらすぐに

パーツに切り出してPHPでincludeするように

しています。

ソースコードがシンプルになるのでデバッグもしやすい。

では、さっそくコードです。

 

<?php include('./hoge.html'); ?>
 

たとえばHTMLの<head>〜</head>って

metaタグがずらずらと結構長くなったりしますよね。

その部分だけをパーツ化しておく、という

ような使い方をしたりできます。

 

<!doctype html>
<html>
<head> <?php include('./head_tag.html'); ?>
</head> <body> ここにいろんなソース ほげほげほげ〜 </body> </html>
 
そして肝心の<head>タグのHTMLはこんなかんじ。

 

<meta charset="utf-8">
<title>タイトル</title>
<link rel="stylesheet" href="/css/style.css">
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
<meta name="description" content="{{ 説明文 }}">
<meta name="keywords" content="{{ キーワード,キーワード }}">
<meta name="format-detection" content="telephone=no,email=no,address=no">
<meta property="og:type" content="website">
<meta property="og:title" content="{{ タイトル }}">
<meta property="og:description" content="{{ 説明文 }}">
<meta property="og:url" content="{{ ページURL }}">
<meta property="og:image" content="{{ 絶対パス }}/img/ogp.jpg">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@{{ twitter id }}">
<meta name="twitter:creator" content="@{{ twitter id }}">
<link rel="icon" type="shortcut icon" href="/favicon.ico">
<link rel="apple-touch-icon" sizes="{size}" href="/img/common/apple-touch-icon.png">
:
:
 

より具体的に include を詳しく解説している

サイトがありましたので、紹介しておきます。

下記のサイトを参考にしてもらうといい思います。

書きたいことがすべてまとまっていた...

車輪の再発明はしないという考えで、

本ブログでの詳細の解説はサボります。

 

すばらしい記事。

PHPの基本!外部ファイルを読み込んで使いまわす方法 | WEB改善事例集(GMOソリューションパートナー株式会社)

 

metaタグのサンプルソースは

こちらをパクらせていただきました。

色々あるHTMLのmetaタグなど一覧 - Qiita

 

 それではよきPHPライフを!