কোনও একক পৃষ্ঠা / নোডের জন্য সিএসএস যুক্ত করার কোনও উপায়?


79

আমি আমার বড় পাগল স্টাইলের শীটগুলি পরিষ্কার করছি (সম্ভবত ভবিষ্যতের প্রশ্নের সাথে প্রাসঙ্গিক) এবং আমি নির্দিষ্ট নোড বা পৃষ্ঠায় কাস্টম সিএসএস যুক্ত করার সর্বোত্তম উপায়টি নিয়ে ভাবছি।

বিশেষত, আমার কার্য সাইটের হোম পৃষ্ঠা একটি প্যানেল পৃষ্ঠা এবং এটিতে বিভিন্ন স্টাইলিংয়ের গুচ্ছ রয়েছে। এখনই সিএসএস স্রেফ মূল থিম শৈলীর সাথে অন্তর্ভুক্ত রয়েছে।

কোনও উপায় আছে, "যদি এটি নোড ফু হয় তবে foo.css যুক্ত করুন"? কি সিএসএস Injector আমি খুঁজছেন বলছি?

আমি এটি অন্যান্য নোড / বিভাগ / ইত্যাদিতে সাধারণীকরণে আগ্রহী হতে পারি তবে এই মুহুর্তে আমি কেবল এই আইটেমটি পরিচালনা করতে চাই।

আমি কি শেষ করেছি।

আমি একটি জেন ​​সাবথিম ব্যবহার করছি, এবং টেম্পলেট.এফপি মাধ্যমে বাস্তবে পাঠ করে আবিষ্কার করেছি যে শর্তাধীন শৈলী শীট সহ কিছুতে কোড মন্তব্য করা হয়েছে। নীচের কোডটি আমার যা প্রয়োজন ঠিক তা করেছে:

if (drupal_is_front_page()) {
  drupal_add_css(path_to_theme() . "/foo.css", 'theme','all'); 
}

(স্টকের জেন টেম্পলেট.এফপি ফাইলে 80 লাইন, এফডাব্লুআইডাব্লু।)



তৈরি করুন page--front.tpl.phpএবংpage.tpl.php
এম আমা ডি

উত্তর:


69

আমি কোড দিয়ে এই জিনিসটি সাজিয়েছি, তবে এটি কারণ আমি রোল করছি।

টেম্পলেট.এফপিতে আপনি এমন কিছু চাইবেন:

function MYTHEME_preprocess_node($vars) {
  if (drupal_get_path_alias("node/{$vars['#node']->nid}") == 'foo') {
    drupal_add_css(drupal_get_path('theme', 'MYTHEME') . "/css/foo.css");
  }
}

আপনার নিজস্ব কোড সম্পর্কিত মান দিয়ে ফু প্রতিস্থাপন করুন।


