내 페이지 중 일부에 사용자 정의 CSS 스타일 추가
답변:
특정 페이지에 사용자 정의 CSS 코드를 추가하는 방법에는 여러 가지가 있습니다. 몇 가지 대안이 있습니다.
Alt. 1-페이지 클래스 페이지 클래스를
사용하십시오. 메뉴 항목 편집기의 "페이지 표시"탭 아래에 "페이지 클래스"라는 필드가 있습니다. 템플릿 구성 방식에 따라 <body>태그 또는 <div class="YOURCLASS">...</div>콘텐츠 주변에 클래스가 추가됩니다 .
그런 다음 지정한 클래스를 사용하여 템플릿의 CSS 파일에 새 규칙을 만들면됩니다.
예를 들어 mycustomclass메뉴 항목의 "페이지 클래스"필드에 추가 하고이를 CSS 파일에 넣으십시오.
.mycustomclass p {font-color:red;} // Make text red on this particular page
Alt. 2-사용자 정의 CSS 모듈
이 목적으로 여러 모듈을 사용할 수 있습니다. CSS 코드를 추가하고 스타일을 지정할 페이지에 게시 할 수있는 모듈 인 Custom CSS 가 그 예 입니다.
비슷한 옵션은 HTML, JavaScript 및 CSS 를 페이지에 추가 할 수있는 모듈 인 Custom HTML Advanced 입니다. 코드를 태그에 자동으로 추가 할 수 있습니다 .<head>
Alt 3.-추가 CSS 스타일 시트로드
다른 대안은 템플릿 index.php파일 에서 현재 메뉴 항목 ID를 확인하고 필요한 경우 다른 CSS 스타일 시트를로드하는 것입니다.
<?php
$currentMenuId = JSite::getMenu()->getActive()->id ;
if ($currentMenuId == "14") {
echo '<link rel="stylesheet" type="text/css" href="mystyle.css">';
}
?>
내가 가장 좋아하는 방법 중 하나는 body 요소에 대한 동적 클래스를 만드는 것입니다.
그래서:
<?php
$app = JFactory::getApplication();
$menu = $app->getMenu();
$active = $menu->getActive();
$class = $active->alias . " pageid-" . $active->id;
?>
<body class="<?php echo $class; ?>">
위 코드가 생성하는 몇 가지 예는 다음과 같습니다.
홈페이지 :
<body class="home pageid-13">
회사 소개 페이지 :
<body class="about-us pageid-15">
이제 위의 클래스를 사용하여 페이지 당 사용자 정의 특정 스타일을 작성할 수 있습니다.
이것은 같은 일을하는 또 다른 방법입니다.
doctype 이상으로 이동 :
<?php
$app = JFactory::getApplication();
$menu = $app->getMenu()->getActive();
$pageclass = '';
if (is_object($menu))
$pageclass = $menu->params->get('pageclass_sfx');
?>
신체 클래스가있는 색인으로 이동합니다.
<body id="<?php echo $pageclass ? htmlspecialchars($pageclass) : 'default'; ?>">
이제 메뉴 항목의 페이지 클래스에 추가 한 내용이 본문 ID에 나타납니다. 클래스가없는 모든 메뉴 항목은 자동으로 body id = "default"입니다.
또한이 확장을 사용하여 메뉴 항목에 다른 스타일 시트를 지정할 수 있습니다. http://extensions.joomla.org/extensions/extension/style-a-design/templating/css2switch-basic
문안 인사.