ممكن است از خودتان پرسیده باشید كه چگونه می توان برای صفحات مختلف در جوملا، استایل های متفاوت تعریف كرد. از آنجایی كه وب سایت های مبتنی بر جوملا تنها از یك قالب برای نمایش خروجی استفاده می كنند (البته امكان تعریف بیش از چند قالب و استفاده از آنهادر كنار همدیگر وجود دارد كه مورد بحث این مقاله نیست) انجام چنین كاری در ابتدا كمی نا ممكن به نظر می رسد ولی با استفاده از Page Class Suffix می توان چنین قابلیتی را در قالبهای جوملا پدید آورد. شما با استفاده از Page Class Suffix می توانید برای صفحات مختلف، تصاویر پس زمینه متفاوت تعریف كنید و یا رنگ متن و رنگ پس زمینه صفحات خاصی از وب سایت خود را تغییر دهید و بطور كلی هر استایلی را كه بخواهید برای صفحات دلخواه، تعریف كنید. به عبارتی دیگر، برای تمامی المانهای موجود دریك صفحه (یا صفحات) دلخواه می توانید با استفاده از Page Class Suffix استایل تعریف كنید (چه تصویر و چه متن).
Page Class Suffix دقیقا عملكردی شبیه به Module Class Suffix دارد با این تفاوت كه Module Class Suffix بر روی ماژول های جوملا تاثیر می گذارد و شما با استفاده از آن می توانید استایل های مختلف برای ماژول ها تعریف كنید در حالی كه Page Class Suffix بر روی Main Body اثر می گذارد؛ بنابراین برای تمامی آنچه كه در Main Body نمایش داده می شود (اعم از صفحات محتوایی و یا خروجی كامپوننت های جوملا) می توان استایل های متفاوت تعریف كرد.
چگونه Page Class Suffix را به صفحات خود اختصاص دهیم؟
فرض كنید كه ما صفحه ای داریم كه می خواهیم از لحاظ ظاهری با بقیه صفحات متفاوت باشد. برای این منظور باید به آن صفحه Page Class Suffix اختصاص دهیم. برای اختصاص Page Class Suffix به یك صفحه مراحل زیر را باید طی گردد:
ابتدا باید منویی كه به صفحه مورد نظر پیوند ایجاد كرده است را انتخاب كنیم.
حال وارد صفحه مدیریت گزینه منو می شویم.
در سمت چپ صفحه، بر روی پارارمترها(سیستم) كلیك می كنیم تا منوی كشویی باز شود.
همانطور كه در شكل نشان داده شده است، شما می توانید پارامتر Page Class Suffix را در این قسمت تنظیم كنید. مثلا مقدار -suffix1 را در این فیلد وارد می كنیم و بر روی Save كلیك می كنیم تا تغییرات اعمال شده در سیستم ذخیره گردد. با این كار شما توانستید كه به یك صفحه خاص Page Class Suffix اختصاص دهید. حال باید بررسی كنیم كه این پسوند چگونه می تواند خروجی تولید شده توسط جوملا را تغییر دهد. بعد از اضافه كردن Page Class Suffix باید استایل هایی كه مد نظرمان هست را به فایل template_css.css اضافه كنیم ولی قبل از اینكه به این موضوع بپردازیم، نحوه ایجاد خروجی صفحات توسط جوملا را بررسی می كنیم.
تصویر
در جوملا محتویات مقالات - Content Items درون یك جدول HTML بنام contentpaneopen نمایش داده می شوند. هنگامی كه به یك صفحه Page Class Suffix اختصاص می دهیم، پسوند تعریف شده، به انتهای نام كلاس contentpaneopen اضافه می شود و كلاس جدیدی بنام contentpaneopen-suffix1 بوجود می آورد. همین مساله در مورد كلاسهای contentheading و blog نیز صادق است. بنابراین، جوملا به جای اینكه محتویات صفحه مورد نظر را در داخل جدول table.contentpaneopen نمایش دهد، آن را درون table.contentpaneopen-suffix1 نمایش می دهد. همچنین عنوان مقاله درون سلول td.contentheading-suffix1 به نمایش در می آید.
بنابراین شما می توانید با تعریف استایل های مختلف برای كلاس های ایجاد شده، ویژگی های ظاهری المان های موجود درصفحه مورد نظر را تغییر دهید:
table.contentpaneopen-suffix1{
/* Put your css styles here */
}
td.contentheading-suffix1{
/* Put your css styles here */
}
همین كار را ما می توانیم به جای اینكه برروی یك صفحه محتوایی – Content Item انجام دهیم، بر روی خروجی یك كامپوننت اعمال كنیم. مثلا اگر بخواهیم استایل خاصی را فقط برای كامپوننت تماس (contact us) اختصاص دهیم، ابتدا از لیست منوها، منویی كه حاوی لینك به صفحه تماس با ما است را انتخاب كرده و بر روی آیتم منو كلیك می كنیم تا وارد صفحه تنظیمات آیتم منو شویم. دوبار مثل حالت قبل از قسمت پارامترها (سیستم) مقدار پارامتر پسوند کلاس صفحه (Page Class Suffix) را وارد می كنیم. جوملا محتویات كامپوننت ها را درون div.contentpane و عنوان كامپوننت را درون div.componentheading نمایش می دهد. هنگامی كه به یك كامپوننت Page class suffix اختصاص می دهیم، این پسوند به اسم كلاس های فوق اضافه می شود و كلاس های جدیدی را به وجود می آورد. Div.contentpane-suffix1 و div.componentheading-suffix1 حال نوبت به تعریف استایل برای كلاس های فوق است. شما می توانید هر استایلی را كه دوست داشته باشید برای این كلاس ها تعریف كنید.
بنابراین با استفاده از Page Class Suffix ما می توانیم خروجی تك تك صفحات وب جوملا را سفارشی كنیم به گونه ای كه آن ها از لحاظ ظاهر با یکدیگر تفاوت داشته باشند.
منبع : پرشیا سئو






