2011-07-20 8 views
1

問題はそれほど複雑ではありません(私が書くつもりの記述と比較して))しかし、私はこれを可能な限り正確にしたいと思います(例えばHome.phpで間違っている可能性があります)文脈全体をあなたに教えてくれるでしょう。 私のデザインの一環として、ページにはさまざまな背景イメージが表示されます。そのために、私はSupersized、 "jQueryライブラリを使って構築されたフルスクリーンのバックグラウンドスライドショー"を使用します。私のページの中には、1つの背景イメージ(スライドショーはない)を使用するものもあれば、3つを使用するものもあります。また、私は解像度を監視し、彼に適切な画像サイズを果たすユーザを検出するために、JavaScriptを使用します。カスタムプロパティを使用して、異なるページに異なる背景を設定するにはどうすればよいですか?

var imageToBeLoaded = "images/bg_index.jpg"; 
$(document).ready(function() { 
if(window.screen.width > 1024) { 
    imageToBeLoaded = "images/bg_index_large.jpg"; 
}}); 

だから、問題は次のとおりです。

A)Home.phpはWP-管理を介してアクセス可能なページではありません私はカスタムフィールドを与えることはできません。

ソリューション:私は、ホームページ上にないよ場合は、私が唯一の画像の背景に関連するプロパティのために(と私が前に言ったようにカスタムフィールドのキー/ vaulesを取得する必要がありますif (isHome()){ setDefaultalues();}

B) 、これまでのページは1〜N個の背景画像を有する)。たとえば、私のAboutページには、bgImg1,smallImg1bgImg2smallImg2greeting textの5つのプロパティがあります。つまり、すべての変数を取得して名前を解析する必要があるため、たとえば取得できます。 bgImg1およびbgImg2。さらに、Supersizedは別のパラメータとしてテキスト記述を必要とするため、desc1desc2という2つのパラメータをさらに必要とし、適切なbgImgと組み合わせる必要があるので、静的ページから出力を生成することができます):

{image : 'images/bg_rwanda.jpg', title : 'Rwanda Home'}, {image : 'images/bg_rwanda2.jpg', title : 'Rwanda School'}

擬似コードは次のようになります:

var output = "{image : '"; 
var imageIsLarge= false; 
if (getResolution() > 1024) { imageIsLarge= true; } 
while (hasNextProperty()){ 
    Property prop = nextProperty(); 
    if (imageIsLarge) { 
     if (prop.getKey().startsWith (bgImageL)){ 
     output += prop.getValue()+", title:"; 
     // etc. Also, I need to set the code to first get the first img, 
     // not just in any order and pair it with the first description 

は今、これは少し複雑なようで、私はそれが簡単に行うことができます感じを持っているが、私はどのようには考えています。

+0

http://codex.wordpress.org/Custom_Fieldsには、カスタムフィールドを取得するために使用できるすべての機能がリストされています。 –

+0

私は、私を助けてくれる機能はないと私は認めなければならない。私はフィールドを取得する方法を知っていますが、私はそれらを「適切に」解析することに興味があります。しかし、1つのキーに対して複数の値を持つことができました:) – Andrija

+0

エレガントにこれを行うために何も組み込まれていません。あなたはコードを書く必要があります。 –

答えて

0

WordPressの任意のページで異なる背景を設定するには、CSSが必要です。 WordPressは自動的に各ページまたは投稿にユニークなクラスを追加し、style.cssのタグの背景をターゲットにする必要があります。

  1. ワードプレスのページまたは投稿のソースを表示します。
  2. 投稿に背景を追加する場合は、本文に割り当てられたクラス、つまり<body class="home page page-id-24 ...>または投稿ID-25に注意してください。
  3. body.page-id-93{ background:blue !important;}を使用してstyle.cssを編集すると、本体に他のスタイルが適用されているために!importantを使用する必要があります。
  4. これで、すべてのページまたは投稿で同じことができます。
関連する問題