PHPモジュールでCSSのインライン化

PHPモジュールを使って、CSSのインライン化を行ってみます。

今回の説明ではサイトIDをsiteにして話を進めます。


始めに公開側ページのテンプレートにcms:moduleのタグを追加します。

<!-- cms:module="css.inline" --><link rel="stylesheet" href="/site/css/style.css"><!-- /cms:module="css.inline" -->

続いて、上記のモジュールのタグに該当するファイルを作成します。

/ドキュメントルート/site/.module/css/inline.php

inline.phpのファイルに下記のコードを記述します。

<?php
function soycms_inline(string $html, HTMLPage $htmlObj){
	// CSSの読み込み用の便利な関数群を読み込んでおく
	if(!function_exists("soycms_compile_scss")) SOY2::import("site_include.func.css", ".php");

	$path = _SITE_ROOT_ . "/css/style.css";	
	echo "<style>".soycms_compress_css_by_filepath($path)."</style>\n";
}
?>

これでCSSのインライン化は終了です。

style.cssに記述された内容を圧縮した後に公開側ページのHTMLに挿入します。


ちなみに便利な関数群のファイルは

/ドキュメントルート/CMSインストールディレクトリ/common/site_include/func/css.php

になります。

https://github.com/inunosinsi/soycms/blob/master/cms/common/site_include/func/css.php

同じカテゴリーの記事