أهلا وسهلا بك زائرنا الكريم في منتدى دعم PBBoard الرسمي، لكي تتمكن من المشاركة ومشاهدة جميع أقسام المنتدى وكافة الميزات ، يجب عليك إنشاء حساب جديد بالتسجيل بالضغط هنا أو تسجيل الدخول اضغط هنا إذا كنت عضواً .

منتدى شروحات ودروس منتديات PBBoard

تعديل على قالب الملف الشخصي

الصفحة 2 من 2

الأخيرة

[Template]:

: [Template]: تعديل على قالب الملف الشخصي

19-09-2010 04:23 مساءً

f8athy

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

السلام عليكم ورحمة الله وبركاته

بعد ان قمت بالإقتراح وعجب الأخ سليمان بارك الله فيه

هذا تعديل بسيط يمثل ما اقترحت ويمكن التعديل فيه حتى يكون متناسق أكثر فأكثر للمعاية انظر الصورة المرفقة

التركيب

أولا افتح style.css اضف التالي :

CODE


[LEFT]#vtab {
	    
		  margin: 0px  9px 0px 0px;
		  width: 98%;

	   }
	   #vtab > ul > li {
	    cursor:pointer;
		  width: 110px;
		  height: 110px;
		  background-color: #fff !important;
		  list-style-type: none;
		  display: block;
		  text-align: center;
		  margin: auto;
		  padding-bottom: 10px;
		  border: 1px solid #fff;
		  position: relative;
		  border-right: none;
		  opacity: .3;
		  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
		  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
	   }
	   #vtab > ul > li.home {
	 
		  background: url('images/profinfo.png') no-repeat center center;
	   }
	   #vtab > ul > li.login {
	    
		  background: url('images/otherdet.png') no-repeat center center;
	   }
	   #vtab > ul > li.support {
    
		  background: url('images/Gestepm.png') no-repeat center center;
	   }
	   #vtab > ul > li.selected {
    
		  opacity: 1;
		  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
		  border: 1px solid #ddd;
		  border-right: none;
		  z-index: 10;
		  background-color: #fafafa !important;
		  position: relative;
	   }
	   #vtab > ul {
		  float:left;
		  width: 110px;
		  text-align: left;
		  display: block;
		  margin: auto 0;
		  padding: 0;
		  position: relative;
		  top: 30px;
	   }
	   #vtab > div {
	   
		  background-color: #fafafa;
		  margin-left: 110px;
		  border: 1px solid #ddd;
		  min-height: 401px;
		  padding: 12px;
		  position: relative;
		  z-index: 9;
		  -moz-border-radius: 20px;
	   }
	   #vtab > div > h4 {
		  color: #800;
		  font-size: 1.2em;
		  border-bottom: 1px dotted #800;
		  padding-top: 5px;
		  margin-top: 0;
	   }[/LEFT]

ثم

افتح القالب headinclud وأضف قبل <title> التالي :

CODE


[LEFT]<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
    <!--[if IE 7]>
    <style type="text/css">
	   #vtab > ul > li.selected{
		  border-right: 1px solid #fff !important;
	   }
	   #vtab > ul > li {
		  border-right: 1px solid #ddd !important;
	   }
	   #vtab > div { 
		  z-index: -1 !important;
		  left:1px;
	   }
    </style>
    <![endif]-->
<script type="text/javascript">
	   $(function() {
		  var $items = $('#vtab>ul>li');
		  $items.mouseup(function() {
			 $items.removeClass('selected');
			 $(this).addClass('selected');

			 var index = $items.index($(this));
			 $('#vtab>div').hide().eq(index).show();
		  }).eq(1).mouseup();
	   });
  </script>[/LEFT]

وبعدها قم باستبدال القالب profile بالمرفق وارفع الصور للمجلد images الخاص بالستايل

أو

تقوم باستبدال القوالب بالمرفقة الى C:\AppServ\www\forum\look\styles\forum\main\templates
وتستبدل styles.css في C:\AppServ\www\forum\look\styles\forum\main\style
وترفع الصور إلى مجلد C:\AppServ\www\forum\look\styles\forum\main\images

وشكرا

: تم تحرير الموضوع بواسطة :Soliman بتاريخ: 19-09-2010 07:20 مساءً

Sans.gif تحميل gif مرات التحميل :(11)
الحجم :(140.614) KB

profile.zip تحميل zip مرات التحميل :(69)
الحجم :(66.533) KB

: تعديل على قالب الملف الشخصي

19-09-2010 04:28 مساءً [1]

مهند

بارك الله فيك تعديل جميل

: تعديل على قالب الملف الشخصي

