2017-09-14 18 views
0

Blog module에 CSS 요구 사항을 추가하려고합니다.SilverStripe의 블로그 모듈 스타일링을위한 최선의 방법

내가 채택한 접근 방식은 css 요구 사항을 init() 함수에 도입하기 위해 Blog 클래스와 Blog_Controller (BlogPost 및 BlogPost_Controller는 물론)의 하위 클래스를 만드는 것입니다. 그러나, 어떤 이유로, 나는 이러한 CSS 파일에 대한 참조가 작동하지 않는 것 같습니다.

class ProjectsHolder extends Blog{ 

    private static $allowed_children = array(
     'ProjectPage' 
    ); 
    } 

    class ProjectsHolder_Controller extends Blog_Controller{ 

    public function init(){ 
     parent::init(); 
     Requirements::css("{$this->ThemeDir()}/css/projects.css"); 
    } 
    } 

나는 또한 < % require css %> 템플릿 구문을 사용해 보았습니다. 내가 CSS를 렌더링 할 수있는 유일한 방법은 템플릿의 맨 위에있는 head 태그 안에 CSS 링크 태그를 하드 코딩하는 것입니다 (끔찍한 일입니다).

클래스에 기능을 주입하기 위해 SilverStripe의 DataExtension/SiteConfig 접근 방식을 사용했는데, 이는 내 상황에 적용되는 것처럼 보입니다.

내 질문은 : 블로그 모듈과 같은 스타일링 모듈의 모범 사례는 무엇입니까?

분명히 내가 이해하지 못하거나 이해하지 못하는 부분이 있습니다. 모든 설명이 많이 감사하게 될 것입니다! {$this->ThemeDir()} : 당신이 테마 CSS를 사용하는 경우

언뜻

답변

1

, 당신은 단순히 어쩌면 브라켓이 문제를 일으키는하지만 코드에서

Requirements::themedCSS("projects");

를 사용할 수 있습니까?

SilverStripe 문서에서는 템플릿과 PHP 파일 모두에서이 작업을 수행하는 예제를 제공합니다. 요즘 '바람직한'방식은 여전히 ​​'요구 사항'을 사용하는 것이지만 언급 한 템플릿에서는 요즘 내 관심을 끌고 있습니다. 당신의 블로그 모듈을 스타일링, 무엇이든을 확장하거나을 수정하지 않아도에 관해서는

<% require themedCSS("projects") %>

왜 당신이 당신의 주요 스타일 시트하거나 자신의 파일에 스타일을 추가하지 않는 핵심 코드이다/css 그리고 기본 테마 템플릿에 포함 시키시겠습니까?

내가하는 일은 blog.css 파일을 만들고이 파일을 <% require %> 템플릿을 사용하여 themes/themename/templates/Page.ss 파일에 포함시키는 것입니다. 확실히 당신의 css 파일에는 Combining Files를 활용하는 데 필요한 많은 공간이 없습니다.

+0

네, templated와 php 구문 모두에서 themedCSS를 시도해 보았습니다. 둘 다 아무 소용이 없습니다. 괄호 코드는 튜토리얼에서 알아 차린 점이었고, 도트 연결을 사용하여 시도한 바 있습니다 : 'Requirements :: css ($ this-> ThemeDir()./css/projects.css "); ' 예 내 글로벌 스타일을 블로그 관련 스타일과 병합 할 수 있습니다. 별도의 페이지로 세분화하면 큰 프로젝트의 CSS 유지 관리가 더 쉽습니다. 최후의 수단으로, 그것은 아마 작동 할 것입니다. –

+0

여러 가지 테마/템플릿이있을 수 있고 모듈 또는 클래스 확장에 특정 스타일을 지정하면 모든 테마에서 스타일이 거의 고착되므로이 새로운 추론이 필요하다고 생각합니다. 개별 테마에 스타일을 적용하고 템플릿 구문을 사용하면 시각적으로 테마별로 더 많은 사용자 정의가 가능합니다. 또한 SS가 MVC 프레임 워크에 더 가깝습니다. –

+0

@RyanAchten 귀하의 스타일 시트에 대해 sass http://sass-lang.com/을 확인하십시오. 일단 그것을 사용하면 다시 CSS 편집 파일로 돌아 가지 않습니다. –