ظ‡ط§ظƒ ط§ظ„ظپط¹ط§ظ„ظٹط§طھ [S i L d E r] ظ…ظ† طھط·ظˆظٹط±ظٹ



بسم الله الرحمن الرحيم

~~ ـالسلامـ ـعليكمـ ~~

كالعادة دوما مع الحصري لـ [معهد سكربتاتي]

جديد اليوم هو هاك product الفعاليات أو ما يسمى بـ [ slider ]

الهاك product برمجة أجنبية للمواقع لكن أنا عدلت عليه حتى يكون هاك product للمنتدى

مثل ماهو موجود في الصفحة الرئيسية للمعهد

www.script-ati.com/ma3hd/home.php

وهذي صورة للهاك product



ويعتبر هذا الهاك product لمسة جمالية للصفحة الرئيسية خاصة لما يجد مصمم بارع يتحفه

بالتصاميم الجميلة

ويستعمل الهاك product في طرح فعاليات المنتدى forum من مسابقات و دورات تعليمية و حصريات وغيرها

والآن بعد ما تعرفنا على الهاك product ووضيفته نأتي للمهم وهو طريقة تركيب install الهاك product

--::[ طريقة التركيب install ]::--

لنكون متفقين على كل الأمور أحب أوضح أمر مهم وهو أني راح أشرح طريقة تركيب install الهاك product

على مجلة في بي vBadvanced CMPS لمنتديات الفي بي كما أني راح أشرح طريقة مضمون عرض القالب template

حتى يسهل لمستخدمي المجلات الأخرى تركيب installه بسهولة

بسم الله نبدأ

1-نرفع الملف [ Slider ] للموقع حتى يكون رابطه على هذا الشكل



www.XXXX.com/slider/

2- ندخل لوحة تحكم الإدارة

من القائمة الرئيسية نختار في بي vBa CMPS --- ثم ----> Add Module




3- من الصفحة لي تظهر نختار [Template Module‎]




4- نملىء البيانات بهذا الشكل



-[1]-عنوان الموديل وأنا وضعت " --:: [ الفعاليات ] ::-- "

-[2]-عنوان القالب template

-[3]-إختر الستايل styleات التي تريد أن يظهر بها الهاك product

-[4]-كود code القالب template (راح نشرح طريقةه مع كيفية التعديل عليه)



5- أنهينا طريقة تركيب install الهاك product بنجاح الآن راح نشرح طريقة كيفية التعديل عليه

--::[ طريقة التعديل ]::--

1- من لوحة تحكم الإدارة دوما ومن القائمة الرئيسية

إختر : الإستايل styleات والقوالب ---ثم ---->التحكم بالإستايل styleات



2-إختر الستايل style الذي أضفت فيه قالب template الهاك product في عملية التركيب install

ثم من القائمة إختر تعديل القوالب



3- من قائمة القوالب إختر القالب template لي أنشائته في عملية التركيب install



4-الآن تظهر لنا لوحة التحكم بالقالب template






نأتي لشرح طريقة القالب template خطوة خطوة

رمز PHP:
<code style="white-space:nowrap"> <code> <tr>
<
td class="$bgclass">
</code> </code>

هذا الكود code خاص بمجلة في بي vBadvanced CMPS

وهو لازم في هذه المجلة قبل كتابة أي قالب template

رمز PHP:
<code style="white-space:nowrap"> <code> <!--begin Box-->
<
div align="center">
<
link rel="stylesheet" type="text/css" href="slider/contentslider.css" />
</code> </code>

السطر الأول مجرد تعليق لفصل قالب template الفاعاليات عن كود code المجلة
السطر الثاني لجعل المضمون في الوسط (توسيط)
السطر الثالث لإستدعاء الملف contentslider.css من الموقع


رمز PHP:
<code style="white-space:nowrap"> <code> <script type="text/javascript" src="slider/contentslider.js"></script>
</code> </code>

كود code إستدعاء الملف contentslider.js من الموقع


