패널에서 생성 한 HTML 변경 : 가능합니까?


15

나는 패널을 사용하고 싶지만 패널은 엄청난 양의 div로 인해 스타일을 맞추는 데 어려움이 있습니다. 또한 해당 div에 적용되는 클래스는 의미가 없으며 너무 부피가 큽니다. 동료 프론트 엔더들 사이에 혼란을 일으켰습니다.

그들이 생성 한 출력을 보여주기 위해 :

패널 별 출력

문제는 960.gs를 사용하고 있으며 패널은 자체 클래스와 부피가 큰 div 구조를 추가하여 클래스를 재정의해야한다는 것입니다. 이것은 내가하고 싶지 않은 일이며, div를 정리하고 싶습니다. 이것을 할 수있는 방법이 있습니까?

편집하다:

내가 쓸모없는 것으로 생각한 div를 정리하기 위해 한 것 :

flexible.inc의 388 행부터 시작 (패널 / 플러그인 / 레이아웃 / 플렉서블)

$output = '';     
//$output = "<div class=\"panel-flexible " . $renderer->base['canvas'] . " clearfix\" $renderer->id_str>\n";
    //  $output .= "<div class=\"panel-flexible-inside " . $renderer->base['canvas'] . "-inside\">\n";

      $output .= panels_flexible_render_items($renderer, $settings['items']['canvas']['children'], $renderer->base['canvas']);

      // Wrap the whole thing up nice and snug
      //$output .= "</div>\n</div>\n";

나는 실제로 유연한 레이아웃의 사본을 만들어서 편집했지만이 프로젝트에 더 많은 시간이 있다면 더 깨끗한 플러그인을 만들 것입니다.

참고 : 이것은 최선의 해결책은 아니며 이것이 나의 목표를 달성하는 가장 빠른 경로였습니다. 나만의 작은 플러그인을 만드는 것이 가장 좋은 방법입니다. 기존 플러그인 중 하나를 항상 기본으로 사용할 수 있습니다.

답변:


19

나는이 문제를 전에 살펴 보았습니다. 읽고 싶은 문제는 다음과 같습니다 . 처음에는 견과류처럼 보이지만 실제로는 이와 같은 이유가 있습니다.

결론 : 패널 플렉시블 레이아웃을 프로토 타이핑 도구 로 생각하십시오 . 시도 및 개발에 초안 아이디어를 사용하여, 준비는, 사용자 테스트 등, 당신은 떨어져 서명 완벽한 레이아웃을 가지고하면 깨끗하고 선명한 손에 최적화 된 HTML과 생산을 위해 그것을 구현하는 사용자 정의 패널 레이아웃 (더 아래에).

여기에 연결된 문제를 기반으로 그것이 왜 그런지에 대한 간단한 요약이 있습니다.

  • 패널의 HTML 출력에는 누구나 만들 수있는 가장 유연한 레이아웃을 수용 할 수있는 미친 마크 업이 필요합니다. 많은 중첩 된 유체와 고정 된 영역을 나란히 생각하십시오.
  • HTML 순수 주의자에게는 자동으로 생성되는 것만으로는 충분하지 않으므로 패널 사용자는 유연한 레이아웃 기능 내에서 행복하게 유지하려고하지 않았습니다 . 따라서 레이아웃에 의해 생성 된 HTML을 최소한으로 파싱하려고 시도하는 HTML 최적화 알고리즘이 없습니다. 아무리 훌륭하더라도 여전히 최고의 표준 HTML이 아니기 때문입니다.
  • 그들이 언급하지 않은 것 : 그러한 최적화가 있었다면, 레이아웃의 특정 변경으로 인해 현재 중복되는 div와 클래스가 사라질 것입니다. CSS를 중단했다면 패널 유연한 레이아웃을 약간 변경할 때 CSS를 다시 작성해야합니다. 즉, 패널 플렉시블 레이아웃을 최고의 표준 제작 도구로 만들려고했지만 실패한 경우 프로토 타이핑 도구로 약화했을 것입니다.
  • 깨끗하고 마른 패널 HTML 출력을 얻을있습니다 . 줄 사이에서 읽는 예상 워크 플로우는 다음과 같습니다.
    • 초기 개발 중에 아이디어를 시험하는 동안 패널 유연한 레이아웃을 사용합니다.
    • 특정 레이아웃을 정한 후에 깨끗한 HTML을 원한다면 사이트에 적합한 클래스, 의미 체계 등 레이아웃에 필요한 정확한 HTML 마크 업 만 사용하여 사용자 정의 레이아웃을 사용하여이를 구현하십시오 (아래 방법 참조). ).

