قائمة المدونات الإلكترونية
7:18 ص |
تعديل الرسالة
تعديل الرسالة
السلام عليكم ،
اعتقد بأنك قد شاهدت مدونات منصة wordpress ، وكيف تكون كل تدوينة متبوعة بصندوق يظهر بعض المعلومات التي يكتبها المؤلف عن نفسه مع صورة له ، والكثير منا تمنى ان يحصل على هذه الاضافة في مدونات blogspot ، في هذه التدوينة سأبين بأذن الله طريقة اضافة هذا الصندوق الجميل في مدونات بلوجر ، قبل اي شيء شاهد معاينة لهذه الاضافة من الرابط التالي :
تابع بقية التدوينة اذا اعجبتك الاضافة ....
- طريقة تركيب الاضافة -
4- واضف الكود التالي بعدها مباشرة : كود رقم 2
6- احفظ القالب ومبروك عليك الاضافة .
طريقة تخصيص الاضافة
في الكود رقم 1 :
القسم الاول الكتابة والحدود في الصندوق :
padding: 4px; عرض اطار الصورة
border: 1px solid #E6E6E6; سمك خط اطار الصورة ولونه
}
في الكود رقم 2 :
height='70 ارتفاع الصورة
width='70 عرض الصورة
وهذا هو رابط صورة المدون غيره برابط صورتك ، على ان تكون الصيغة pnghttp://2.bp.blogspot.com/_0JSsw4H6sns/TDBi2u-pkzI/AAAAAAAADbU/HpGA8el0h_U/S220/adi+arar.png
اعتقد بأنك قد شاهدت مدونات منصة wordpress ، وكيف تكون كل تدوينة متبوعة بصندوق يظهر بعض المعلومات التي يكتبها المؤلف عن نفسه مع صورة له ، والكثير منا تمنى ان يحصل على هذه الاضافة في مدونات blogspot ، في هذه التدوينة سأبين بأذن الله طريقة اضافة هذا الصندوق الجميل في مدونات بلوجر ، قبل اي شيء شاهد معاينة لهذه الاضافة من الرابط التالي :
__________________________________________________________________
- طريقة تركيب الاضافة -
الخطوة الاولى
من لوحة التحكم اضغط على التصميم– تحرير html – اضغط على تنزيل قالب – وبعد اكتمال التنزيل اضغط على توسيع فوالب عناصرواجهة المستخدمالخطوة الثانية
1 - ابحث عن :]]></b:skin>
2- واستبدلها بـ هذا الكود :كود رقم 1
/***** Author Box ********************/
.author-box {
background: #F7F7F7;
margin: 20px 0 40px 0;
padding: 10px;
border: 1px solid #E6E6E6;
overflow: auto;
}
.author-box p {
margin: 0;
padding: 0;
}
.author-box img {
background: #FFFFFF;
float: right;
margin: 0 0 10px 10px;padding: 4px;
border: 1px solid #E6E6E6;
}
]]></b:skin>
3- ثم ابحث عن :
<div class='post-footer-line post-footer-line-1'>
4- واضف الكود التالي بعدها مباشرة : كود رقم 2
<b:if cond='data:blog.pageType == "item"'>
<div class='author-box'>
<p><img alt='' class='avatar avatar-70 photo' height='70' src='http://2.bp.blogspot.com/_0JSsw4H6sns/TDBi2u-pkzI/AAAAAAAADbU/HpGA8el0h_U/S220/adi+arar.png' width='70'/><b>اكب هنا العنوان</b><br/>
اكتب عنك ما تريد داخل الصندوق<br/></p>
</div>
</b:if>
5- تستطيع ان تضيف الكود السابق في عدة اماكن اخرى في قالب مدونتك مثل:
بعد او قبل : <div class='post-footer'>
لتظهر في اول التدوينة اضف الكود قبل : <data:post.body/>
6- احفظ القالب ومبروك عليك الاضافة .
__________________________________________________________________
الخطوة الثالثة
طريقة تخصيص الاضافة
في الكود رقم 1 :القسم الاول الكتابة والحدود في الصندوق :
.author-box {
background: #F7F7F7; لون الخلفية الرئيسية للصندوق
margin: 20px 0 40px 0; الابعاد عن الهوامش
padding: 10px; بعد الكتابة عن الحد
border: 1px solid #E6E6E6; لون الحد وسمكه
overflow: auto;
}
القسم الثاني - الصورة داخل الصندوق :
.author-box img {
background: #FFFFFF; : لون الخلفية قبل اظهار الصورة
.author-box img {
background: #FFFFFF; : لون الخلفية قبل اظهار الصورة
right - left مكان الصورة float: right;
margin: 0 0 10px 10px; الابعاد عن الهوامش
padding: 4px; عرض اطار الصورة
border: 1px solid #E6E6E6; سمك خط اطار الصورة ولونه
}
في الكود رقم 2 :
height='70 ارتفاع الصورة
width='70 عرض الصورة
وهذا هو رابط صورة المدون غيره برابط صورتك ، على ان تكون الصيغة png
اتمنى ان يكون الشرح وافي ومتكامل ، وبالتوفيق دوما ادعو لي ولكم .
اذا اعجبتك هذه التدوينة فلا تنسى ان تشاركها وتساعدنا على نشر المدونة ، كما يسعدنا ان تنضم الى قائمة المشاركين في سما بلوجر من خلال
(نشرات rss)
12 التعليقات:
اخى الكريم ..تلقيت رسالة من جوجل مؤداها ان احدهم دخل حسابى من الولايات المتحدة قبل اسبوع ... و لكنى استخدم الحساب بشكل طبيعى للغاية .... ماذا افعل؟؟
اخر ايام الخريف ،
اهلا بك اختي ، لم تصادفني مثل هذه الرساله ، ولكن من الافضل تغيير رمز المرور ، وبالتوفيق
السلام عليكم
لو سمحت أنا ماعندي خبره بالمدونات و عندي مشكله بتنزيل القوالب هل ممكن توضح لي ... الملفات هل قبل تنزيلها يجب عمل شيئ لان تطلع لي رساله
لا يمكن توزيع القالب الخاص بك لأنه غير منسق بشكل جيد. الرجاء التأكد من إغلاق كافة عناصر XML بشكل صحيح.
رسالة خطأ XML: Content is not allowed in prolog.
القوالب اللي في مدونتك سهله و جربتها و لكن في قوالب أخري اعتقد المضغوطه لدي مشكله فيها رجاء توضيح الموضوع لي أذا ما في أزعاج
شكرا
غير معرف ،
اهلا بك اخي ، فك الضغط عن القالب ومن ثم ارفع القالب بصيغه xml الى مدونتك ، بالتوفيق اخي .
بسم الله الرحمن الرحيم
الله يعطيك العافية أخ عدي على الشرح الوافي
تقبل مروري
ألف شكر على الاضافة الجميلة أخي العزيز
ريماس ،
اهلا بك اختي العزيزه ، من زمان ما شفت تعليقاتك المشجعه ، شرفني مرورك الكريم يا برنسيسه .
عربيه جرافيكس ،
ارحب بك اخي زائرا ومتابعا للمدونه ، واشكرك على مدونتك الطيبه ، تقبل تحياتي
جميله اوي الطريقه دي اخي عدي لكن للاسف قالبي لا توجد به تلك الجمله
footer-line post-footer
السلام عليكم أخي
ما شاء الله مدونة أكثر من
رائعة أتمنى لك التوفيق
أبي أستفسر .. معي مدونة
بس عرض الخلفية التي تكون عليها
المواضيع المطروحة ضيقة وأبي أوسعها
بس كيف لاني لما أعرض صور فتظهر الصور غير كاملة
لضيق المساحة كما في مدونتي
http://fnoonblogger.blogspot.com/
ما الحل بارك الله فيك .؟؟
توك شو ،
اهلا بك يا طيب ، هناك اكثر من جمله لتضيف اليها الكود ، حاول مره اخرى ، فالاضافه جميله ومفيده .
فنون تشكيليه ،
مرحبا بك اخي ، لا استطيع الرد على استفسارك هنا ، فهذا يحتاج الى تدوينه لشرحه ، تقبل تحياتي
جميل جدا
بس للاسف :( بالنسبة لمحتوى مدونتي
ما اعرف اعرف بنفسي انا مو ناقصة
يكفي اني كتبت نبذة عني سريعة احسها استخدمت خطا
ضدي
وشكرا
بارك الله فيك أخي الكريم على هده المعلومات التي قدمتها في مدونتك المتواضعة و الهادفة
إرسال تعليق