الجمعة، 11 يناير 2013

إضافة صورة الكاتب تحت عنوان موضوعه Blogger

 إضافة صورة الكاتب تحت عنوان موضوعه 

إضافة صورة الكاتب تحت عنوان موضوعه Blogger | ابداع ديزاين Abda3 Designفي هذه التدوينة الجديدة من سلسلة دروس البلوجر سوف نتعرف على طريقة إضافة  صورة شخصية  .
طبعا قد تكون في مدونة معينة مجموعة ولها أكثر من مؤلف أو كاتب بها وهذا ما يجعل المدونة أكثر طرحا للمواضيع لذلك سوف نقوم في هذا الدرس بتعلم كيفيةإضافة صورة الكاتب تحت عنوان الموضوع الذي قام بكتابته ،مما يسهل على الزائر بمعرفة صاحب المقال وعدم الخلط بين المؤلفين ،وكذلك تجعل المدونة أكثر تنسيقا وسهلة إذا كنت تتابع مقالات كاتب معين ،والصورة أسفله مثال على ذلك ،حيث أنني قمت بوضع صور عشوائية فقط للتوضيح .

إضافة صورة الكاتب تحت عنوان موضوعه Blogger | ابداع ديزاين Abda3 Design

الآن نتوجه لتطبيق الإضافة على مدونتك
انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3><font size="0"><a href=" http://abda3design.blogspot.com"></a></font>
</b:if>
 ثم قم بلصق الكود التالي تحته مع إدخال إسم الكاتب ورابط الصورة الخاصة به
<b:if cond='data:post.author == "إسم الكاتب الأول"'>
<span class="author"><img src="رابط صورة الكاتب الأول"/></span>
</b:if>
<b:if cond='data:post.author == " إسم الكاتب الثاني"'>
<span class="author"><img src="رابط صورة الكاتب الثاني"/></span>
</b:if>
<b:if cond='data:post.author == " إسم الكاتب الثالث"'>
<span class="author"><img src="رابط صورة الكاتب الثالث"/></span>
</b:if>

ملاحظة : يمكنك زيادة عدد مؤلفي المدونة كما تريد وذلك بإضافة هذا الكود وإعادته في عدد المرات المراد زيادرها تحت الكود السابق.
  
<b:if cond='data:post.author == " إسم الكاتب "'>
<span class="author"><img src="رابط صورة الكاتب "/></span>
</b:if>
ملاحظة هامة : يجب أن يكون إسم الكاتب نفسه الإسم الموجود في لائحة مؤلفين المدونة والذي يمثل إسم تعريف المدون.

الآن قم بالبحث عن الكود التالي :
]]</b:skin>
 ثم قم بلصق الكود التالي قبله :
 
.author img{
padding: 0;
float: left;
border: none;
margin: 0 10px 10px 0;
}

 يمكنك التعديل على الأبعاد 0 0px 10px 10px لإجاد المكان المناسب لتموضع صورة الكاتب في المدونة,ويمكنك كذلك وضع صورة الكاتب على اليمين وذلك بإستبدال الكلمة left بالكلمةright
قم بحفظ القالب
أتمني أن تكونوا قد إستفدتم من هذا الإضافة الجديدة.

ولأي إستفسار الرجاء ترك تعليقاتكم لأقوم بالإجابة عليها في القريب العاجلإضافة صورة الكاتب تحت عنوان موضوعه Blogger | ابداع ديزاين Abda3 Design

لا تقرأ وترحل شارك معنا بتعليق فنحن نسعى لنقدم لك الافضل والاجمل






ضع تعليقك

0 التعليقات:

البحــث

English French German Spain Italian Dutch

Russian Portuguese Japanese Korean Arabic Chinese Simplified

المتابعون

استثمارا للخبرات العالية والإمكانات التقنية المتميزة والطاقات البشرية الكبيرة التي تتميز بها "ابداع" أنشأت المؤسسة إدارة تتبنى عمل المواقع الخدمية المتنوعة للأفراد والهيئات والمؤسسات الكبرى. كما يمكنها عمل مواقع للتجارة الإلكترونية تتمكن الشركات والمتاجر من ترويج منتجاتها في كافة أنحاء العالم وتزويد مواقعها بإمكانية البيع عبر الإنترنت وتشمل خدمة بناء مواقع الإنترنت عدة مراحل بدأ من عملية التصميم المبدئي للموقع، وحتى الانتهاء منه، والقيام بتحديث الموقع كلما تطلب الأمر كما تتميز مؤسسة "ابداع" بأقوى فريق عمل متواصل مع العملاء 24 ساعة على مدار الأسبوع وتمتاز أيضا بكفاءة الدقة والسرعة في العمل لذلك نحمد الله العلي العظيم على منحنا تلك القدرة