اضافة تعريف الكاتب بشكل أنيق

السلام عليكم زوار ومتتبعي مدونة بوزوم اليوم مع درس

جديد ان شاء الله وهوطريقة اضافة تعريف الكاتب بشكل أنيق

هذه الخاصية تساعد الزوار علي التعرف بصاحب المدونة

ومراسلته كما أن هذه الاضافة تحتوي علي ازرار اجتماعية

وهي علي النحو التالي خمسات.اليوتيوب.جوجل بلس.تويتر.الفيسبوك

كما ان هذه الاضفة تعطي مدونتك شكل جميل وأنيق

ويجب ان تتواجد في كل مدون سواء عربية ام أجنبية كما أن هذه الاضافة

يمكنكم تغير شكل الكتاب بداخلها الي اي خط يختاره المدون

تابعو الشرح

طريقة تركيب الإضافة

أولا ادخل الي تحرير القالب ولا تنسي أخذ نسخ احتياطية

ابحث عن الوسم التالي

]]></b:skin>

وأضف فوقه مباشرتا الكود التالي

.cnmuauthor {background:#F9F9F9;border: 1px solid #E1E1E0;font-family: Arial;margin-bottom:7px; margin-top:7px; overflow: hidden; padding: 0 0 5px 5px;}

.cnmuauthor img {border: 4px solid #E2DEDE;float: right;height: 125px;width: 125px;margin-left: 15px;}

.cnmuauthor h4 {background:#636363;color: #FFF;font-size: 20px;margin: 0 134px 0 -9px;padding: 5px;}

.cnmuauthor p {color: #515151;font-size: 15px;margin-bottom: 0px;margin-top:5px;}

ul.cnmuauco { list-style:none; float: left; margin: 0 0 0 6px;display:inline-block;padding:0; }

ul.cnmuauco li { display:inline; float:left; background: url(https://lh6.googleusercontent.com/-ftV4erNKUMk/UYJa0yzsFVI/AAAAAAAABSg/Mao3vVYtEeA/s170/cnmu-auth.png) no-repeat; }

ul.cnmuauco li a { display:block; width:20px; height:20px; padding-right:6px; position:relative; text-decoration:none; }

ul.cnmuauco li a strong {background-color: rgba(0, 0, 0, 0.7);border-radius: 3px 3px 3px 3px;box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);color: #FFFFFF;font-size: 14px;font-weight: normal;left:35px;margin-top: 40px;padding: 3px;position: absolute;top: -95px;width: 70px;z-index: 9999;}

ul.cnmuauco li.cnmuaut-facebook {background-position: 0px 0px;}

ul.cnmuauco li.cnmuaut-twitter {background-position: 0px -30px;} 

ul.cnmuauco li.cnmuaut-googleblus {background-position: 0px -60px;}

ul.cnmuauco li.cnmuaut-youtube {background-position: 0px -90px;}

ul.cnmuauco li.cnmuaut-khamsat {background-position: 0px -120px;}

ul.cnmuauco li.cnmuaut-wsite {background-position: 0px -150px;}

#cnmuaucohv:hover li { opacity:0.2; }

#cnmuaucohv li { -webkit-transition-property: opacity; -webkit-transition-duration: 500ms;-moz-transition-property: opacity; -moz-transition-duration: 500ms; }

#cnmuaucohv li a strong { opacity:0; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; }

#cnmuaucohv li:hover { opacity:1; }

#cnmuaucohv li:hover a strong { opacity:1; top:-10px; 

 }

بعد الانتهاء من الرحلة الاولي ابحث عن أحد الوسمين

<div class='post-footer'>

<div class='post-footer-line post-footer-line-1'>

قم باضافة الكود التالي أسفل احد الوسمين مع تبديل الروابط

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class='cnmuauthor'>

<img alt='نزار بوزوم' src='https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn1/c0.0.180.180/s160x160/1238774_169255596600912_978338764_a.png'/>

<h4>

بقلم : نزار بوزوم

<ul class='cnmuauco' id='cnmuaucohv'>

<li class='cnmuaut-facebook'>

<a href='رابط فيس بوك' rel='nofollow' target='_blank'><strong>التواصل عبر الفيس بوك</strong></a></li>

<li class='cnmuaut-twitter'>

<a href='رابط تويتر' rel='nofollow' target='_blank'><strong>التواصل عبر تويتر</strong></a></li>

<li class='cnmuaut-googleblus'>

<a href='رابط جوجل بلس' rel='nofollow' target='_blank'><strong>التواصل عبر جوجل بلس</strong></a></li>

<li class='cnmuaut-youtube'>

<a href='رابط يوتيوب' rel='nofollow' target='_blank'><strong>قناة الكاتب على اليوتيوب</strong></a></li>

<li class='cnmuaut-khamsat'>

<a href='رابط خمسات' rel='nofollow' target='_blank'><strong>خدمات الكاتب على خمسات</strong></a></li>

<li class='cnmuaut-wsite'>

<a href='رابط موقع الكاتب' target='_blank'><strong>موقع الكاتب</strong></a></li>

</ul></h4>

<p>مدون موريتاني ابلغ من العمر 18 سنة اهتم بكل جديدومفيد

في عالم بلوجر كما يشرفني مساعدة أخواني العرب في تطوير خبراتهم</p>

</div></b:if> 

أنتهي الشرح تحياتي الكم

♫  ملحوظة هامة  ♫

الاضافة من تصميم مدونة كن مدون 

ويمكنك الحصول عليها أيضًا من هنا

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

من فضلك اضغظ لايك لمشاهدة لينك التحميل