ط¥ط¨طھظƒط¢ط± . ظƒظˆط¯ ط§ظ„طھط*ظƒظ… ط§ظ„ظƒط§ظ…ظ„ ظپظ‰ ط§ظ„ظ…ظˆط§ط¶ظٹط¹ ط¨ط¶ط؛ط·ط© ط²ط± - Css - JQuery - ط§ط¯ط®ظ„ ط¨ط¯ظˆظ† طھط±ط¯ط¯ !


السلام عليكم ورحمة الله وبركاته . بسم الله والصلاة والسلام على رسول الله . اللهم صلِّ على محمد وعلى آله وصحبه وسلم .

أقدم لكم اليوم كود code فارس الهداليل للتحكم الكامل فى المواضيع بتقنية الجيكورى . [إصدار تجريبى] .

هى فكرة جديدة ومبتكرة غير مأخوذة أو منقولة من أى موقع . [اجتهاد شخصى] .

هذه الفكرة عبارة عن كود code [وفضلت عدم برمجتها فى هاك product] .

كود code يسمح للأعضاء والزوار أن يتحكموا فى كيفية عرض الموضوع كما يحبون .

من تغيير لحجم الخط ونوعه [مؤقتاً فى الإصدار التجريبى] .

يشمل الكود code : زر النشر فى فيسبوك وتويتر وباقى مواقع الشنر - عدد مشاركات ومشاهدات الموضوع - تغيير حجم الخط - تغيير نوع الخط .

فى نوع الخط أدرجت خطين فقط تجريبياً .

صورة من الكود code :



طبعاً يتغير حسب لون الاستايل style الخاص بك .



وظيفة الكود code الأساسية هى السماح للزوار باالتعديل على مظهر الموضوع ، سواء حجم الخط أو نوعه [مؤقتاً]

كيفية التعديل تكون بضغطة زر . إذا ضغط الزائر على أى من الخيارات كـ [30px] مثلاً . سيتغير حجم الخط فى الموضوع إلى 30 بيكسل فوراً .

وهنا مثال . هذا شكل الموضوع عند اعتماده :



وهذا شكله بعد الضغط على [23px]



وهذا بعد الضغط على [Traditional] و [30px] :



وهذا بعد الضغط على [Bold] :



هذا مؤقتاً فى الإصدار التجريبى ، وفى الإصدار الأول يإذن الله وعونه سيتم إتاحة العديد من أزرار التحكم ، مع إضافات جديدة ومبتكرة .

نأتى الآن لكيفية التركيب install وهى يسيرة بإذن الله .

- أولاً قم بفك الضغط عن الملف المرفق .

- تجد بداخله مجلد يسمى js . ارفعه إلى داخل مجلد منتداك . ليصبح مسار الملف هكذا :

رمز Code:
vb/js/fares.js
- خذ نسخة احتياطية من قالب template postbit_legacy . ثم افتحه .

- امسح ما بين الوسمين :

رمز Code:
<!-- message -->
و رمز Code:
<!-- / message -->
أى أنك ستمسح أى شيء تجده داخل الوسمين :



اللون الأخضر : ما نبحث عنهما .

اللون الأصفر : ما سنقوم بمسحه .

مثال بعد المسح :



الآن نقوم بنسخ هذا الكود code داخل هذين الوسمين

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

$(document).ready(function(){

$("#fares-tr").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-family","Traditional Arabic");


});

});
$(document).ready(function(){

$("#fares-ar").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-family","Arial");


});

});

$(document).ready(function(){

$("#fares-g").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-weight","bold");


});

});
$(document).ready(function(){

$("#fares-h").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-weight","normal");


});

});


$(document).ready(function(){

$("#fares-b").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-size","16px");


});

});

$(document).ready(function(){

$("#fares-c").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-size","20px");


});

});

$(document).ready(function(){

$("#fares-d").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-size","23px");


});

});

$(document).ready(function(){

$("#fares-e").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-size","26px");


});

});
$(document).ready(function(){

$("#fares-f").click(function(){

$("#post_message_$post&#91;postid&#93;").css("fo nt-size","30px");


});

});
$(document).ready(function(){

$("#fares-right").click(function(){

$("#post_message_$post&#91;postid&#93;").css("te xt-align"," right");


});

});
$(document).ready(function(){

$("#fares-center").click(function(){

$("#post_message_$post&#91;postid&#93;").css("te xt-align"," center");


});

});
$(document).ready(function(){

$("#fares-left").click(function(){

$("#post_message_$post&#91;postid&#93;").css("te xt-align"," left");


});

});
</script>


<style type="text/css" >


.fares-all {
margin-bottom: 5px;

}
.sandy {
clear: both;
}
#fares-tb {
float: left;
}
#fares-a,#fares-b,#fares-c,#fares-d,#fares-e,#fares-f,#fares-g,#fares-h,#fares-tr:hover {
cursor: alias;
padding-right: 5px;
}
#tet:hover,#fares-ar:hover {
padding-right: 5px;
cursor: alias;
}

</style>
<if condition="$post&#91;'title'&#93;">
<div class="fares-all">
<table class="tborder" id="fares-tb" border="0" cellSpacing="1" cellPadding="6">
<tr>

