web-dev-qa-db-ja.com

テーマコントロールパネルでCSSを変更する

はじめましてWordpressの最初のテンプレート用に高度なコントロールパネルを作成しようとしていますが、必要な機能を追加することはできません。私が追加しようとしている機能は、管理者パネルを介してDIV(左下)の位置を選択する可能性です。 (私の本当に悪い英語をお詫び申し上げます)

これが私のfunctions.phpにあるコードです。

$shortname = appacqua
array( "name" => "Point on the map",
    "type" => "section"),
array( "type" => "open"),
array(  "name" => "Have I to activate zona 1?",
        "desc" => "Select if you want to show the first zone",
        "id" => $shortname."_zona1c",
        "type" => "checkbox",
        "std" => "false"),
array( "name" => "Zona 1",
    "desc" => "Choose the position",
    "id" => $shortname."_zona1x",
    "type" => "text",
    "std" => "Left:???"),
array( "type" => "close"),

管理パネルに "box"と表示されていても、$ shortnameをエコーし​​てもCheckboxに問題はありません。 "_ zona1x"数字が表示されます。

.zona1{width:27px;height:27px;background:url(icone/1.png) no-repeat;position:absolute;bottom:0;left:<?php echo $appacqua_zona1x;?>px;}

動作しません...要素をIspectにGoogle Chromeを使用すると、次のようになります。

width: 27px;
height: 27px;
background: url(icone/1.png) no-repeat;
position: absolute;
bottom: 0;
left: <?php echo $appacqua_zona1x;?>px;

何がおかしいのですか?ご協力ありがとうございました。

コントロールパネルの内側にこの変更のプレビューも作成する方法があるかどうか知っていますか(iFrame内など)。

私は "自作のプログラマー"だとしましょう:P "ゆっくり"(lol)を書いて私と親切にしてください、ありがとうございました!

3
Downloadtaky

それの外見からあなたのphpをCSSに正しく追加することはできません。私がこれを書いているようにJeremyが言ったようにあなたはcssファイル自体に書くか、またはそれをHTMLに正しくダンプする必要があります:)

変更するたびに新しいCSSファイルを作成するとシステムに負担をかける可能性がありますが、ライブサイトに動的な変更をあまり加えない場合はうまくいきます。

これを行う簡単な方法は、実際には.cssファイルを次のようにして.phpファイルに変換し、その後にphp/cssを適用することです。

header('Content-Type: text/css');

あなたのHTMLのヘッダにそれを書く代わりに、たくさんのプラグインがこれをします、そしてそれは意味論的に分離していないのでマークアップを変えるのは面倒かもしれませんが、それはまたとても簡単です。

通常、これはOptions APIを使用して行われます。 http://codex.wordpress.org/Options_API

これは背景色のためにバックエンドでadd_optionを使った例です(これは例えばheader.phpに置かれます)。

body {
  background-color: <?php echo get_option('background_color'); ?>;

プレビューの場合は、デフォルトのpreview_post_linkにフックしてiframeを使用できます。これは例です。

 <iframe src="<?php echo clean_url(apply_filters('preview_post_link', add_query_arg('preview', 'true', get_permalink($post->ID)))); ?>" width="100%" height="600" ></iframe>

動的スタイルを書くときにパフォーマンスの問題があることを覚えておいてください、そしてあなたは状況に応じてこのトピックについてもっと研究をするべきです

3
Wyck

Style.cssファイルはphpファイルではないため、phpコードを実行することはできません。これらのスタイルを含めたい場合は、動的CSSジェネレータを構築してそれをテーマのヘッダに含めるか、スタイルをスタイルタグに含める必要があります。

私はそれが両方の方法で行われているのを見ました、そして私はどちらかが受け入れられると考えるでしょう。

CSSジェネレーターはユーザーがキャッシュできるので、パフォーマンス的には優れています。

2
Jeremy Boyd