|
توضیح کلی |
|
قالب های نوع awt1 و awt2 در ابتدای توسعه برنامه و به صورت عمومی برای همه پایگاه ها طراحی شده بودند.
با گذشت زمان و توسعه فناوری های جدید، استفاده از این فناوری ها برای ارتقای ظاهر گرافیکی برنامه ضروری به نظر می رسید.
برای تحقق این امر طرح بهسایت آغاز شد و طی چند سال اخیر تعدادی از سایت ها از این طرح استفاده کردند.
اما این روش کند و پر هزینه بود و همه سایت ها نتوانستند از آن استفاده کنند.
در نهایت برای افزایش زیبایی و کارآیی همه سایت ها، این نتیجه رسیدیم که قالب های جدیدتری را به صورت اختصاصی متناسب با هر نوع پایگاه (نشریه، همایش، انجمن و ...) توسعه داده و به صورت رایگان در اختیار همه پایگاه ها قرار دهیم.
در حال حاضر قالب پایگاه نشریات تکمیل شده است و نصب آن آغاز گردیده است. امیدواریم تا پایان سال 1394، قالب اختصاصی را برای تمام سامانه های اصلی شرکت در اختیار مشتریان قرار دهیم.
مشاهده نمونه قالب مدرن یک - ویژه نشریات:
پایگاه نمونه برخط (آنلاین) |
تصویر قابل دریافت + راهنمای قالب
مشاهده نمونه قالب مدرن دو - ویژه انجمن ها:
پایگاه نمونه برخط (آنلاین) |
تصویر قابل دریافت + راهنمای قالب
مشاهده نمونه قالب مدرن سه - ویژه همایش ها:
پایگاه نمونه برخط (آنلاین) |
تصویر قابل دریافت + راهنمای قالب
مشاهده نمونه قالب مدرن چهار - قالب عمومی:
پایگاه نمونه برخط (آنلاین) |
تصویر قابل دریافت + راهنمای قالب
مشاهده نمونه قالب مدرن پنج - قالب عمومی:
پایگاه نمونه برخط (آنلاین) |
تصویر قابل دریافت + راهنمای قالب
مشاهده نمونه قالب مدرن شش - ویژه نشریات:
پایگاه نمونه برخط (آنلاین) |
تصویر قابل دریافت + راهنمای قالب
مزایای قالب های مدرن:
قالب های جدید با کمک فناوری های جدیدتری توسعه داده شده اند. استفاده از div به جای table سرعت بارگذاری صفحات را افزایش داده و نیز باعث تسهیل استفاده از پایگاه از طریق موبایل و تبلت گردیده اند. همچنین با فعال شدن ویرایشگر جدید مشکل کپی کردن مطالب از ورد در مرورگر فایرفاکس حل شده است.
در توسعه این قالب، حداکثر امکانات تغییر توسط کاربر برای اختصاصی سازی مد نظر بوده است.
به همین دلیل در برخی بخش ها، کدهای استفاده شده به صورت فایل های txt در دسترس قرار گرفته اند تا به سادگی قابل ویرایش باشند.
هر چند این امر در اولین نگاه باعث پیچیدگی کار با قالب می شود، اما با کمی دقت و تمرین مزایای استفاده از فایل های متنی را احساس خواهید کرد.
(این روش مشابه مزیت کار با خط فرمان در لینوکس نسبت به محیط گرافیکی در ویندوز است.)
همچنین امکان اضافه کردن کدهای جدید به css و java script فراهم شده است که در انتهای همین صفحه توضیح داده شده است.
نکته های مهم:
- امکان تست قالب جدید قبل از فعال سازی و نیز فعال و غیر فعال کردن قالب جدید همواره وجود دارد.
- با فعال کردن قالب جدید برخی تنظیمات پایگاه (تنظیمات صفحه اصلی، مدیریت مطالب در صفحه اصلی و ...) دیگر تابع بخش تنظیمات نیستند و باید از طریق همین صفحه تنظیم شوند.
- بلوکهای جانبی بخش مدیریت بلوک ها فعلا در صفحه اصلی و فرعی فعال نیستند. بلکه بلوک های متنی به جای آنها در نظر گرفته شده اند..
- امکان ویرایش فایل های قالب کل بخش های برنامه و نیز امکان توسعه قالب جدید در برنامه فراهم است..
- اگر با روش معرفی شده در زیر نمی توانید قالب را تغییر دهید می توانید فایل ها و توضیحات لازم را برای شرکت ایمیل کنید تا ما قالب جدید را برای سایت شما تنظیم کنیم.
- هر نوع اشکال فنی در خصوص قالب ها را می توانید با ایمیل شرکت یا شماره تماس 021-22096045 (آقای نظری) مطرح کنید.
|
|
روش کار |
|
برای استفاده از این قالب می توانید تنظیمات لازم را در این صفحه انجام دهید و پس از پایان کار، قالب پایگاه را تست کرده و در صورت مناسب بودن، آن را تغییر دهید.
تنظیمات شامل تغییر فایل های css و تصاویر قالب (در صورت نیاز به تغییر رنگ)، تنظیمات متون ظاهر شده در صفحه اول پایگاه و
تنظیم منوهای بالای صفحه (صفحات پایگاه) می باشند که همه موارد را می توانید از همین صفحه تنظیم کنید.
همچنین می توانید تصاویر و لوگوهای اختصاصی خود را فراگذاری کنید.
برای نمایش اخبار پایگاه در صفحه اصلی هم می توانید کد های انتقال مطلب را در فایل های متنی قالب ویرایش کنید. |
|
ساخت قالب: تغییر رنگها و تصاویر قالب با کمک فایل فتوشاپ |
|
1-
برای توسعه و تغییر قالب می توانید فایل tpl_modern01_source.zip را دریافت کنید و آنرا Unzip کنید.
|
2 - فایل را با کمک فتوشاپ ویرایش کنید. بعد از ویرایش فایل PSD می توانید تصاویر را با روش save for web خروجی بگیرید. |
3- به بخش تنظیمات قالب مدرن وارد شوید و فایل ها را آپلود و تایید کنید تا قالب جدید ساخته شود |
4- تنظیمات متون و لینک ها را از بخش تنظیمات قالب مدرن ادامه دهید و قالب را تست و بعد از نهایی شدن فعال کنید. |
|
|
تصاویر اصلی بخش فارسی |
تصویر لوگوی اصلی برای سمت راست هدر صفحه فارسی |
header_right_fa.png - 150px * 110px |
تصویر فرعی برای سمت چپ هدر صفحه فارسی |
header_left_fa.png - 310px * 110px - در صورت تمایل می توانید عنوان انگلیسی یا لوگوی اضافی را هم در آن وارد کنید. |
تصویر فرعی برای سمت چپ فوتر صفحه فارسی |
footer_fa.png - 310px * 110px |
تصویر اصلی وسط صفحه فارسی (جلد نشریه) |
main_fa.png - 293px * 410px |
|
تصاویر اصلی بخش انگلیسی |
تصویر لوگوی اصلی برای سمت راست هدر صفحه انگلیسی |
header_right_en.png - 150px * 110px |
تصویر فرعی برای سمت چپ هدر صفحه انگلیسی |
header_left_en.png - 310px * 110px - در صورت تمایل می توانید عنوان فارسی یا لوگوی اضافی را هم در آن وارد کنید. |
تصویر فرعی برای سمت چپ فوتر صفحه انگلیسی |
footer_en.png - 310px * 110px |
تصویر اصلی وسط صفحه انگلیسی (جلد نشریه) |
main_en.png - 293px * 410px |
تمام مطالب تب های وسط صفحه، بلوک های حاشیه صفحه، متن روی تصویر مجله و نیز متون پایین صفحه به صورت فایل های متنی
در شاخه modern01 قرار گرفته اند. شما می توانید با ویرایش متون داخل این فایل ها نسبت به ویرایش این اجزا اقدام کنید. دقت کنید که قبل از هر نوع تغییر از فایل ها backup تهیه کنید تا اگر اشکالی پیش آمد از فایل پشتیبان استفاده کنید. |
|
|
معرفی فایل های مرتبط و روش توسعه و تغییر قالب |
|
|
کلیه فایل های قالب در شاخه مرتبط در templates (مثل templates\tmpl_modern01 ) قرار دارند.
فایل های جاوا اسکریپت، تصویر و css نیز در شاخه های مجزا به صورت زیر قرار گرفته اند:
|
|
/js/jquery.js |
فایل jquery.js برنامه |
/js/js_global.js |
فایل js اصلی برنامه برای قالب مدرن 1 |
/js/js_global2.js |
فایل js اصلی برنامه برای قالب مدرن 2 |
/js/js_local.js |
فایل js قابل تغییر (می توانید آن را ویرایش کنید و کدهای لازم را در آن اضافه کنید) |
|
/css/reset.css |
فایل css reset برنامه |
/css/style_global.css |
فایل css عمومی برنامه که برای هر زبانی بارگذاری می شود |
/css/style_fa.css |
فایل css برنامه برای صفحات فارسی |
/css/style_en.css |
فایل css برنامه برای صفحات انگلیسی |
/css/style_local.css |
فایل css قابل تغییر (می توانید آن را ویرایش کنید و کدهای لازم را در آن اضافه کنید) |
|
/font |
پوشه مخصوص فونت ها - فونتهای اصلی برنامه در شاخه fonts در root پایگاه قرار گرفته اند. |
/images |
پوشه مخصوص تصاویر قالب |
/src |
پوشه مخصوص منابع اصلی مثل قالب های CSS و فایل های PSD |
توجه: در صورتی که می خواهید فهرست یا چکیده مطالب، آلبوم، نظرسنجی، فهرست صفحات (منوها)، محتوای فایل ها یا هر نوع محتوای دیگری از اجزای پایگاه به صورت خودکار در میان قالب درج شوند، راهنمای استفاده از کدهای نمایش محتوا را مطالعه کنید.
در صورتی که می خواهید برای پایگاه خود قالب اختصاصی داشته باشید، می توانید ابتدا قالب مدرن را نصب کنید. سپس فایل های آن را تغییر دهید.
- فایل های تغییر یافته tpl خود را باید در شاخه قالب مدرن در زیرشاخه custom_tpls کپی کنید تا دیگر در هنگام بروزرسانی برنامه بازنویسی نشوند.
- کدهای css جدید خود را می توانید در فایل local.css در زیرشاخه css اضافه کنید. امکان تغییر سایر فایل های css نیز وجود دارد (فایل های css در بروزرسانی بازنویسی نمی شوند)
- کدهای js جدید خود را می توانید در فایل js_local.js در زیرشاخه js اضافه کنید.
- اگر غیر از تغییرات زیر، تغییر دیگری در هدر صفحات لازم بود (که معمولا نیست) از طریق بخش تنظیمات قالب می توانید کدهای لازم را در بخش head اضافه کنید.
- تصاویر قالب را می توانید در زیرشاخه images اضافه کنید. دقت کنید که
فقط تصاویر ثابت قالب را در این زیرشاخه اضافه کنید و اگر تصویری مربوط به محتوای پایگاه است در شاخه ای مناسب (مثل custom_tpl_files)
در بخش پوشه ها و فایل ها فراگذاری کنید تا
مدیر پایگاه برای
تغییر آن ها دسترسی داشته باشد.
- برای ساخت هر صفحه چند فایل tpl استفاده می شود. برای اطلاع یافتن از فایل های tpl بارگذاری شده در هر صفحه می توانید گزینه مربوطه را فعال کنید.
سفارشی کردن قالب های مدرن (طراحی قالب اختصاصی):
اگر می خواهید قالب اختصاصی برای سایت خود داشته باشید می توانید قالب مدرن یک را به صورت عمومی نصب کنید و سپس فایل های آن را ویرایش کنید. همه اجزا (CSS، JS و فایل های HTML قابل ویرایش هستند).
برای طراحی قالب اختصاصی به صورت مستقل از پایگاه می توانید فایل نمونه قالب مدرن را از اینجا دریافت کنید. دقت کنید که اگر می خواهید برای اسلایدر یا منوها همچنان از امکانات مدیریتی برنامه استفاده کنید باید آنها را مطابق css و کدهای html این نمونه تهیه کنید.
|
|
|
سایر دکمه ها و پیوندها |
|
دکمه های اشتراک اطلاعات مربوط به ارایه خروجی هایی مثل RSS و XML یا پیوند به شبکه های اجتماعی می باشند.
البته خودتان هم می توانید دکمه های این بخش را با کمک ابزار تولید HTML تغییر دهید.
دقت کنید که باید به جای علامت # نشانی مورد نظر خود را (با درج http:// در ابتدا ) جایگزین کنید.
|
|
برخی موارد قابل استفاده برای
دکمه های اشتراک اطلاعات بالای صفحه فارسی: |
<a href="./webmail" class="social_btn social_mail" title="پست الکترونیک"></a>
<a href="jinfo.xml.php" class="social_btn social_xml" title="ایکس ام ال نشریه"></a>
<a href="rss.php?lang=fa" class="social_btn social_rss" title="آر اس اس مقالات"></a>
<a href="#" class="social_btn social_in" title="linkedin"></a>
<a href="#" class="social_btn social_tw" title="twitter"></a>
<a href="#" class="social_btn social_goo" title="google plus"></a>
<a href="#" class="social_btn social_face" title="facebook"></a>
|
برخی موارد قابل استفاده برای
دکمه های اشتراک اطلاعات بالای صفحه انگلیسی: |
<a href="./webmail" class="social_btn social_mail" title="eMail"></a>
<a href="jinfo.xml.php" class="social_btn social_xml" title="Journal XML"></a>
<a href="rss.php?lang=en" class="social_btn social_rss" title="Articles RSS"></a>
<a href="#" class="social_btn social_in" title="linkedin"></a>
<a href="#" class="social_btn social_tw" title="twitter"></a>
<a href="#" class="social_btn social_goo" title="google plus"></a>
<a href="#" class="social_btn social_face" title="facebook"></a>
|
|
راهنمای سفارشی سازی قالب ها در قالب های مدرن:
توسعه و ویرایش قالب + سفارشی کردن قالب برای زیربخش ها، صفحات و زبان مورد نظر (جمعی)
نمایش tpl های استفاده شده توسط برنامه
با فعال کردن آن قالب مشخص می شود:
[ فایل قالب این بخش : person_view.tpl - /opt/lampp/htdocs/templates/tmpl_modern01/person_view.tpl ]
سپس می توانید این قالب را دانلود کنید:
و پس از ویرایش در پوشه زیر آپلود کنید:
|