درس عمل خبر عاجل كما في صحيفة الربوعة Dimofinf







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

 . السلام عليكم

 .. أول موضوع . طبعاً الشرح خاص لبرنامج Dimofinf

كما هو موضح في العنوان .. شرح عمل خبر عاجل كما في صحيفة الربوعة الإلكترونية . للمشاهدة على الطبيعة http://www.alraboah.net/index.htm الصورة

أولاً :- سنستخدم كود أحداث خفيفة . الطريقة : - نذهب للإستايلات والقوالب > الإستايلات > إستعراض

- نختار التصميم من أمام الإستايل المطلوب .

- نذهب لقالب servcontent.htm

نبحث عن الكود التالي

رمز Code:
<!-- START BLOCK : newlighteventsbl -->
<div class="module-title">{phrase_lightevents}</div>
<div id="contents" class="justify">
<div id="lightevents" style="overflow:hidden;">
<!-- START BLOCK : newlightevents -->
<div>{newlightevents}</div>
<!-- END BLOCK : newlightevents -->	
</div>
</div>
<br />

<script type="text/javascript">
$(document).ready(function() {
$("#lightevents").rotator({ms : 10000, n:1, autoHeight:true});
});
</script>
<!-- END BLOCK : newlighteventsbl -->

نقوم بقص ( وليس نسخ ) الكود ثم نضغط تحرير

نفقتح المفكرة او الفرونت بيج ثم نقوم بلصق الكود و شاهد الصورة التالية ... وركز قليلاً

1- المحدد بالأحمر الأول وهو

رمز Code:
<div class="module-title">{phrase_lightnews}</div>

نقوم بحذفه نهائياً . 2 المحدد بالأحمر الثاني وهو كلمة contents نقوم بإستبدالها بـ quiknews ثم ننسخ الكود بالكامل الذي أصبح هكذا .

رمز Code:
<!-- START BLOCK : newlighteventsbl -->
<div id="quiknews" class="justify">
<div id="lightevents" style="overflow:hidden;">
<!-- START BLOCK : newlightevents -->
<div>{newlightevents}</div>
<!-- END BLOCK : newlightevents -->	
</div>
</div>
<br />

<script type="text/javascript">
$(document).ready(function() {
$("#lightevents").rotator({ms : 10000, n:1, autoHeight:true});
});
</script>
<!-- END BLOCK : newlighteventsbl -->

ثم نذهب إلى قالب index.htm في الإستايل

نلصق الكود في هذا المكان المحدد بالأبيض . والذي هو اسفل الكود

رمز Code:
<td rowspan="2" valign="top" width="{style_menuwidth}">
<!-- INCLUDE BLOCK : menucontent -->

ثم نضغط تحرير

الآن نبدأ في ملف style.css أولاً .. نقوم برف الصورة التالية إلى مجلد images في الإستايل المطلوب .

ثانياً : نذهب لملف style.css ثم نضيف الكود التالي إليه . وليكون في الآخر مثلاً .

رمز Code:
#quiknews{
	background:#FFFFFF url('quicknews.png') no-repeat scroll right center;
	border:1px solid #FF0000;
	margin:0px;
	overflow:hidden;
	padding-right: 152px;
	padding-top: 10px;
	padding-bottom: 10px;
	color: #FF0000;
	font-size: 20px;
	font-family: 'Times New Roman', arial, verdana, geneva, lucida, 'lucida grande', helvetica, sans-serif;
	font-weight:bold;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-webkit-box-shadow: 0px 0px 5px #303030;
	-moz-box-shadow: 0px 0px 5px #303030;
	box-shadow: 0px 0px 5px #303030;
}
ثم نحفظ ونرفع الملف .. والصلاة والسلام على سيدنا محمد .

http://www.traidnt.net/vb/showthread.php?p=16345598#post16345598