الأربعاء، 24 أبريل 2013

طريقة إضافة أداة هل أعجبك الموضوع…؟ أسفل المواضيع


السلام عليكم ورحمة الله وبركاته


درس اليوم هو عن طريقة إضافة أداة هل أعجبك الموضوع…؟ أسفل المواضيع مدونة البلوجر, و هي تتضمن الإشتراك عبر 

البريد الإلكتروني , زري النشر و الإعجاب من الفايسبوك(Like-Send) و كذلك حسابك على الشبكات الإجتماعية
(Facebook-Twitter) بالإضافة إلى خلاصة المواضيع RSS

نمر لتطبيق الاضافة:

1.توجه للوحة التحكم الخاصة بمدونتك.
2.إختر قالب.
3.ثم تحرير HTML.
4.إضغط داخل مستطيل أكواد القالب مرة واحدة.
5.إضغط من لوحة المفاتيح keybord على CTRL+F.
6.تتحصل على مستطيل البحث داخل الأكواد,قم بالبحث عن الكود التالي:

<data:post.body/>

7. ثم ضع أسفل منه مباشرة الكود التالي:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
form.emailform{
margin:20px 0 0;
display:block;
clear:both;
}
.text{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgah09pLWOtl2Jezy9bh5EknBW-6cjWnMBiwAO3wBmfG8Sk6J8fyqgb2xdQihR8IO-YDduOfCSDKvWcS1fOEK01e8OBEVCgOWtbapVsogLnn1GuCevoG7zbJuqxdZw5Q0bm4wrBM08X-ipK/s28/w2b-mail.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 35px;
color:#666;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.button{
color:#666;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #D3D3D3;
cursor: pointer;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-goog-ms-border-radius: 4px;
border-radius: 4px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
#doulike-outer {
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-goog-ms-border-radius: 10px 10px 10px 10px;
border-radius: 10px;
background: none repeat scroll 0 0 transparent;
border: 1px solid #000000;
padding: 8px;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width:480px;
}
#doulike-outer:hover{
background: none repeat scroll 0 0 #FFF;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
#doulike-outer td{
padding:3px 0;
}
</style>
<div id='doulike-outer'>
<div id='doulike'>
<table width='100%'>
<tbody>
<span style='font-style: bold; font-size: 30px; font-family: arial,sans-serif, verdana;  color:#11958A;'>هل أعجبك الموضوع ...&#1567;</span>
<tr>
<td>
<div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='button_count' send='true' show_faces='false' width='300'/>
</td>
</tr>
<tr>
<td align='right'> <p style='color:#666; font-style:normal; margin:0px 0px 5px 0px; '> اشترك معنا و تابع جديد المدونة :)   </p>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=tntbystc&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='blogspot/ZCvgi'/>
<input name='loc' type='hidden' value='ar'/>
<input class='text' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;بريدك الإلكتروني...&quot;;}' onfocus='if (this.value == &quot;بريدك الإلكتروني...&quot;) {this.value = &quot;&quot;}' type='text' value='بريدك الإلكتروني...'/>
<input alt='' class='button' title='' type='submit' value='اشترك'/>
</form>
</td>
<td><p style='color:#666; font-style:normal; margin:0px 0px 5px 0px;  '>كن من متابعينا </p>
<a href='http://feeds.feedburner.com/blogspot/ZCvgi' rel='nofollow' target='_blank' title='تابعنا عبر خلاصات المدونة'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFN4WktdeEcs-CXDHmStECva3ibbItpfa7YNCKLzeZS6gQBeQXCRl5bTlFfkLNXExEHLygSS_aelxeZ-cnxXUbq5kNoDozPytb2CzZYzzUf-MX-hZJ4G47xrKdQAHq8vBnMLP_tmyb5Y0/s1600/RSS.png'/></a>
<a href='http://twitter.com/saidtrucs/' rel='nofollow' target='_blank' title='تابعنا عبر تويتر'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqCpg2mDJBUFRJ0EAZRtJ9MwGPen_zwqB-YcGxdZRrWtd0pS8VjTdIaZgaAQ-lQJUEBDlk0J8Hf2dUWwlphWMbQl3Uz-jCogCZsANvMUpvBmi1-vQxb4RiK6INtmT-uuWT8vYEGMOYNB0/s1600/twitter.png'/></a>
<a href='http://www.facebook.com/TRUCSINFORMATIQUES/' rel='nofollow' target='_blank' title='تابعنا عبر صفحتنا على الفايسبوك'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijizGGk9F6lq0fOXykg035GyECWZtY3o2nbADHlWbIZ7VfiPh37esoDtpP2yYzq_mk4KNqfKnTfnLSr5mfS7wGLolxKfKhb7327mS_Cgb6UNsOZF6zoTFrvljK-_xf2JL8B9R7jXQcSuQ/s1600/facebook.png'/></a>
</td>
</tr>
</tbody></table></div></div>
</b:if>

8.قم بالتعديلات التالية:
غير saidtrucs  المكتوبة بالأحمر بالإسم الخاص بك على Twitter.
غير TRUCSINFORMATIQUES المكتوبة بالأزرق بإسم صفحتك على Facebook.
غير blogspot/ZCvgi المكتوبة بالبنفسجي بالإسم الخاص بك على التغدية RSS.

9.ثم قم بحفض القالب. 

أتمنى أن يكون الدرس في متناول الجميع,في حال كان هنالك أي إستفسار لا تترددوا في وضع  إستفساراتكم في تعليق.

المرجو دعم الموقع من خلال الإشتراك على صفحاتنا على المواقع الإجتماعية و مشاركة الدروس مع أصدقاءكم.

0 التعليقات:

إرسال تعليق