처음에는 마음에 들지 않았지만, 반성 할 때 말이된다고 생각합니다. 생산 상황에서 프로토 타이핑과 최상의 표준에 모두 적합한 도구 하나를 만드는 것이 아니라 서로 다른 요구를 가지고 있고 그 어느 것도 옳지 않은 타협을 초래할 수있는 하나의 도구를 만드는 대신 프로토 타입 제작에 이상적인 도구 하나와 린 생산에 이상적인 별도 도구 (맞춤형 레이아웃)가 있습니다.

즉, 최고의 표준 HTML을 기반으로 템플릿으로 최종 레이아웃을 구현하는 데 약간의 추가 작업을 수행하면서 두 가지 모두를 최대한 활용할 수 있습니다.하지만 HTML 순수 주의자는 어쨌든 약간의 추가 작업을 원합니다 그들의 출력은 완벽합니다.


사용자 정의 패널 레이아웃을 만드는 방법은 무엇입니까? 거기에 이렇게하는 방법에 대한 설명서에 자세한 안내가 . 간단한 기본 요약은 다음과 같습니다.

  1. 에서 기존 레이아웃 복사 /sites/all/modules/panels/plugins/layouts가되는을/sites/all/themes/[your_theme_name]/layouts/[new_unique_layout_machine_name]
  2. 새 사본의 파일 이름을 새 폴더 이름과 일치하도록 바꾸십시오. 점을 유의 .tpl.php파일 대신 밑줄의 하이픈이 있어야합니다.
  3. 테마 정보 파일에 줄 추가 : plugins[panels][layouts] = layouts이 테마에 사용자 정의 레이아웃이 있고 패널의 위치를 ​​패널에 알려줍니다 ( layouts테마에서 사용자 정의 레이아웃 폴더로의 경로가 아닌 경우 문자열을 대체 합니다)
  4. 완벽하고 매끄럽고 최소한의 의미 론적 최고 표준 HTML 및 CSS로 파일을 편집하십시오.

    • .inc이름, 카테고리, 파일 이름 등과 같은 레이아웃 정보로 파일을 업데이트하는 것을 잊지 마십시오 .
    • theme.inc 파일 .tpl.php의 확장자 는 파일 이름 과 일치해야 합니다. 여기에 theme값으로 입력 한 밑줄 은 하이픈으로 변환됩니다.
    • .png실제 레이아웃을 더 잘 반영 하도록 아이콘을 편집하는 것도 고려 하십시오.
  5. 캐시를 지우십시오. 새 레이아웃은 .inc파일 에서 지정한 이름, 범주 등이있는 패널에 옵션으로 나타납니다 . 그걸 써.

1
Thnx man !, 이것은 나를 위해 오후의 나머지를 잡을 예정이다. 그러나 그것은 "해킹"없이 행해질 수있다. 그래서 그것은 나의 마음을 조금 편하게한다. Btw : 문제에 관한 게시물을 찾을 수 없기 때문에이 게시물이 어떻게 든 Google에 표시되기를 바랍니다.
thecodeassassin

@Stephen 질문을하고 내 자신의 질문에 답한 후 6 개월 이상 검색하는 빈도에 놀랐습니다. 아니면 같은 SE 질문 ...
WernerCD

이 질문과 답변이 매우 유용하다고 생각하므로 제목을 수정하여 제안했습니다. : 나는 거기 같은 질문 자신을 물어 drupal.stackexchange.com/questions/69807/theming-panels-html 중복
조지 Katsanos

5

패널의 마크 업 출력을 제어하기 위해 Clean Markup Drupal 7 모듈을 고려할 수도 있습니다 .

브라우저에서이 페이지를 검색했는데 user568458에서 제공 한 정말 포괄적 인 답변을 포함하여 해당 페이지에 대한 언급을 찾지 못했습니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.