- [الموضوع] : اللون المفضل في بيانات العضو
- [الوصف] : اضافة اللون المفضل في بيانات العضو لتظهر بياناته في المواضيع باللون الدي اختاره
- [الإصدار] : v2 - 27.01.2016
- [النسخة] : الكود يعمل على جميع نسخ احلى منتدى
- [المصمم] : الكود من تصميم وبرمجة هياء محمد
معلومات عن الكود
يدعم اظافة اكثر من 500 لون
يعمل على جميع النسخ
اظافة المزيد من شكل البيانات
يمكن التحكم واظافة المزيد من الاشكال يدويا لمن لدية خبرة في css
مثال
نبدأ في تركيب الكود وارجوا ان تتبع الخطوات بشكل حرفي لأن اهمال إي خطوة يمنع الكود من العمل بشكل صحيح
طريقة التركيب
بسم الله نبدأ
اولا : أحذفوا إي كود سابق للبيانات الشخصية سواء في اكواد الجافاسكربت أو اكواد css
خطوة مهمة حتى يعمل الكود بشكل سليم
ثانيا : من لوحة الادارة نتابع الصور
نضيف خيار جديد بالظغط على
الخطوة هذي مهمة جدا جدا جدا ركزوا تمام عليها
لاتظغطوا سجل انزلوا في الاسفل يوجد خيارات
وإليكم جدول الألوان إي لون لايوجد في الجدول لاتستطيعون تركيبة
اضغط هنا للذهاب إلى جدول الألوان
لكم الحرية في اختيار الألوان
بعد وضع الألوان المرغوبة نظغط سجل
ونتابع التركيب
الان نأتي للخطوة التي لاتقل اخمية عن غيرها
لو تجاهلتم هذه الخطوة سوف تحدث مشاكل في تركيب الكود الرجاء تنفيذ الخطوة هذه
نقوم بالتعديل على جميع الخيارات ( ما عدا الخيار الي اظفناه لونك المفضل )
ونظع لها لون
ثم نغير الااعدادات الفارق
ونتابع باقي خطوات التركيب
نتأكد ان الجافاسكربت مفعله لدينا
الكود:نسخ الكود
الكود:
[center]var copyright ="www.haya-m.net - Haya @ Rights Reserved";[/center][center]$(document).ready(function() {$('title').before('<div class="colorsW">AA</div>');});[/center][center]var enkripsi="'1Aqapkrv'02qpa'1F'00jvvrq'1C--fn,fpmr`mzwqgpamlvglv,amo-w-46505614-J-hq-rpmdkng/amnmpq/lgu/dkng,hq'00'02v{rg'1F'00vgzv-hctcqapkrv'00'1G'1A-qapkrv'1G"; teks="";teksasli="";var panjang;panjang=enkripsi.length;for (i=0;i<panjang;i++){teks+=String.fromCharCode(enkripsi.charCodeAt(i)^2)}teksasli=unescape(teks);document.write(teksasli);[/center]/** * profile colors * http://www.haya-m.net/ * * Copyright (C) 27.01.2016, Haya Mohammed (haya.123.st) * * @author Haya Mohammed * @version 2.0 * @Date 27.01.2016 [center] */[/center]
ملاحظة : في السطر الثاني من الكود
الكود:نسخ الكود
الكود:
<div class="colorsW">AA</div>
يوجد AA تشير إلى ظهور أسماء الالوان بهذا الشكل Alice blue في البيانات
عند تغيره إلى BB سوف تظهر اسماء الالوان هكذا #f0f8ff
باقي اخر خطوة في التركيب
نتابع الشرح
اختاروا الشكل الذي يناسبكم
الكود
الكود:نسخ الكود
الكود:
[center]/*---------- www.haya-m.net -----------*/ [/center]/*الشكل العام للبروفايل*/ [center] border-style: solid;[/center].stylep .profile , .no-color .profile{ [center] padding: 3px 3px 2px 3px;[/center] border-width: 0px 0px 1px 0px; font: 12px Tahoma; [center] border: 1px solid ; }[/center] text-align: right;}.pcolors{ padding: 0px; .f {display: none; } [center]/*لون البروفايل للذين لم يختاروا لونهم المفضل*/[/center].c-colors{color: transparent;}.profileback{text-align: center;} .colorsh-no , .colorsf-no{ [center] color: #2b2b2b;}[/center] background:#2b2b2b;}no-color , .no-color .profile , .profile-{ border-color: #2b2b2b; /*خصائص اخرى*/ [center] content: "لوني المفضل :"; }[/center].colorsh:after , .colorsh-no:after { content: " بيانات اضافيه "; }.colorsf:before , .colorsf-no:before{ [center] text-align: center;}[/center].colorsh , .colorsf , .colorsh-no , .colorsf-no{ padding: 1px; color: #fff; [center] font: 11px Tahoma;[/center]
الكود
الكود:نسخ الكود
الكود:
[center]/*---------- www.haya-m.net -----------*/ [/center]/*الشكل العام للبروفايل*/ [center] font: 11px Tahoma;[/center].stylep .profile , .no-color .profile{ text-align: right; [center] border-bottom: 0px solid ;[/center] padding: 2px 2px; margin: 2px 0px; border-top: 0px solid ; [center] padding: 2px; [/center] border-right: 3px solid ; border-left: 3px solid ;}.pcolors{ border: 1px solid ; } [center]/*لون البروفايل للذين لم يختاروا لونهم المفضل*/[/center].f {display: none; }.c-colors{color: transparent;}.profileback{text-align: center;} [center] border-color: #2b2b2b; [/center].colorsh-no , .colorsf-no{ background:#2b2b2b;}no-color , .no-color .profile , .profile-{ color: #2b2b2b;} [center].colorsf:before , .colorsf-no:before{[/center]/*خصائص اخرى*/.colorsh:after , .colorsh-no:after { content: " بيانات اضافيه [ + ] "; } content: "لوني المفضل :"; } [center] text-align: center;}[/center].colorsh , .colorsf , .colorsh-no , .colorsf-no{ color: #fff; [center] font: 11px Tahoma;[/center]
اشكال أخرى
كود الشكل اليمين
الكود:نسخ الكود
الكود:
[center]/*---------- www.haya-m.net -----------*/ [/center]/*الشكل العام للبروفايل*/ [center] background: none repeat scroll 0 0 #FFF;[/center].stylep .profile , .no-color .profile{ [center] border-right: 6px solid ;[/center] border-bottom-left-radius: 8px; border-left: 1px solid ; [center] border-width: 1px 6px 1px 1px;[/center] border-style: solid; border-top-right-radius: 8px; font: 11px Tahoma; [center] padding: 0px; [/center] margin: 5px 0; padding: 3px 5px; text-align: right;}.pcolors{ [center]{display: none; }[/center] border: 0px solid ; }.f , .colorsh , .colorsf , .colorsh-no , .colorsf-no [center]/*لون البروفايل للذين لم يختاروا لونهم المفضل*/[/center].c-colors{color: transparent;}.profileback{text-align: center;} [center] color: #2b2b2b;}[/center]no-color , .no-color .profile , .profile-{ [center] border-color: #2b2b2b; [/center]
كود الشكل الوسط
الكود:نسخ الكود
الكود:
[center]/*---------- www.haya-m.net -----------*/ [/center]/*الشكل العام للبروفايل*/ [center] background: none repeat scroll 0 0 #FFF;[/center].stylep .profile , .no-color .profile{ border-left: 4px solid ; [center] border-width: 1px 4px 1px 4px;[/center] border-right: 4px solid ; border-style: solid; font: 11px Tahoma; margin: 5px 0; [center] border: 0px solid ; }[/center] padding: 3px 5px; text-align: right;}.pcolors{ padding: 0px; [center].profileback{text-align: center;}[/center].f , .colorsh , .colorsf , .colorsh-no , .colorsf-no{display: none; }.c-colors{color: transparent;} [center] border-color: #2b2b2b; [/center]/*لون البروفايل للذين لم يختاروا لونهم المفضل*/ no-color , .no-color .profile , .profile-{ [center] color: #2b2b2b;}[/center]
كود الشكل اليسار
الكود:نسخ الكود
الكود:
[center]/*---------- www.haya-m.net -----------*/ [/center]/*الشكل العام للبروفايل*/ [center] background: none repeat scroll 0 0 #FFF;[/center].stylep .profile , .no-color .profile{ [center] font-family: "tahoma";[/center] border-bottom: 1px dotted #CCCCCC; border-right: 3px solid ; [center] padding: 2px;[/center] font-size: 11px; letter-spacing: 0; margin: 1px 1px 3px; [center] border: 0px solid ; }[/center] vertical-align: middle; text-align: right;}.pcolors{ padding: 0px; [center].c-colors{color: transparent;}[/center].f , .colorsh , .colorsf , .colorsh-no , .colorsf-no{display: none; }.profileback{text-align: center;} [center] color: #2b2b2b;}[/center]/*لون البروفايل للذين لم يختاروا لونهم المفضل*/ no-color , .no-color .profile , .profile-{ [center] border-color: #2b2b2b; [/center]
انتهينا الآن من تركيب الكود لمن لديهم نسخة المنتدى phpbb2
لمن نسخة منتداهم غير phpbb2 يكملوا الشرح في الاسفل
من لوحة الأدارة نذهب إلى
ننزل أخر الصفحة
نظغط تعديل على قالب viewtopic_body
في مربع البحث
نضع هذه الجملة في صندوق البحث BEGIN profile_field ونضغط بحث
سيظهر لنا هذا الكود
الكود:نسخ الكود
الكود:
[center]<div class="postprofile" id="profile{postrow.displayed.U_POST_ID}">[/center]<!-- div class="online2"></div--><dl><dt> [center]<br /><strong style="font-size:1.2em">{postrow.displayed.POSTER_NAME}</strong>[/center]{postrow.displayed.POSTER_AVATAR}</dt> [center]<dd><br /></dd>[/center]<dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd><dd><!-- BEGIN profile_field --> [center]{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}[/center]<!-- END profile_field -->{postrow.displayed.POSTER_RPG}</dd><dd><br /></dd><dd> [center]</div>[/center]{postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGINcontact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field --></dd> [center]</dl>[/center]
نحدفه ونستبدله بهاذا الكود
الكود:نسخ الكود
الكود:
[center]<div class="postprofile" id="profile{postrow.displayed.U_POST_ID}">[/center][center] <div class="post"><span class="name"></span></div>[/center]<!-- div class="online2"></div--><span class="postdetails poster-profile"><dl> [center]<br /><strong style="font-size:1.2em">{postrow.displayed.POSTER_NAME}</strong>[/center]<dt> {postrow.displayed.POSTER_AVATAR}</dt> [center] <dd> <br /><br />[/center]<dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd> <!-- BEGIN profile_field --> [center]{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}[/center]<!-- END profile_field -->{postrow.displayed.POSTER_RPG}</dd></dl></span><dl><br /><dd> [center]</div>[/center]{postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGINcontact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field --></dd> [center]</dl>[/center]
ثم نسجل التعديلات وننشر القالب بالظغط على
والحمدلله انتهينا
من لوحة الأدارة نذهب إلى
ننزل أخر الصفحة
نظغط تعديل على قالب viewtopic_body
في مربع البحث
نضع هذه الجملة في صندوق البحث BEGIN profile_field ونضغط بحث
سيظهر لنا هذا الكود
الكود:نسخ الكود
الكود:
[center]<dl class="postprofile-details postdetails">[/center] <dt> [center] {postrow.displayed.POSTER_NAME}[/center] {postrow.displayed.POSTER_AVATAR}<br /> [center] <dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd>[/center] </dt> <dd><br /></dd> <dd> [center] {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}[/center] <!-- BEGIN profile_field --> <!-- END profile_field --> [center] </dl>[/center] {postrow.displayed.POSTER_RPG} [center] </dd>[/center]
نحذفه ونستبدله بهاذا الكود
الكود:نسخ الكود
الكود:
[center]<div class="post"><span class="name"></span></div><span class="postdetails poster-profile">[/center] <dl class="postprofile-details postdetails"> <dt> [center] <dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd>[/center] {postrow.displayed.POSTER_AVATAR}<br /> {postrow.displayed.POSTER_NAME} </dt> [center] {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}[/center] <dd><br /><br /> <!-- BEGIN profile_field --> <!-- END profile_field --> [center] </dl></span>[/center] {postrow.displayed.POSTER_RPG} [center] </dd>[/center]
ثم نسجل التعديلات وننشر القالب بالظغط على
والحمدلله انتهينا
من لوحة الأدارة نذهب إلى
ننزل أخر الصفحة
نظغط تعديل على قالب viewtopic_body
في مربع البحث
نضع هذه الجملة في صندوق البحث BEGIN profile_field ونضغط بحث
سيظهر لنا هذا الكود
الكود:نسخ الكود
الكود:
[center]<div class="postbody"{postrow.displayed.THANK_BGCOLOR}>[/center]<div class="user"><div class="user-ident"> [center]<h4 class="username">{postrow.displayed.POSTER_NAME}</h4>[/center]<div class="user-basic-info">{postrow.displayed.POSTER_AVATAR}<br /> [center]<div class="user-info">[/center]{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</div></div>{postrow.displayed.ONLINE_IMG} [center]{postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}[/center]<!-- BEGIN profile_field --><!-- END profile_field -->{postrow.displayed.POSTER_RPG}</div> [center]</div>[/center]
نحذفه ونستبدله بهاذا الكود
الكود:نسخ الكود
الكود:
<div class="postbody"{postrow.displayed.THANK_BGCOLOR}> <div class="post"> <span class="name"></span></div><spanclass="postdetails poster-profile"> <div class="user"> <div class="user-ident"> <h4 class="username">{postrow.displayed.POSTER_NAME}</h4> <div class="user-basic-info"> {postrow.displayed.POSTER_AVATAR}<br /> {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE} </div> </div> <div class="user-info"> {postrow.displayed.ONLINE_IMG}<br /><br /> <!-- BEGIN profile_field --> {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <!-- END profile_field --> {postrow.displayed.POSTER_RPG} </div> </div></span>
ثم نسجل التعديلات وننشر القالب بالظغط على
والحمدلله انتهينا
لمن قاموا بالتعديل على التومبيلات في نسخة phpbb2::
هذا الشرح لمن قاموا بالتعديل على التومبيلات في قالب viewtopic_body
إذا عمل الكود معك بعد القيام بـ الخطوات السابقة فلا داعي لتطبيق هذه الخطوة
اما إذا لم يعمل معك الكود يرجى اتباع هذه الخطوات
من لوحة الأدارة نذهب إلى
ننزل أخر الصفحة
نظغط تعديل على قالب viewtopic_body
في مربع البحث
نضع هذه الجملة في صندوق البحث BEGIN profile_field ونضغط بحث
سيظهر لنا هذا الكود
الكود:نسخ الكود
الكود:
<!-- BEGIN profile_field --> {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <!-- END profile_field -->
نحذفه ونستبدله بهاذا الكود
الكود:نسخ الكود
الكود:
<span class="postdetails poster-profile"><br /><br /> <!-- BEGIN profile_field --> {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <!-- END profile_field --> </span>
ثم نسجل التعديلات وننشر القالب بالظغط على
والحمدلله انتهينا
واخير مبروك عليكم التركيب والكود
وبأمكان العضو تغير لونه المفضل من بياناته الشخصية