كيفية اضافة الوجوه الضاحكة ( emoticone) لتعليقات مدونة بلوجر

كيفية اضافة الوجوه الضاحكة ( emoticone) لتعليقات مدونة بلوجر

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

اولا

ادهب إلى لوحة تحكم بلوجر الرئيسية - قالب - تحرير HTML - متابعة - توسيع القالب  لا تنسى ان (تعمل نسخة احتياطية)

الخطوة 2.  استعمل من لوحة المفاتيح (CTRL + F) للبحث عن هذا الكود :

كود HTML:

</body>

الان ضع فوقه مباشرة، الكود التالي:

كود HTML:

<!--kolobok-smileys-->

<script src='http://helplogger.googlecode.com/svn/trunk/[helplogger.blogspot.com]smileys.js' type='text/javascript'/><noscript><a href='http://helplogger.blogspot.com/2012/04/how-to-add-emoticonssmileys-in-blogger.html' rel="nofollow" target='_blank'><span style='font-size: x-small;'>Add emoticons</span></a></noscript>

<!--kolobok-smileys-->

الخطوة 3. الآن قم بالبحث مجددا  عن هذا الرمز:

كود HTML:

<b:loop values='data:post.comments' var='comment'>

ضع فوقه الكود التالي:

كود HTML:

<div id='smileys'>

الخطوة 4. قم بالبحث مرة اخرى عن هدا الرمز

كود HTML:

</b:loop>

الان قم باضافة الرمز التالي بعده مباشرة:

كود HTML:

</div>

الخطوة 5. الآن قم بالبحث عن الكود التالي (ادا وجدته اكثر من مرة فالثاني هو المطلوب):

كود HTML:

<data:blogTeamBlogMessage/>

وإضافة هذا الرمز بعده :

كود HTML:

<script type='text/javascript'>

//<![CDATA[

function moreSmilies() {

    document.getElementById('smiley-more').style.display = 'inline';

    document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:lessSmilies()"><div style="font-size:small; font-weight:bold;color:#000000;">Hide Emoticons /<a href="http://helplogger.blogspot.com/2012/04/how-to-add-emoticonssmileys-in-blogger.html">Add Emoticons</div></a></span>';
}
function lessSmilies() {

('smiley-more').style.display = 'none';
    document.getElementByI
document.getElementByI

dd('smiley-toggle').innerHTML = '<a href="javascript:moreSmilies()"><div style="font-size:small; font-weight:bold;">Show Emoticons</div></a>';
}

]]>
/
/

</script>

<div class='emoticons'>

<span id='smiley-more' style='display: none;'>

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/smile3.gif'/>:)

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/sad3.gif'/>:(

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/laugh.gif'/>:))

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/cray-1.gif'/>:((

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/rofl-1.gif'/>=))

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/suicide-1.gif'/>=D&gt;

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/biggrin2.gif'/>:D

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/blum.gif'/>:P

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/shok.gif'/>:-O

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/eusa_think.gif'/>:-?

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/unsure.gif'/>:-SS

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/flowers1-1.gif'/>:-f

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/doh-1.gif'/>d(

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/air_kiss3.gif'/>:-*

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/threaten-1.gif'/>b-(

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/help2.gif'/>h-(

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/good-1.gif'/>g-)

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/beee-1.gif'/>5-p

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/yahoo2-1.gif'/>y-)

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/crazy3-1.gif'/>c-)

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/spiteful.gif'/>s-)

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/drinks-1.gif'/>d-)

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/cheer-1.gif'/>w-)

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/hi-1.gif'/>:-h

<img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/give_heart-1.gif'/>:X

</span>

<span id='smiley-toggle'><a href='javascript:moreSmilies()'><div style='font-size:small;font-weight:bold;'>Show Emoticons <img src='http://i1065.photobucket.com/albums/u389/treeofwisdom4/Smileys/smile3.gif'/></div></a></span>

</div>

الخطوة 6. والاخيرة ابحث عن هدا الرمز 

كود HTML:

]]></b:skin>

ثم اضافة الكود الاتي فوقه 

كود HTML:

.emoticons {-moz-background-clip: -moz-initial;-moz-background-origin: -moz-initial;-moz-background-inline-policy: -moz-initial;text-align: left;width:400px;}

.emoticons a, .emoticons a:hover {margin-left: 20px;text-decoration:none;}

ملاحظة: إذا كنت ترغب في تغيير حجم مربع التعبيرات، غير الرقم 400 الذي باللون الاحمر.

الخطوة 7. حفظ القالب والانتهاء من ذلك:]