SMARTY + PHP 함께 CSS 부분을 넣어

CSS 파일을 완전히 분리하는 방법SMARTY + PHP 함께 CSS 부분을 넣어

Smarty + PHP에서 생성 된 html 파일에 CSS 부분을 함께 배치하는 방법을 생각해 보았습니다. CSS를 헤더에 포함해야하지만 페이지에 개별 CSS 스타일이 있으면 어떻게해야합니까?

템플릿 엔진 Smarty를 사용합니다. 먼저 헤더를 만들었고 (공통적으로 사용되는 모든 것을 모았습니다.) 멋진 구문으로 html 파일의 헤드에 포함 시켰습니다. 그리고 페이지에 CSS의 개별 부분이 있다면 'include 문'아래에 CSS를 넣습니다. 스마티 구문

HTML 파일은

{include file='_include/header.inc.html'} 

    <link rel="stylesheet" href="/assets/style/top.css"> 
    <script type="text/javascript"> 
     $(function(){ 
      $('#eyecatch ul').bxSlider({ 
       pager: false, 
       auto: true, 
       pause: 5000 
      }); 
     }) 
    </script> 
    <article> 
    </article> 

{include file='_include/footer.inc.html'}

하지만 내 동료는 스마티으로 생성 된 코드를 확인하고, "한 곳에서 조립해야하기 때문에 그것은 좋은 방법이 아닙니다에도 작동"

말했다

머리글 내에이 줄을 넣지 않았으므로 머리글 바로 아래에 있습니다.

Smarty에서 코드를 정리하고 정리하는 데 유용한 아이디어가 있습니까?

출처

2014-10-19 Tosh

css/js를 함께 유지하려면 템플릿 상속을 사용해야합니다.

예를 main.tpl에 대해 하나 개의 주요 파일을 만듭니다 당신이 좋아하는 것

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
    {block name="css"} 
     <link rel="stylesheet" href="stylesheets/mystyle.css" media="all" /> 
    {/block} 
    {block name="js"} 
     <script src="js/jquery-1.11.1.min.js"></script> 
    {/block} 
</head> 
<body> 

{block name="content"}{/block} 
<script> 
{block name="js-code"} 

    function test() { 
    } 
{/block} 
</script> 
</body> 
</html>

현재 정의 블록 콘텐츠를 추가/앞에 추가/교체. 다음 코드를 사용하여이 파일을 확장하여 마지막 페이지 지금

: 일부 블록시피 당신이 (수행 어떤 부모 블록을 교체하지 않기 때문에 append 옵션이

{extends file='main.tpl'} 

{block name="css" append} 
    <link rel="stylesheet" href="stylesheets/pagestyle.css" media="all" /> 
{/block} 


{block name="js" append} 
    <script src="js/jquery.validate.min.js"></script> 
{/block} 

{block name="js-code" append} 

    function otherFunction() { 

    } 

{/block} 

{block name="content"} 
    this is content 
{/block}

기본값)하지만 추가 컨텐츠 (추가 스타일 파일로드, 추가 js 파일로드 또는 추가 자바 스크립트 코드 추가)를 추가하려고합니다. 당신이 얻을 것이다 결과

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title>  
    <link rel="stylesheet" href="stylesheets/mystyle.css" media="all" />  
    <link rel="stylesheet" href="stylesheets/pagestyle.css" media="all" />  
    <script src="js/jquery-1.11.1.min.js"></script>  
    <script src="js/jquery.validate.min.js"></script> 
</head> 
<body> 
    this is content 
<script> 


    function test() { 
    } 


    function otherFunction() { 

    } 

</script> 
</body>

출처

2014-10-19 09:09:04

고마워요. 이제는 아주 분명합니다. – Tosh