آموزش ایجاد منو اسکرول و یا هر نوع بنر و دکمه بصورت اسکرول متحرک و زیبا در جوملا

[majid_aqaiy 34]

آموزش ایجاد منو اسکرول و یا هر نوع بنر و دکمه بصورت اسکرول متحرک و زیبا در جوملا

با سلام خدمت دوستان گلم و اساتید محترم انجمن

چند وقتی بود دنبال یه منو با قابلیت اسکرول چسبیده به بدنه سایت میگشتم(دمو اون در پایین هست و میتونید مشاهده کنید)

بعد از کلی تلاش تونستم کد رو تو جوملا کار بزارم بدون بهم ریختگی قالب و چون دیدم خیلی ها مثل من دنبال این بودن گفتم آموزش رو بزارم همه

استفاده کنن

البته این آموزش بسیار ساده هستش ولی به نوعی داریم درس پس میدیم به اساتید

با آموزش آموزش ایجاد منو اسکرول متحرک و زیبا در جوملا در خدمت شما هستیم

نمونه دمو از این منو سمت چپ این سایت قابل مشاهده هستش میتونید ببینید

seonq | seo , web design ،طراحی سایت، طراحی وب، سئو و بهینه سازی سایت

مواد لازم :

1:دانلود سورس این منو که حاوی فایل css و دمو و فایل عکس و پی اس دی فایل عکس جهت تغییر در فوتوشاپ رو داشته باشید لازم داریم

demo دانلود ● آپلود سنتر انجمن جوملای ایران

توسط استادم و دوست عزیزم مهندس فلاح در انجمن قرار داده شده دانلود کنید

2:دانلود و نصب افزونه Blank Module ماژول خالی

Blank Module - Joomla! Extensions Directory

آموزشی در مورد این افزونه توسط خودم میتونید مطالعه کنید خیلی به کار میاد

آموزش آموزش اجرای کد و اسکریپت و ماژول در مطالب سایت و هرجایی که دوست دارید به هر شکل

3:دانلود و نصب پلاگین EasyScript

easyscript17v24 دانلود ● آپلود سنتر انجمن جوملای ایران

آموزشی در مورد این افزونه توسط استاد طالبی میتونید مطالعه کنید خیلی به کار میاد

معرفی پلاگین درج کد جاوا و css در head قالب :: EasyScript Plugin

4:دانلود و نصب افزونه BT Floating Banner

mod_bt_floater_j2.5_Persian دانلود ● آپلود سنتر انجمن جوملای ایران

آموزشی در مورد این افزونه توسط دوست خوبم عباس فلاح میتونید مطالعه کنید خیلی به کار میاد

*منتشر شد* افزونه ی درج ماژول های متحرک در کنار سایت

حالا آموزش

بعد از این که اینایی که بالا گفتم نصب کردین و دانلود کردین و یه مقدار با اون لینکایی که گذاشتم متوجه شدین این افزونه ها چیکار میکنن

میریم سراغ پیاده سازی

1:فایل styles.css و فولدر img رو در هاست خود بریزید در یک فولدر هر جا که دوست داشتید ترجیحا فولدر قالب سایت

نکته برای اینکه منو ساخته شده همراه با اسکرول بالا و پایین بره

در فایل

styles.css نوشته position:relative به position:fixed تغییر بدید

2: به بخش پلاگین ها برید پلاگین EasyScript رو باز کنید و مسیر فایل styles.css رو در قسمت StyleSheet1 URL وارد کنید

مثال: http:// www .sitename.com/images/img/styles.css

پلاگین رو فعال و ذخیره کنید

3:به بخش ماژول ها برید و Blank Module رو انتخاب کنید واین کد رو در قسمت html وارد کنید و در یک موقیت فرضی انتشار بدید

مثلا m1 (این نام نباید جزو نام های موقعیت های قالب باشد).

<div id="fixeds">
<ul id="navigationMenu" style:posi="">
   <li>
    <a class="home" href="">
           <span>صفحه اصلی</span>
       </a>
   </li>

   <li>
   	<a class="about" href="">
           <span>درباره ما</span>
       </a>
   </li>

   <li>
     <a class="services" href="">
           <span>خدمات</span>
        </a>
   </li>

   <li>
     <a class="services" href="">
           <span>محصولات</span>
        </a>
   </li>

   <li>
   	<a class="portfolio" href="">
           <span>نمونه کار</span>
       </a>
   </li>

   <li>
   	<a class="about" href="">
           <span>تماس با ما</span>
       </a>
   </li></ul></div>

داخل دوتا دبل کوتیشن خالی "" میتونید آدرس url منو های سایتتون رو وارد کنید

4:به قسمت ماژول برید و ماژول BT Floating Banner رو فعال کنید و داخلش ماژول خودتون که با Blank Module توش فراخونی کنید اینجا از بین مازول ها اسم ها مشخصه پیداش کنید

ماژول رو تو یکی از موقعیت های قالب انتشار بدید هرجا که شه فرقی نداره فقط حلت نمایش عنوان مخفی باشه

دوستان این کار رو با روش های دیگه و حتی آسان تر هم میشه انجام داد

مثل ماژولی که استاد و دوست عزیزم مهندس صدیقی معرفی کردن

میتونه منو اسکرول درست کنه (اگر فقط منو اسکرول بخواهید)

Glassy Menu - Joomla! Extensions Directory

تمام شد.

امیدوارم خسته نشده باشید

التماس دعا

[Komail 12]

ضمن تشکر

طبق آموزش ها پیش رفتم اما فقط متن منو ها رو نمایش میده؟

[majid_aqaiy 34]

با سلام

لینک بدید برسی بشه

توضیح بیشتری بدید که چه کارهایی انجام دادید

[mohsen_haftom 10]

سلام آقا مجید من هم مشکل دوستمون رو دارم طبق گقته های شما انجام دادم ولی فقط اسم منو ها هستش و تصویری نداره ممنون میشم بنده رو راهنمایی کنید با سپاس

[amir_seddighi 146]

از ماژول آماده glassy menu میتونید استفاده کنید :

**ماژول منو کناری شیشه ای زیبا **

[mohsen_haftom 10]

سلام امیر آقا مشکل اون رو نمیشه برطرف کرد؟؟ اخه خیلی باهم فرق دارن ممنون میشم کمک کنید

[majid_aqaiy 34]

با سلام

تو فایل styles.css

این قسمت کد مسیر عکس رو درست کنید

}

#navigationMenu a{
background:url('img/navigation.jpg') no-repeat;

height:39px;
width:38px;
display:block;
position:relative;
}

این کد رو

img/navigation.jpg

با مسیر عکس در هاست خودتون نغییر بدید

[s.f.m 15]

سلام دوستان من با این آموزش یه ماژول کناری تو سایتم درست کردم واسه اینستاگرام و تلگرام این لینکشه اما مشکل اینه که هرجا این ماژول قرار میگیره و سر میخوره و حرکت میکنه اگه من دکمه یا لینکی داشته باشم اون محدوده کلیک موس کار نمیکنه میشه راهنماییم کنین درستش کنم حیاتیه