كيف يتم التعامل مع عناوين المواقع داخل ملف CSS في للكيك حتى الرجوع إلى الموقع الصحيح؟

Question

وإنني تصميم موقع على شبكة الانترنت باستخدام CSS ادارة الملفات الكثير، ولكن لدي العديد من الحوادث من الصور الخلفية، الصور للرصاصات في القوائم وأنا على الأرجح سوف تجد الحاجة آخر لوظيفة المغلق url().

ولكن، في الكعكة، ويجب التعامل مع كل URL بواسطة الدالة Route::url()، بعدة طرق، كونها الأكثر شيوعا في $html->url()

ولكن مشكلتي هي أن لا يتم تفسير ملفات CSS بواسطة PHP. كيف يمكنني إنشاء ملف CSS تحتوي على شيء من هذا القبيل:

div.coolbg {
  background-image: url('<?= $html->url("/img/coolbg.jpg") ?>');
}

وانظر الخيار تقريري الأخير هو لاستيراد مضمنة ملف المغلق على التخطيط لذلك يمكن تفسيره. ولكن يفضل للغاية لاستخدام نهج أكثر "كعكة".

وشكرا!

Answer 1

وأنت لا تحتاج إلى استخدام $ html-> رابط () في ملف المغلق الخاص بك، وبالتالي لا تحتاج إلى تحليل ملفات CSS من خلال PHP أو إنشاء CssController.

إذا تم تثبيت التطبيق الخاص بك كعكة في المضيفين DocumentRoot الظاهري، ما عليك سوى جعل جميع المسارات إلى الصور المطلقة من الجاسوس. منها مثلا.

div.coolbg {
  background-image: url(/img/coolbg.jpg);
}

وهذا سينطبق الصورة في التطبيق / الجاسوس / IMG / coolbg.jpg لديك

إذا لم يتم تثبيت التطبيق الكعكة الخاصة بك في DocumentRoot المضيفين الظاهري، أي يمكنك الوصول إلى التطبيق كعكة الخاص بك عن طريق URL مثل http://www.domain.com/myapp/ ، ثم جعل لكم الطريق لصورة نسبة إلى الملف المغلق. تحقق من قواعد النمط في التطبيق / الجاسوس / المغلق / cake.generic.css منها مثلا.

#header h1 {
background:#003D4C url(../img/cake.icon.gif) no-repeat scroll left center;
color:#FFFFFF;
padding:0 30px;
}

ويعمل هذا لأن أوراق الأنماط يعيشون في التطبيق / الجاسوس / المغلق / الدليل، وصورة يعيشون في التطبيق / الجاسوس / IMG / الدليل، وبالتالي فإن مسار "../img/cake.icon.gif" يأتي من الدليل المغلق، ثم تتراجع إلى الدليل IMG.

Answer 2

وأود بالتأكيد الذهاب للحل الذي اقترحته zam3858. وإذا كنت لا ترغب في الحصول على صورك في موقعين متميزة، وخلق ارتباط رمزي في الدليل المغلق الذي يشير إلى الصور. مثل هذا:

$ cd app/webroot/css 
$ ln -s ../img .

والآن، سوف تحل مسارات الصور بشكل صحيح من أجل كل من المساعد أتش تي أم أل وأسلوب صحائف:

// css:
url(img/image.png);

// view.ctp
echo $html->image('image.png');

قد لا يكون cakiest حل، لكنه لا يبدو للكيك توفر واحد.

Answer 3

وتغيير الخط مع background إلى

background:url(../img/menu_027_l.jpg) no-repeat left;

Answer 4

ويمكنك إضافة CSS لتتم معالجتها من خلال PHP عن طريق تحرير ملف .htaccess الخاص بك في Apache. معالجتها، بدلا من مجرد البصق بها لا يكون أداء إصابة طفيفة.

AddType application/x-httpd-php .css

وايضا، انظر: http://www.webmasterworld.com/forum88/5648.htm

Answer 5

وهذا لن يساعد كثيرا مع الاشياء كعكة إلا إذا كنت أول مثيل الكائنات كعكة. إذا كنت ترغب في استخدام المساعد أتش تي أم أل، سوف ربما كنت ترغب في معرفة كيف يتم إنشاء مثيل الكائن كعكة الأول، ثم تقليد هذا في الاشياء CSS الخاص بك. لست متأكدا بالضبط كيف كنت تفعل هذا - أنا أعتقد أن وجود فإن وجود CSSController كامل يكون مبالغة، ولكن أعتقد أنك قد تضطر إلى إنشاء مثيل تحكم التطبيق (بعد كل شيء، تريد إعادة كتابة المغلق رابط لتعكس الإعدادات التي التطبيق، أليس كذلك؟ ). لذلك أنا أعتقد أنك قد تضطر إلى إنشاء CSSController على أي حال.

Answer 6

وهناك مجموعة كاملة من الخبراء CakePHP تكون على الارجح الى تكرهني لاقتراح هذا واحد ..:)

وكان الحل الأسهل بالنسبة لي أن تشمل فقط ملف الصورة في المجلد المغلق. شيء من هذا القبيل

/app/webroot/css/css_images/mypic.jpg

وهكذا في الملف المغلق أود أن وضعت للتو في:

background-image: url(css_images/mypic.jpg);

والشيء السيء هو من الواضح انها ليست cakiest شيء للقيام به. الشيء الجيد هو أنه سيعمل بغض النظر عما إذا كنت تستخدم رابط نزوة أم لا منذ المغلق يجد الصورة بالنسبة إلى الملف المغلق.

Answer 7

ولقد وجدت أن عناوين المواقع النسبية في خريف CSS بصرف النظر عند تضمين CSS في نصيرا للكيك. ومن المقرر أن جهاز التوجيه أن تكون قادرة على الخريطة عناوين مختلفة لنفس الصفحة حتى ذلك الحين عنوان الموقع النسبي يجب أن يكون مختلفا. على سبيل المثال إذا كان لديك رابط مثل مضيف محلي / اسم التطبيق / أجزاء / مؤشر أو مضيف محلي / اسم التطبيق / أجزاء / أو مضيف محلي / اسم التطبيق / أجزاء ثم سوف رابط النسبي لل../img/image.gif تعمل فقط لواحد منهم.

في بلدي المساعد كانت الطريقة الوحيدة التي وجدت للحصول على من حوله لجعل بلدي المغلق مثل هذا

.jquery-dialog-spinner {
    display:    none;
    position:   fixed;
    z-index:    1010;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 0, 0, 0, .1 ) 
            url('__loader_image__') 
            50% 50% 
            no-repeat;

و}

ثم قم باستبدال علامة مع رابط المتولدة في التعليمات البرمجية قبل الانتاج المغلق.

  $map = array(
      '__loader_image__' => $this->Html->assetUrl('ajax-loader.gif', array('pathPrefix' => IMAGES_URL))
  );
  $formatted_css = strtr($this->css, $map);
  $response .= "<style type=\"text/css\">" . $formatted_css . "</style>";

إذا كان هناك أسهل طريقة للقيام بذلك وسأكون ممتنا تعليق.