Wordpressでスクロールバー付きのボックスを

Wordpressのテーマに標準でついているstyle.cssに設定するのでなく

特定の固定ページだけに設定したいのですが。


ダッシュボード→固定ページ→編集
は<head></head>タグの中にCSSを定義出来なのではないでしょうか。

どうすれば、以下の内容を固定ページに設定できるか、アドバイスいただけると助かります。


1.Wordpressのテーマ:ClassRoom Blog 1.08 : Daniel Farrell 作


2.CSSは以下
<STYLE type="text/css">
<!--
.scr {
overflow: scroll; /* スクロール表示 */
width: 100px;
height: 100px;
background-color: red;
}


3.固定ページ側
<DIV class="scr">
縦100px、横100px。テキストがこの範囲を超えた場合は、
自動的にスクロールバーが表示されます。
</DIV><BR>


4.参考サイト
http://css.eweb-design.com/0807_sb.html

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2012/06/23 16:35:53
  • 終了:2012/06/25 20:48:03

ベストアンサー

id:rouge_2008 No.1

rouge_2008回答回数594ベストアンサー獲得回数3512012/06/23 21:55:18

ポイント200pt

新規作成・編集画面で、headタグ内に記述する内容を投稿する事は、そのままではできません。
カスタムフィールドを使う事でも可能ですが、テーマのfunctions.phpに記述する方法です。

function add_mypage_style() {
	if(is_page('目的の固定ページのID')){
?>
<style type="text/css">
.scr {
overflow: scroll; /* スクロール表示 */ 
width: 100px;
height: 100px;
background-color: red;
</style>
<?php
	}
}
add_action('wp_print_styles', 'add_mypage_style');

※上記をPHPのコード内(<?php ~ ?>の間)に適切にコピーします。(最終行の「?>」の直前に貼り付けるといいです。)

テンプレートファイル「page.php」

	<?php if(is_page('目的の固定ページのID')) : ?>

<DIV class="scr">
縦100px、横100px。テキストがこの範囲を超えた場合は、
自動的にスクロールバーが表示されます。
</DIV><br />
	<?php endif; ?>

※上記をpage.phpの表示したい箇所にコピーします。

※目的の固定ページが複数ある場合は、functions.php、page.php両方とも、条件分岐タグに「is_page( array( 一つ目のページID, 二つ目のページID, 三つ目のページID ) )」のように配列で渡すといいです。

http://wpdocs.sourceforge.jp/Conditional_Tags
http://wpdocs.sourceforge.jp/%E3%83%97%E3%83%A9%E3%82%B0%E3%82%A4%E3%83%B3_API/%E3%82%A2%E3%82%AF%E3%82%B7%E3%83%A7%E3%83%B3%E3%83%95%E3%83%83%E3%82%AF%E4%B8%80%E8%A6%A7

id:kohhi

お返事いただき、ありがとうございました。
できました。
また、よろしくお願いします。

2012/06/25 20:47:54

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません