ম্যাজেন্টো 2 - সর্বত্র গুরুত্বপূর্ণ!


10

আমি একজন ক্লায়েন্টের জন্য এই মুহুর্তে একটি ম্যাজেন্টো 2 সাইটে কাজ করছি। ধরুন আমার ক্লায়েন্টের ব্র্যান্ডটি boofarএবং যে থিমটি আমি প্রসারিত / ওভাররাইড করার চেষ্টা করছি সেগুলি আমি foobarব্যবহার করে পিতামাত থিম হিসাবে সেট করেছিfrontend/Foobarthemes/boofar/theme.xml

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
<title>Boofar</title>
<parent>Foobarthemes/foobar1</parent>
<media>
    <preview_image>media/preview.jpg</preview_image>
</media>

তারপরে frontend/Foobarthemes/boofar/web/css/source/_theme.lessআমি সিএসএস কোড লিখেছি যা আমি ওভাররাইড করতে চাই। আমি এটি দিয়ে চেষ্টাও করেছি _extend.less

.magicmenu {
  .home {
    display: none !important;
  }
  .nav-desktop .level0 .level-top > span {
    font-size: 12px;
    font-weight: normal;
    text-transformation: none;
  }
}

আমি !importantএখানে কাজ করার জন্য কোনও কিছুতে বাধ্য হতে বাধ্য উপরের কোডটিতে কোনও ফন্ট এবং পাঠ্য সামগ্রী কাজ করে না।

আমি কি ম্যাজেন্টো 2 সম্মুখভাগের কার্যপ্রবাহটি সঠিকভাবে বুঝতে পারি না?


মূল সিএসএস বিধি কোথায় পাওয়া যায়?
অ্যারন অ্যালেন


1
ওয়েব / সিএসএস / কাস্টমসিএসএস (সিম্পল সিএসএস) এ আপডেট করার চেষ্টা করুন এবং ভেরি / ফোল্ডার এবং পাব / স্ট্যাটিক / সামগ্রী / সীমা / আপনার থিম / প্যাকেজ / আপনার থেম / এন_ ইউএস / সিএসএস ফোল্ডার সরান এবং পিএইচপি বিন / ম্যাজেন্টো সেটআপ চালান: স্থির -কোটেন্ট: কমান্ড মোতায়েন।
নিটস

আপনার কাছে থিম.এক্সএমএল "foobar1" পিতামাতাকে "foobar" নয়, থিম
St3phan

উত্তর:


8

আপনি _theme.lessযদি পিতামাত থিমের _theme.lessফাইলটিকে ওভাররাইড করতে চান তবে কেবল ফাইলগুলিতে আপনার স্টাইলগুলি রাখতে চান । এই ফাইলটির জন্য, তাদের মধ্যে কেবল একটি লোড করা হয় এবং ফাইলটি সেখানে উপস্থিত থাকলে এটি সর্বদা নির্বাচিত থিম হবে। সেখান থেকে, ফাইলটি খুঁজে পেতে এবং এটি ব্যবহার করতে এটি ফ্যালব্যাক স্কিমটি ব্যবহার করবে।

সুতরাং আপনার ক্ষেত্রে, _extend.lessফাইলটি ব্যবহার করা সঠিক ফাইল।

এটি যদিও কিছুটা বিভ্রান্তিকর, কারণ _extend.lessফাইলটিতে যে কোডটি দেওয়া হয় তা সর্বশেষে লোড হয় যখন ম্যাজেন্টো সাইটে উপস্থিত সমস্ত শৈলী সংকলন করে। তাই আমি ভাবছি যে লোড অর্ডার নিয়ে কোনও गडটোয়ানা রয়েছে কিনা।

আপনি যেভাবে এটি সেট আপ করেছেন সেদিকে নজর রেখে, আপনার থিমটি একই থিমের পরিবর্তে ভিন্ন নেমস্পেসে সেট করার চেষ্টা করুন। এটি আপনার সমস্যাটি যেমন সমাধান করতে পারে না তেমনি আপনার থিম সেট আপ করার পদ্ধতিটি যেমন ম্যাজেন্টোতে লুমা / ফাঁকা থিম সেট আপ করা হয়েছে তেমনই। তবে আমি যে সমস্ত কাজ করেছি তার জন্য আমার কাছে আমার বিক্রেতার নামস্থান রয়েছে যা তৃতীয় পক্ষের থিম বা লুমা / ফাঁকা থেকে প্রসারিত হবে।

চেষ্টা করার পরের জিনিসটি হ'ল মিডিয়া কোয়েরিতে অন্তর্নিহিত আপনার কোডটি মোড়ানো হবে pping আমি এখানে আরও বিশদে যাচ্ছি , তবে মূলত এটি আপনার স্টাইলগুলিকে styles-l.cssএবং styles-m.cssফাইলগুলিতে দুবার লোড হওয়া থেকে বিরত রাখে ।

//
//    Common
//--------------------------------------
& when (@media-common = true) {}  

সেখান থেকে, এটি সমস্ত সিএসএসের স্পেসিফিকেশনে নেমে আসে। যদি আরও কিছু উচ্চ থাকে তবে আপনার, আপনার শৈলীতে আপনার শ্রেণি / আইডি সংজ্ঞায় আরও নির্দিষ্ট হওয়া দরকার। আপনি কী লক্ষ্যবস্তু করছেন এবং কী লক্ষ্য করে যাচ্ছেন তার চেয়ে বেশি কী ঘটছে তা দেখাতে আপনি ডিওএম কাঠামোর একটি ছবি পোস্ট করতে চাইতে পারেন।


ভাল পয়েন্ট - সম্ভবত আমি যে থিমটি ব্যবহার করছি (তৃতীয় পক্ষ) কিছু অদ্ভুত কিছু করছে তবে আপনি যদি বলছেন যে আমি যদি ডিফল্ট থিমের জন্য একই ওভাররাইড করি তবে আমার ব্যবহার করা উচিত হবে না। এটি একটি চেষ্টা মূল্য?
ফ্রান্সিস কিম

1
আমি তাই, আপনি শুধু শুধু সঙ্গে একটি দ্রুত থিম তৈরি করতে পারেন মনে registration.php, theme.xmlওয়েব ফোল্ডার এবং। পুনরায় রচনা করুন এবং তারপরে এডমিনে এটি নির্বাচন করুন এবং দেখুন কী ঘটে। আমি ভাবছি অন্য কিছু চলছে, তবে এটি একটি সম্ভাবনা হিসাবে আমার মাথায় .ুকে গেল।
সার্কিটগুলি

1
এছাড়াও, যেমন স্যানিটি চেক হিসাবে আপনি নিজের স্টাইলগুলিতে অনন্য একটি মান রাখতে পারেন (আমি background-color: tomatoকখনও সেই রঙটি ব্যবহার করি না এমন হিসাবে ব্যবহার করতে চাই ) এবং শীটটি শেষ হয় এমন সংকলিত শৈলীতে পরীক্ষা করে দেখুন। pub/static/frontend/{package}/{theme}/en_us/cssউভয় স্টাইল ফাইল জন্য সন্ধান করুন । যদি এটি ফাইলের শেষে না থাকে তবে ডিফল্ট লোড ক্রমের সাথে কিছু স্ক্রু করছে।
সার্কিটগুলি

4

আপনি যদি আপনার শৈলীগুলি _extend.less ফাইলটিতে প্রয়োগ করতে সক্ষম হন তবে এর অর্থ আপনার সিএসএসের নির্দিষ্টতা নিয়ে সমস্যা রয়েছে। যেহেতু Magento2 কম সংকলন ব্যবহার করে, বেশিরভাগ শৈলী খুব নির্দিষ্ট। সেগুলি ওভাররাইড করতে আপনার শৈলীর নির্বাচকদের অবশ্যই আরও বা সমানভাবে নির্দিষ্ট হতে হবে। অনলাইনে পাওয়া যাবে বলে প্রচুর নিবন্ধ রয়েছে বলে আমি নিজেই এখানে ধারণার বিশদটি পোস্ট করব না।


3

আপনি যদি ডিফল্ট LESS সেটআপ ব্যবহার করছেন তবে নিশ্চিত হয়ে নিন যে আপনার সমস্ত কম M2 LESS মিডিয়া প্রশ্নের ভিতরে লেখা আছে। আপনি যদি না করেন তবে ডুপ্লিকেট সিএসএস এবং সম্ভবত নির্দিষ্টকরণের সমস্যাগুলি শেষ করবেন।


এটি সমস্ত সুনির্দিষ্টতা এবং লোড অর্ডারে নেমে আসে, আপনার সিএসএস প্যারেন্ট থিমগুলির (বা মডিউলগুলি) পরে লোড করা উচিত যাতে আপনার যা করা দরকার তা তাদের স্পেসিফিকেশন পূরণ করতে হবে।

উদাহরণস্বরূপ যদি পিতামাতার থিমটি ব্যবহার করে

.parent-selector .selector {
    ...
}

তারপরে আপনাকে একই নির্বাচকটি লিখতে হবে, যদি কোনও কারণে কাজ না করে তবে আপনাকে আরও আগে একজন নির্বাচক যুক্ত করার আগে এটির প্রয়োজন। একটি সহজ উপায় হল এর আগে শরীর যুক্ত করা, কারণ এটি প্রতিটি নির্বাচককে coversেকে রাখে এবং নির্দিষ্টতা যুক্ত করে। তাই ভালো:

body .parent-selector .selector {
    ...
}

এই নিবন্ধটিতে সিএসএসের নির্দিষ্টতা সম্পর্কে কিছু ভাল তথ্য রয়েছে।

বিকল্পভাবে আপনি পুরো ফাইলটি ওভাররাইট করতে পারেন

আপনি যদি অনেকগুলি কাস্টমাইজেশন করেন তবে প্রসারিত না করে পুরো ফাইলটি ওভাররাইট করা আরও ভাল অনুশীলন। এটি করার জন্য কেবল একই থিমটিতে একই ফাইলের পাথ এবং নাম ব্যবহার করে ফাইলটি যুক্ত করুন।


0

উচ্চ অগ্রাধিকারের জন্য আপনি নির্বাচককে নকল করতে পারেন:

  .home.home {
    display: none;
  }

ভালো পরামর্শ! তবে দুর্ভাগ্যক্রমে আমি যা করছি তা নয়।
ফ্রান্সিস কিম

0

আপনি যে .lessপ্যারেন্ট থিমটি ওভাররাইড করতে চান তার একই ফাইলটি ওভাররাইড করতে হবে, আপনি যদি _theme.lessফাইলটি ওভাররাইড করতে চান তবে আপনাকে এই ফাইলটি এখানে শিশু থিমে অনুলিপি করতে হবে (প্যারেন্ট থিমের একই পথটি নিশ্চিত করুন)

frontend/Foobarthemes/boofar/web/css/source/_theme.less

আপনি এখানে আপনার সিএসএস ওভাররাইড করতে পারেন।


0

আপনার কাস্টম সিএসএস ফাইলগুলি ইনজেকশন করা ভাল।

আরও পড়ুন: ম্যাজেন্টো 2 এ কীভাবে একটি কাস্টম সিএসএস ফাইল যুক্ত করবেন

এবং দস্তাবেজগুলি: http://devdocs.magento.com/guides/v2.1/frontend-dev-guide/css-topics/css-overview.html

: ঘোঁৎ ঘোঁৎ ব্যবহার কম্পাইল করার / কম CSS প্রক্রিয়া করতে মনে রাখুন http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/css-topics/css_debug.html

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