人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

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

●質問者: kohhi
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● rouge_2008
●200ポイント ベストアンサー

新規作成・編集画面で、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


kohhiさんのコメント
お返事いただき、ありがとうございました。 できました。 また、よろしくお願いします。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