19-09-2010 04:28 مساءً [2]

f8athy

عذرا على دخول الابتسامات لم اجد خاصية تعطيل الابتسامات لذلك يمكنكم تحميل الكود عبر المرفق

: تعديل على قالب الملف الشخصي

19-09-2010 04:28 مساءً [3]

f8athy

المشاركة الأصلية كتبت بواسطة: مهند بارك الله فيك تعديل جميل

وفيك بركة

: تعديل على قالب الملف الشخصي

19-09-2010 05:04 مساءً [4]

isma3eliano

رائع جداً جزاك الله الفردوس ولا حرمنا من إبداعك و دعمك للنسخة شكراً لك

: تعديل على قالب الملف الشخصي

19-09-2010 05:13 مساءً [5]

f8athy

المشاركة الأصلية كتبت بواسطة: isma3eliano رائع جداً جزاك الله الفردوس ولا حرمنا من إبداعك و دعمك للنسخة شكراً لك

ولك المثل ان شاء الله
لا شكر على واجب
بارك الله فيك

: تعديل على قالب الملف الشخصي

19-09-2010 05:33 مساءً [6]

Mr.Php

شكراً لك أخي الكريم وبارك الله فيك

: تعديل على قالب الملف الشخصي

19-09-2010 05:45 مساءً [7]

تكـت فور

رائع جداً بس لو استخدمت ايقونات اصغر من الموجوده راح يكون افضل
تحياتي تعديل على قالب الملف الشخصي

: تعديل على قالب الملف الشخصي

19-09-2010 07:07 مساءً [8]

ختامه مسك

ممتاز ...

تجربة
جزاك الله كل خير تعديل على قالب الملف الشخصي

: تعديل على قالب الملف الشخصي

19-09-2010 07:32 مساءً [9]

ختامه مسك

أخي f8

أتمنى لو أنه من السهل عليك ضبط قالب معلومات الكاتب
الذي يعرض في الموضوع كهذا الذي على يمين ماتقرأ
لو من السهل ضبطه علي مثل هذه الإعدادات فلا تبخل علينا
وان كانت لك وجهة نظر أخرى فحدث

: تعديل على قالب الملف الشخصي

20-09-2010 09:44 صباحاً [10]

f8athy

المشاركة الأصلية كتبت بواسطة: Mr.php شكراً لك أخي الكريم وبارك الله فيك

وفيك بركة اخي مرحبا بك

: تعديل على قالب الملف الشخصي

20-09-2010 09:50 صباحاً [11]

f8athy

المشاركة الأصلية كتبت بواسطة: تكـت فور رائع جداً بس لو استخدمت ايقونات اصغر من الموجوده راح يكون افضل
تحياتي

السلام عليكم يمكن ذلك ماعليك سوى التعديل على الأيقونة يعني تجيب أيقونه اصغر حجم و تنقص مكانها من styles.css
يعني في اين تجد الكتابة هذه بشرط تكون موجودة 110px حولها الى حجم الأيقونات يعني 64 او 48

CODE

    
width: 110px;
height: 110px;
margin-left: 110px;

كذلك ليس شرطا ان تجدهم كلهم وان شاء الله سأرفق لكم واحدة بها صور 48 بكسل

بارك الله فيك و شكرا لك

: تعديل على قالب الملف الشخصي

20-09-2010 09:52 صباحاً [12]

f8athy

المشاركة الأصلية كتبت بواسطة: ختامه مسك ممتاز ...

تجربة
جزاك الله كل خير

شكرا لك
سررت بتجربتك لها
وجزاك الله خيرا ايضا

الصفحة 2 من 2

الأخيرة

المواضيع المتشابهه
عنوان الموضوع	الكاتب	الردود	الزوار	آخر رد
اخطأت في تعديل قالب footer لستايل Helpernt Marine واعدته لأصله	شبعان	5	118	شبعان
تغير وسائل الاتصال الاجتماعي في قالب الفوتر لستايل Helpernt Marine	شبعان	2	79	شبعان
هدية قالب WevFro القرآن الكريم الإصدار الأول مجاناً لمدونات بلوجر	TheGamer	5	226	Abduljbbar
تعديل قالب معلومات العضو في الاستايل الافتراضي	mc nabulsy	3	303	شبعان
حصرياً قالب Elites الإصدار الأول للنسخة 3.0.2	ezzeldean	14	5800	SOCIONET

الكلمات الدلالية

« بالفيديو ترقية استايل من أي نسخة pbboard إلي الأخرى | تركيب نسخة Pbboard على السيرفر المحلي »

الساعة الآن 02:44 AM