Webこの記事タイトルだと分かりづらいな。『SEOやユーザビリティの為に、絞り込みや並べ替え条件によってユニークな文言を表示する際に、複雑なif文のHTMLファイルのインデントや改行は残して可読性を維持したまま、ソース上では余計な余白を取り除いて1行に表示するSmartyの便利な{strip}タグ』が、正式な記事タイトル!今日していた仕事で、便利~な小技を知ったのでメモ。うちの会社はサイト構築にSmartyを使っています。Smartyと言えばプログラム部分と表示するHTML部分のコーディングが分かれているので、プログラマーとコーダー(デザイナー)が同時に作業を進めたりできる便利なテンプレートエンジンです。簡単なif文などのプログラムだったら、ノンプログラマーでもtplファイルに書いたりします。プログラムが出来ない僕が今日直面した課題はこうです。作業内容)商品一覧ページのtitle、description、keywords、h1、h2あたりを、絞り込み条件と並べ替えの組み合わせによってユニークにするというSEO的な作業でした。食べログで言えば、以下のスクリーンショットのように、左カラムで色々絞り込む(赤丸部分)と、メインカラムの見出し(赤下線部分)がユニークに変化します。これを主要なものだけでも、パターンの分だけ文言を用意する必要があります。(descriptionなどに)そうすると、meta内のif文だけでも100行を超えたりするんですよね。最初はまだいいんです。インデントと改行を使って書いてますから。インデントと改行を全部削除してからアップロードしないと、空白が生まれてしまうんです!tplでは、例えば分かりやすくインデントと改行を使って以下のようなif文を書くと、ソースを表示してみると、こんな風に表示されてしまいます。“>じゃあインデントと改行消してからアップロードすりゃいいじゃん。そうなんですが、このif文は今後も改善をして新しい条件を加えたり、削除したりするので、100行以上の条件式のインデントや改行をなくすと二度と誰も触れない暗号のようなものになってしまいます。さぁ困ったなぁと、対策を考えるとめんどくさいやり方ならいくつか出てきました。毎回アップロードする時だけインデントと改行を削除するインデントと改行をコメントアウトで囲むです。以前も似たようなケースがあった時には2番目の手段を使いました。それでも見にくいし面倒ですけど、インデントなし改行なしよりはマシかって感じで。余分なホワイトスペースやキャリッジリターンが除去されます。余分なホワイトスペースによって問題を引き起こす心配もありません。description=”東京の接待に使える和食のお店”>なんということでしょう!無駄な空白や改行は撤去され、スッキリ1行になっているではありませんか!ということで、長々と駄文で説明を書いてみましたが、伝わらない文章になったのでもう諦めます。まとめると!{strip}{/strip}で囲まれたHTMLファイルは、出力時のソースからインデントの余白や改行が除去され、1行で表示されるよっちゅーことです!覚えておくと便利です。地図...記事を読むhetemlで無料共用SSLを使う為に新サーバーに移設した時のお話SSL化したいなぁ~と思い始めていた今日この頃。当ブログのサーバーでもあ...記事を読む拡大も縮小もしてないのにIEだけ画像が荒い場合の対処法ブラウザチェックしてる際に発見したIE独自で起こるバグ。拡大も縮小もして...記事を読むCSS3のアニメーションがカクカクして動きが悪い時の対処法Webデザイナー歴10年。limeTextに戻したという話これはもう超めんどかった。コメントをキャンセルメールアドレスが公開されることはありません。*サイト上に表示された文字を入力してください。己を奮い立たせる名言したい人、10000人。