<th class="vbmenu_control"><font face="Tahoma">
<span style="font-size: 9pt; "><b><span id="share-fares">نشر الموضوع</span>
</b>
</span></font> </th>
</tr>

<tr>
<th class="thead" ><font face="Tahoma"><span class="smallfont">
<span style="font-size: 9pt; ">
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a href="http://www.addthis.com/bookmark.php?v=250&amp;pub=alkhulaqi" class="addthis_button_compact">أكثر</a>
<span class="addthis_separator">|</span>
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pub=alkhulaqi"></script>
<!-- AddThis Button END -->
</span></span></font></th>
</tr>




<tr>
<th class="vbmenu_control" id="state-fares"><font face="Tahoma">
<span style="font-size: 9pt; "><strong><span id="fares-name">$vbphrase&#91;replies&#93;</span>
</strong>
</span></font> </th>
</tr>
<tr>

<th class="thead" id="state-fares"><font face="Tahoma"><span class="smallfont">
<span style="font-size: 9pt; font-weight: 700">
<span id="fares-name">$thread&#91;replycount&#93;</span></span></span></font></th>
</tr>
<tr>
<th class="vbmenu_control" id="state-fares"><font face="Tahoma">
<span style="font-size: 9pt; "><strong><span id="fares-name">$vbphrase&#91;views&#93;</span>
</strong>
</span></font> </th>
</tr>
<tr>
<th class="thead" id="state-fares"><font face="Tahoma"><span class="smallfont">
<span style="font-size: 9pt; font-weight: 700">
<span id="fares-name">$thread&#91;views&#93;</span></span></span></font></th>
</tr>



<tr>


<th class="vbmenu_control"><font face="Tahoma">
<span style="font-size: 9pt; "><b><span id="font-type-fares">نوع الخط</span>
</b>
</span></font> </th>
</tr>
<tr>

<th class="thead" id="tr-fares"><b><font face="Tahoma"><span class="smallfont" id="fares-tr">
<span style="font-size: 9pt">Traditional</span></span><span style="font-size: 9pt">
</span></font></b> </th>

</tr>
<tr>

<th class="thead" id="tr-fares"><b><font face="Tahoma"><span class="smallfont" id="fares-ar">
<span style="font-size: 9pt">Arial</span></span><span style="font-size: 9pt">
</span></font></b> </th>

</tr>




<tr>
<th class="vbmenu_control" id="test"><font face="Tahoma">
<span style="font-size: 9pt; "><b><span id="fares-font-size">المظهر</span>
</b>
</span></font> </th>
</tr>

<div class="fares-font">


<tr>

<th class="thead" id="tet"><b><font face="Tahoma"><span class="smallfont" id="fares-b">
<span style="font-size: 9pt"> 16px</span></span><span style="font-size: 9pt">
</span></font></b> </th>
</tr>
<tr>
<th class="thead" id="tet"><b><font face="Tahoma"><span class="smallfont" id="fares-c">



<span style="font-size: 9pt"> 20px</span></span><span style="font-size: 9pt">
</span></font></b> </th>
</tr>
<tr>
<th class="thead" id="tet"><b><font face="Tahoma"><span class="smallfont" id="fares-d">
<span style="font-size: 9pt"> 23px</span></span><span style="font-size: 9pt">
</span></font></b> </th>
</tr>
<tr>
<th class="thead" id="tet"><b><font face="Tahoma"><span class="smallfont" id="fares-e">
<span style="font-size: 9pt">26px</span></span><span style="font-size: 9pt">
</span></font></b> </th>
</tr>
<tr>
<th class="thead" id="tet"><b><font face="Tahoma"><span class="smallfont" id="fares-f">
<span style="font-size: 9pt">30px</span></span><span style="font-size: 9pt">
</span></font></b> </th>
</tr>
<tr>
<th class="thead" id="tet"><b><font face="Tahoma"><span class="smallfont" id="fares-g">
<span style="font-size: 9pt">Bold</span></span><span style="font-size: 9pt">
</span></font></b> </th>
</tr>

<tr>
<th class="thead" id="tet"><b><font face="Tahoma"><span class="smallfont" id="fares-h">
<span style="font-size: 9pt">Normal</span></span><span style="font-size: 9pt">
</span></font></b> </th>
</tr>



</div>



</table>
</div>
</if>
<div id="post_message_$post&#91;postid&#93;">
$ad_location&#91;ad_showthread_firstpost_start&#93 ;
<div class="sandy>">$post&#91;message&#93;</div>

</div>
</code> </code>


ثم احفظ القالب template واذهب داخل أى موضوع وقم بالتجربة .

- كما يُعلَم ؛ أى عمل بشرى لا يخلو من أخطاء. والكمال للخالق سبحانه . فعذراً نستميحكم إن حدث خطأ أو تقصير .

- لأى إضافات أو أفكار قم بوضعها هنا وسيتم تنفيذها فى إصدارات قادمة بإذن الله .

- حقوقى محفوظة ولا أسمح بالتعديل أو الاقتباس . كذا فإنى أبرأ من كلِ من يستخدمها فى منتدى مخالف .

- تم بحمد الله تعالى وتوفيقه . لا تنسونى من صالح دعائكم . السلام عليكم .






الملفات المرفقة [TR]
js.zip (32.4 كيلوبايت, عدد مرات المشاهدة 102 مرة) [/TR]



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