رمز PHP:
<code style="white-space:nowrap"> <code> <div id="slider1" class="sliderwrapper">
<
div class="contentdiv"> <a href="stats.php"><img border="0" src="slider/1.jpg" width="492" height="266"></a> </div>
<
div class="contentdiv"> <a href="stats.php"><img border="0" src="slider/1.jpg" width="492" height="266"></a> </div>
<
div class="contentdiv"> <a href="stats.php"><img border="0" src="slider/1.jpg" width="492" height="266"></a> </div>
</
div>
<
div id="paginate-slider1" class="pagination"></div>
</code> </code>

كود code مضمون الفعاليات وهذا هو الكود code اللي عليه العمل

ومن خلال هذا الكود code لو تلاحظ فيه أنا كررت جملة joomla ثلاث مرات متتالية

وهي

رمز PHP:
<code style="white-space:nowrap"> <code> <div class="contentdiv"> <a href="stats.php"><img border="0" src="slider/1.jpg" width="492" height="266"></a> </div>
</code> </code>

وهي تنقسم لشيئين فقط دون النظر للبقية

1- رابط الصورة

رمز PHP:
<code style="white-space:nowrap"> <code> slider/1.jpg
</code> </code>

2- الرابط الذي تفتحه

رمز PHP:
<code style="white-space:nowrap"> <code> stats.php
</code> </code>

راح نعطي مثال لو مثلا كان رابط الصورة لي راح تعرضها هو

رمز PHP:
<code style="white-space:nowrap"> <code> http://localhost/vb/Ma3hd/gradients/325-60.jpg
</code> </code>

ورابط الموضوع لي تفتحه الصورة هو

رمز PHP:
<code style="white-space:nowrap"> <code> http://localhost/vb/showthread.php?t=8
</code> </code>

راح تكون الجملة joomla بهذا الشكل

رمز PHP:
<code style="white-space:nowrap"> <code> <div class="contentdiv"> <a href="http://localhost/vb/showthread.php?t=8"><img border="0" src="http://localhost/vb/Ma3hd/gradients/325-60.jpg" width="492" height="266"></a> </div>
</code> </code>

ويكون القالب template ككل بهذا الشكل


رمز PHP:
<code style="white-space:nowrap"> <code>
<tr>
<
td class="$bgclass">
<!--
begin Box-->
<
div align="center">
<
link rel="stylesheet" type="text/css" href="slider/contentslider.css" />
<
script type="text/javascript" src="slider/contentslider.js"></script>
<div id="slider1" class="sliderwrapper">
<div class="contentdiv"> <a href="http://localhost/vb/showthread.php?t=8"><img border="0" src="http://localhost/vb/Ma3hd/gradients/325-60.jpg" width="492" height="266"></a> </div>
<div class="contentdiv"> <a href="stats.php"><img border="0" src="slider/1.jpg" width="492" height="266"></a> </div>
<div class="contentdiv"> <a href="stats.php"><img border="0" src="slider/1.jpg" width="492" height="266"></a> </div>
</div>
<div id="paginate-slider1" class="pagination"></div>
<script type="text/javascript">
featuredcontentslider.init({
id: "slider1",
contentsource: &#91;"inline", ""&#93;,
toc: "#increment",
nextprev: &#91;"<", ">"&#93;,
revealtype: "click",
enablefade: &#91;true, 0.3&#93;,
autorotate: &#91;true, 6000&#93;,
onChange: function(previndex, curindex){
}})</script>
</div>
<!--End Box-->
</td>
</tr>
</code> </code>

إن شاء تكونو فهمتو الطريقة رغم أنها سهلة جدا ولاتحتاج لكل هذا التعقيد

ومتأكد 100% لو يأتي أي شخص يفهم html راح يضحك على كل الشرح طريقة لي وضعته من أجل

هذا الأمر البسيط

المهم لتحميل الهاك product

الرابط الأول

click here

أو على المرفقات

ملاحظة صور الشرح طريقة موجودة مع الملف

دمتم في أمان الله







الملفات المرفقة [TR]
windows-1256''slider hak with script-ati.com.zip (651.2 كيلوبايت, عدد مرات المشاهدة 1391 مرة) [/TR]



©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©