اضافة ابتسامات كن مدون لمدونات بلوجر

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

<script src='https://cnmu.googlecode.com/svn/trunk/smiley.js' type='text/javascript'/>/*Smile*/
.cnmu-smilet {
  background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1whxaBy4y3cY5I2FgAUroq2h-w-lV5KI-3FoUlWGQl4bb2esjEWTJzEq1ydBXdMhLbpLoNBK6-mXX-vYX81d0g9QCgM_SQ2tREufGbQ3-Jf78rbzDORReM-uFBlNYTb_8_Wyd159WxStG/s3512/smily.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
  color: rgba(0, 0, 0, 0) !important;
  display: inline-block;
  height: 20px;
  position: relative;
  width: 20px;
  font: bold 16px arial;
  direction: ltr;
}
.cnmu-smilet:hover {cursor: default;}
.cnmu-smilet:hover:after {
  background: #fff;
  border: 2px solid #0062C4;
  border-radius: 100%;
  bottom: 26px;
  color: #000;
  content: attr(title);
  direction: ltr !important;
  display: inline-block;
  font: bold 16px arial;
  left: 20%;
  padding: 5px 1px;
  position: absolute;
  text-align: center;
  width: 30px;
  z-index: 98;
}

مع تغيير هذا اللون #0062C4 وهو لون إطار التلميحات التي تظهر عند تمرير الماوس على التسميات بلون مناسب لقالبك

فعلياً انت الآن ركبت الإضافة لكن بقي أمر وهو ان توضح للزوار كيف يستخدمونها

قم بالدخول الى إعدادات المدونة ثم >> مشاركات وتعليقات >> ثم قم بتحرير رسالة نموذج التعليق

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

"مرر الماوس على الإبتسامات لمعرفة الكود "

أو اى شئ كما تريد ثم اضف السطر التالي في الرسالة

=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r

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

أمر أخير يخص تنسيق الرسالة نفسها , ان اردت توسيط الكتابة في الرسالة يمكنك ان تستخدم الكود التالي

#threaded-comment-form p, .comment-form p {text-align: center !important;}

يمكنك ايضاًُ مراجعة هذا الموضوع ان اردت تركيب التعليقات التفاعلية او ضبط الرسالة بحيث تظهر دائما فوق الصندوق ان كانت تظهر لديك تحته بعد التعليق