সুতরাং হোম পৃষ্ঠার জন্য, আপনি কি if(drupal_is_front_page()) {পরিবর্তে ব্যবহার করবেন if(drupal_get_path_alias [etc]?
এপারসোনয়ে

হ্যাঁ, শর্তগুলি সম্পূর্ণ আপনার উপর নির্ভর করে। আপনি চাইলে কেবল একটি $vars['#node']->nid == $nidচেক করতে পারেন।
ডেসিফার

8
ডিসিফার, আপনার কোডের সাথে কোনও দোষ খুঁজে পাচ্ছেন না। তবে আশা করি আপনি আমার দিকে ইঙ্গিত করতে আপত্তি করবেন না যে আপনি ড্রুপাল অনুমতি কনফিগারেশন সম্পর্কে কথা না বললে আপনি যেভাবে ভূমিকা পালন করেন তা আসলে আপনার রোল করার উপায় হওয়া উচিত। ;-)
মেডিডেন

2
এফওয়াইআই, আমি ড্রুপাল using ব্যবহার করছি এবং খুঁজে পেয়েছি যে $vars['elements']['#node']->nidওরফে অনুসন্ধানের পরিবর্তে আমার ব্যবহার করা দরকার । এটির চেহারা থেকে সর্বশেষ দ্রুপাল 7 এর কোনও #nodeমূল নেই vars
ওয়েস জনসন

এটি MythEME__preprocess_node (ars vars) এর আগে ফাংশন করা উচিত নয় আমি সেখানে সমস্ত কোড দেখতে পাচ্ছি কেবল ফাংশনের ক্ষেত্রে?
pal4Live


16

আপনার পৃষ্ঠা / বিভাগের জন্য একটি প্রসঙ্গ তৈরি করুন এবং তারপরে প্রসঙ্গের জন্য সিএসএস এবং / অথবা জাভাস্ক্রিপ্ট লোড করতে প্রসঙ্গ সম্পদ মডিউলটি ব্যবহার করুন ।

প্রসঙ্গ:

প্রসঙ্গ আপনাকে আপনার সাইটের বিভিন্ন অংশের জন্য প্রাসঙ্গিক শর্ত এবং প্রতিক্রিয়া পরিচালনা করতে দেয়। আপনি প্রতিটি প্রসঙ্গে আপনার সাইটের একটি "বিভাগ" উপস্থাপন হিসাবে ভাবতে পারেন। প্রতিটি প্রসঙ্গে, আপনি এই শর্তটি সক্রিয় হওয়ার জন্য ট্রিগার তৈরি করতে পারেন এবং দ্রুপালের বিভিন্ন দিক বেছে নিতে পারেন যা এই সক্রিয় প্রসঙ্গে প্রতিক্রিয়া দেখা উচিত।

কোন প্রসঙ্গটি সক্রিয় রয়েছে তা দেখার জন্য পৃষ্ঠা লোড চলাকালীন যাচাই করা নিয়মের একটি সেট হিসাবে শর্তগুলি ভাবেন। সক্রিয় প্রসঙ্গের সাথে সম্পর্কিত যে কোনও প্রতিক্রিয়াগুলি তখন বরখাস্ত করা হয়।

প্রসঙ্গ সম্পদ যুক্ত করুন:

প্রসঙ্গ যুক্ত সম্পদ আপনাকে এটি করার অনুমতি দেয়। কোনও কোড না লিখেই আপনাকে এগুলি করার অনুমতি দেওয়ার জন্য ইউআই ব্যবহার করা সহজ। কারণ এটি ctools ব্যবহার করে এটি সমস্ত রফতানিযোগ্য।


আমি আক্ষরিকভাবে তৈরি প্রতিটি ওয়েবসাইটে আমি কনটেক্সট অ্যাড সম্পদগুলি ব্যবহার করি - যদি আপনার কনটেক্সটগুলিতে হয় (যা আমার বিল্ডগুলির প্রতিটি বিভাগে চালিত হয়) অ্যাডসেটগুলি যুক্ত করুন নিখুঁত!
ইলেক্টব্লেক

13

যদি এটি সিএসএসের একটি অল্প পরিমাণে হয়, তবে নোডের ভিত্তিতে এবং আপনার থিমের সিএসএসে সিএসএস সহ আপনার সিএসএস নির্বাচক তৈরি করার কথা বিবেচনা করছেন? ড্রুপাল 7 বডি.পেজ-নোড-নোডইড নির্বাচক সরবরাহ করে এবং ড্রপাল 6 এর জন্য জেন অনুরূপ বডি সিএসএস ক্লাস সরবরাহ করে।


এটিই মূলত আমি যা করছিলাম ... এবং এটি প্রায় 200 লাইন, তাই এটিকে অন্যত্র সরিয়ে নেওয়া ভাল ধারণা বলে মনে হয়েছিল। (হ্যাঁ, এটি সম্ভবত আরও সংক্ষিপ্ত হওয়া উচিত that এটি একটি পৃথক পদক্ষেপ হতে পারে
eএপারসোনয়ে

অন্যদিকে, আপনার প্রতিক্রিয়া আমাকে আমার (জেন চাইল্ড) টেমপ্লেটে টেম্পলেট.এফপি পড়তে অনুপ্রাণিত করেছে, যা আমাকে চূড়ান্ত উত্তরে পেয়েছে।
ইপারসোনয়ে

7

আপনি একটি কাস্টম মডিউল তৈরি করতে পারেন এবং নোড আইডির উপর ভিত্তি করে বেছে বেছে স্টাইলশিট লোড করতে হুক_প্রিপ্রসেস_নোড () ব্যবহার করতে পারেন।

এখানে একটি উদাহরণ:

function MYMODULE_preprocess_node($vars) {
  $nid = 3;
  if (arg(0) == 'node' && is_numeric(arg(1)) && arg(1) == $nid) {
    drupal_add_css(drupal_get_path('theme', 'MYTHEME') . "/foo.css");
  }
}

আপনার মডিউলটির নামের সাথে মাইমডুলে প্রতিস্থাপন করুন এবং সিএসএস ফাইলযুক্ত থিমের নাম দিয়ে মিথ্যাকে প্রতিস্থাপন করুন।


হুক_ইনিট () প্রতিটি পৃষ্ঠা লোডে চলে এবং প্রায়শই একাধিকবার (এএএএইচএইচ) কেন হুক_প্রিপ্রসেস_নোড (থিম বা মডিউলে) ব্যবহার করবেন না যা কেবল নোড রেন্ডার করার পরে চলে?
ডিসিফার

ভাল পয়েন্ট, জানেন না যে init একাধিকবার লোড হয়েছিল।
ক্যামসফট

ডিসিফার, প্রিপ্রসেস ফাংশনটি ব্যবহার করার জন্য আমি আমার উদাহরণটি সংশোধন করেছি। এখনো শিখছি!
ক্যামসোফট

তারপরের পরবর্তী প্রশ্নটি হ'ল নোড ভেরিয়েবলগুলি $ ভার্সের মধ্য দিয়ে গেলে নিডের জন্য আরগ (1) কেন ব্যবহার করা হবে :) এরপরে আমার উত্তরটির সাথে এটি কীভাবে পৃথক হবে তার পরবর্তী প্রশ্নে নেতৃত্ব দেবে: পি
ডাইফার

আমার ধারণা হুক_প্রিপ্রসেস_নোড () ডকুমেন্টেশন আমার পড়া উচিত ছিল। আপনি একদম ঠিক বলছেন. এপারসোনে, আমি আপনাকে ডেসিফারের উত্তরটি মেনে নেওয়ার পরামর্শ দিই।
ক্যামসফট

7

যদি কোনও সিএসএস শৈলী যুক্ত করার জন্য যে মানদণ্ডগুলি কোনও নোডের কিছু বৈশিষ্ট্য থেকে নির্ভর করে তবে আমি বাস্তবায়ন করব MYTHEME_preprocess_node(&$variables); ফাংশনে পাস করা মানগুলির মধ্যে একটি হ'ল $variables['node'](লক্ষ্য করুন এটি হয় না $variables['#node'])।

MYTHEME_preprocess_node(&$variables) {
  if ($variables['node']->nid == 3) {
    drupal_add_css(drupal_get_path('theme', 'MYTHEME') . "/foo.css");
  }
}

মানদণ্ড যদি কোনও নোড বৈশিষ্ট্য থেকে নির্ভর করে না, তবে আমি বাস্তবায়ন করব MYTHEME_preprocess_page(&$variables); $variables['node']একটি নোড অবজেক্ট থাকে, পৃষ্ঠাটি যদি নোড পৃষ্ঠা হয় দেখানো হয়। ড্রুপাল 6 এ, প্রক্রিয়া ফাংশনটিও পায় $variables['is_front'], তবে দ্রুপাল 7 এ একই ভেরিয়েবলটি পাস হয় না; পৃষ্ঠাটি প্রথম পৃষ্ঠা কিনা তা যদি আপনার জানা দরকার তবে আপনাকে ব্যবহার করা দরকার drupal_is_front_page()

MYTHEME_preprocess_page(&$variables) {
  if ($variables['is_front']) {
    drupal_add_css(drupal_get_path('theme', 'MYTHEME') . "/foo.css");
  }
}

5

এটি করার প্রশাসনিক ভিত্তিক পদ্ধতির জন্য আমি সিএসএস মডিউলটি দেখতে চাই । এটা একটা ক্ষেত্র যেখানে আপনি যোগ করতে পারেন যোগ সিএসএস করতে node/addএবং node/editপেজ।

সিএসএস:

সিএসএস মডিউল যোগ করে, যথেষ্ট অনুমতি এবং সক্ষম নোডযুক্ত ব্যবহারকারীদের জন্য নোড তৈরি পৃষ্ঠায় একটি সিএসএস ক্ষেত্র।

ব্যবহারকারীরা সিএসএস নোড ক্ষেত্রে সিএসএস বিধি সন্নিবেশ করতে পারে এবং এই নিয়মগুলি নোড দেখার উপর বিশ্লেষণ করা হবে।

সিএসএস অভিজ্ঞ ব্যবহারকারীরা নোড সামগ্রীর জন্য জটিল সিএসএস ভিত্তিক নকশা তৈরি করতে পারে।

গুরুত্বপূর্ণ: নোট করুন যে সিএসএস সম্পাদনার অনুমতিগুলি কেবলমাত্র বিশ্বস্ত ব্যবহারকারীদের (প্রশাসকদের) দেওয়া উচিত। ক্ষতিকারক ব্যবহারকারীদের যাদের এই অনুমতি রয়েছে তারা আপনার সাইটের ডিজাইনটি ভেঙে দিতে পারে এবং সুরক্ষা সংক্রান্ত সমস্যা (এক্সএসএস) প্রবর্তন করতে পারে।


3

CodePerNode দুর্দান্ত তবে সিএসএস ইনজেক্টর ইনস্টল করা সহজ (কোনও লাইব্রেরির প্রয়োজন নেই)। মডিউলটি কনটেন্ট ম্যানেজারকে পিএইচপি কোড বা আইএনএফও ফাইলগুলি স্পর্শ না করেই নির্দিষ্ট পৃষ্ঠায় গতিশীলভাবে সিএসএস যুক্ত করতে দেয়। 15777 ইনস্টলগুলি ভুল হতে পারে না - এটি এই সামাজিক প্রমাণ যা এই মডিউলটি কাজ করে। সিএসএস নিয়মিত ক্যাচিং সিস্টেমের সাহায্যে ক্যাশে করা হয়।


2

যেহেতু আপনি ইতিমধ্যে প্যানেলগুলি ব্যবহার করছেন তাই আপনার হোমপেজ প্যানেলের প্রতিটি অঞ্চলের জন্য প্যানেল স্টাইল হিসাবে আপনার সিএসএস যুক্ত করা আরও সহজ। আপনি সেখানে কাস্টম মার্কআপ সংজ্ঞায়িত করতে পারেন এবং এটি আপনার সাইট জুড়ে পুনরায় ব্যবহার করতে পারেন।

আপনি নিজের হোমপৃষ্ঠার জন্য কেবল পৃষ্ঠা পরিচালকের বৈকল্পিক নিয়মের সাধারণ বিভাগে যেতে পারেন। কেবলমাত্র বর্তমান প্যানেলের জন্য সিএসএস আইডি এবং বিধি যুক্ত করার জন্য এখানে একটি বিভাগ রয়েছে।

দ্রষ্টব্য: এটি সমস্ত ডি 7-এ রয়েছে, সুতরাং এটি হতে পারে যে প্যানেলগুলি পূর্ববর্তী সংস্করণগুলির চেয়ে এই পদ্ধতির উন্নততর সমর্থন করে।


2

/ * সামগ্রীর প্রকারের ভিত্তিতে CSS যুক্ত করতে বারটিক থিম ব্যবহার করার একটি উদাহরণ * /

function bartik_preprocess_node(&$variables) {
if(!empty($variables['node'])) {
    if($variables['node']->type == 'my_custom_content_type')
    {
      drupal_add_css(drupal_get_path('theme', 'any_theme_name') . "/css/foo.css");   
    }
  }
  // Some other code here
}

2

এটি আপনার 'টেমপ্লেট.এফপি' ফাইলটিতে যুক্ত করার চেষ্টা করুন:

function mytheme_preprocess_page (&$variables)
{
  if (drupal_is_front_page()) {
    drupal_add_css(drupal_get_path('theme','mytheme'). '/css/front.css');
  } 
}

আপনার থিম ডিরেক্টরিটির নামের সাথে 'মাইথেম' এবং আপনার সিএসএস ফাইল যেখানে রয়েছে তার সাথে '/css/front.css' প্রতিস্থাপন করুন।

অন্যান্য পৃষ্ঠাগুলি থেকে 'সম্মুখের সিএসএস' ফাইলটি আনসেট করতে 'টেমপ্লেট.এফপি' যুক্ত করার চেষ্টা করুন:

function hook_css_alter(&$css) {
  if (!drupal_is_front_page()) {
    unset($css[drupal_get_path('theme', 'mytheme') . '/css/front.css']);
  }
}

আবার 'থিম ডিরেক্টরি'র নামের সাথে' মাইথিম 'প্রতিস্থাপন করুন।

প্রথম পৃষ্ঠা থেকে যদি আপনার 'স্টাইলস সিএসএস' আনসেট করতে হয় তবে কেবল এই দুটি কোড একত্রিত করুন।

ধরে নেওয়া যাক আপনার প্রথম পৃষ্ঠায় 'স্টাইলসিএসএস' ছাড়াই 'ফ্রন্ট সিএসএস' এবং অন্য সমস্ত পৃষ্ঠায় 'ফ্রন্ট সিএসএস' ছাড়াই 'স্টাইল সিএসএস' দরকার need কোড এর মতো কিছু দেখবে:

function mytheme_preprocess_page (&$variables)
{
  if (drupal_is_front_page()) {
    drupal_add_css(drupal_get_path('theme','mytheme'). '/css/front.css');
  } 
  else {
    drupal_add_css(drupal_get_path('theme','mytheme'). '/css/styles.css');
  }
}

function hook_css_alter(&$css) {
  if (drupal_is_front_page()) {
    unset($css[drupal_get_path('theme', 'mytheme') . '/css/styles.css']);
  }
  else {
    unset($css[drupal_get_path('theme', 'mytheme') . '/css/front.css']);
  } 
}

এছাড়াও, 'মাইথিম' প্রতিস্থাপন করুন।

আমি আশা করি এটি সহায়ক হবে।


কোডের শেষ টুকরোটি যা আমার প্রয়োজন ছিল। এবং এটি কাজ করে, অর্থাত্, আমি আমার থিম.info থেকে শৈলীপত্রগুলি [সমস্ত] []] সিএসএস / ফ্রন্ট সিএসএস অপসারণ করার পরে - আমি অনুমান করি যে আমি ভুলভাবে ধরে নিয়েছি যে স্টাইলশিটগুলির সাথে আমাদেরও [সকল] [] = সিএসএস / শৈলী থাকা দরকার সিএসএস। আমি আরও উদ্বিগ্ন ছিলাম যেহেতু আমি পেজ - front.tpl.php সহ পৃষ্ঠা.tpl.phpকে ওভাররাইড করছি কারণ এটি কার্যকর নাও হতে পারে তবে সবকিছুই দুর্দান্তভাবে ধরেছে বলে মনে হচ্ছে। এটি সত্যই সহায়ক। ধন্যবাদ!
এসডি 1 ই

সকলেই এই সমাধান পেয়েছে তা নিশ্চিত করার জন্য; আপনার থিম.info ফাইল থেকে শৈলী। সমস্ত ক্যাশে ফ্লাশ করুন এবং এটি যাওয়া ভাল।
এসডি 1

1

আমি টেমপ্লেট.এফপি সম্পূর্ণরূপে এড়িয়ে গেছি এবং কেবল আপনার থিমের ইনফো ফাইলটিতে অন্য আইটেম যুক্ত করব

বলুন আপনার স্টাইলশিটটি ভিতরে আছে css/foo.css

আপনার থিম_নাম.ইন.ফো ফাইলটি এইভাবে দেখবে:

name = Theme Name
...
stylesheets[all][] = css/foo.css

তারপরে আপনি এটি মূল স্টাইলশিটের সাথে ক্যাশে করে উপকৃত হবেন এবং যেহেতু আমি ধরে নিচ্ছি এটি আপনার হোমপৃষ্ঠের জন্য এটির অর্থ হবে।


এবং অবশ্যই আপনাকে নোডের গুণাবলী, যেমন নিড, নোডের প্রকার ইত্যাদির উপর ভিত্তি করে আপনার নির্বাচকদের যোগ্যতা অর্জন করতে হবে
আলেকজান্ডার হ্রিপাক

এই পদ্ধতির সমস্যাটি হ'ল এটি এখানে সিএসএস যুক্ত সাইটের সমস্ত পৃষ্ঠাগুলিকে প্রভাবিত করবে
pal4Live

1

ড্রুপাল পদ্ধতির পাশাপাশি, যখন আপনার কেবলমাত্র আপনার এইচটিএমএল 5 শরীরের অভ্যন্তরে সিএসএসের একটি সংক্ষিপ্ত অংশ প্রয়োজন, আপনার সিএসএস স্কোপযুক্ত বৈশিষ্ট্য রয়েছে have Https://stackoverflow.com/a/4607092/195812 দেখুন

এই সমাধানটি আপনাকে কোড সম্পাদনা করা এবং আরও মডিউল ইনস্টল করা থেকে রক্ষা করবে


0

আপনি বডি-ট্যাগে পৃষ্ঠা নোডটি মুদ্রণ করতে পারেন

<body page-node-26419 ...>

তারপরে আপনি সীমাবদ্ধ করতে পারেন

body.page-node-26419 {
    background: red
}

এটি ছোটখাট দ্রুত পরিবর্তনের জন্য কার্যকর


দ্রুপাল উত্তরগুলিতে আপনাকে স্বাগতম! এই উত্তরটি ইতিমধ্যে ডেভ রেড উপরে সরবরাহ করেছে।
কোজো
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.